1
0
mirror of https://github.com/osmarks/mycorrhiza.git synced 2025-01-06 10:00:26 +00:00

Make the top bar look ok on computers

This commit is contained in:
Timur Ismagilov 2021-07-15 14:35:01 +05:00
parent f8f4eb92c8
commit 2ace86b9ed
3 changed files with 347 additions and 318 deletions

View File

@ -596,17 +596,19 @@ kbd {
/*
* Top bar
*/
.top-bar a {
color: black;
text-decoration: none;
}
@media screen and (min-width: 800px) {
.top-bar {
padding: 0;
}
.top-bar ul {
padding: 0;
margin: 0;
}
ul.top-bar__wrapper {
.top-bar__wrapper {
display: grid;
padding: 0;
margin: 0 2rem;
grid-template-columns: 1fr 1fr 1fr;
}
.top-bar__section {
display: block;
@ -631,14 +633,37 @@ kbd {
.auth-links {
display: flex;
justify-content: flex-end;
margin-right: -.5rem;
}
.auth-links__box {
display: block;
line-height: 2rem;
}
.auth-links__link {
display: block;
padding: 0 .5rem;
}
.top-bar__section_home,
.top-bar__highlights {
display: flex;
padding: 0;
margin: 0 0 0 -.5rem;
}
.top-bar__home-link-wrapper,
.top-bar__highlight {
display: block;
margin-right: .5rem;
line-height: 2rem;
}
.top-bar__home-link,
.auth-links__link,
.top-bar__highlight-link {
display: block;
padding: 0 .5rem;
}
.top-bar__home-link:hover,
.auth-links__link:hover,
.top-bar__highlight-link:hover {
background-color: #eee;
}
}

View File

@ -21,7 +21,9 @@
<nav class="main-width top-bar">
<ul class="top-bar__wrapper">
<li class="top-bar__section top-bar__section_home">
<a class="top-bar__home-link" href="/">{%s cfg.WikiName %}</a>
<div class="top-bar__home-link-wrapper">
<a class="top-bar__home-link" href="/">{%s cfg.WikiName %}</a>
</div>
</li>
<li class="top-bar__section top-bar__section_search">
<form class="top-bar__search" method="GET" action="/title-search">
@ -33,19 +35,19 @@
<ul class="top-bar__auth auth-links">
<li class="auth-links__box auth-links__user-box">
{% if u.Group == "anon" %}
<a href="/login" class="auth-links__login-link">Login</a>
<a href="/login" class="auth-links__link auth-links__login-link">Login</a>
{% else %}
<a href="/hypha/{%s cfg.UserHypha %}/{%s u.Name %}" class="auth-links__user-link">{%s util.BeautifulName(u.Name) %}</a>
<a href="/hypha/{%s cfg.UserHypha %}/{%s u.Name %}" class="auth-links__link auth-links__user-link">{%s util.BeautifulName(u.Name) %}</a>
{% endif %}
</li>
{% if cfg.AllowRegistration && u.Group == "anon" %}
<li class="auth-links__box auth-links__register-box">
<a href="/register" class="auth-links__register-link">Register</a>
<a href="/register" class="auth-links__link auth-links__register-link">Register</a>
</li>
{% endif %}
{% if u.Group == "admin" %}
<li class="auth-links__box auth-links__admin-box">
<a href="/admin" class="auth-links__admin-link">Admin panel</a>
<a href="/admin" class="auth-links__link auth-links__admin-link">Admin panel</a>
</li>
{% endif %}
</ul>

File diff suppressed because it is too large Load Diff