use a flexbox for the header sections
this is better than a float because I have always kind of hated how floating divs work, and this also orders and displays the navs better in elinks
This commit is contained in:
parent
ad33cf2e83
commit
5e41cde52e
@ -28,12 +28,15 @@ a:hover, a:active {
|
|||||||
border-bottom: 1px dotted #EEE;
|
border-bottom: 1px dotted #EEE;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.nav, div.styles {
|
div.header {
|
||||||
color: #BBB;
|
|
||||||
background: #222;
|
background: #222;
|
||||||
border-bottom: 1px solid #222;
|
border-bottom: 1px solid #222;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
div.nav, div.styles {
|
||||||
|
color: #BBB;
|
||||||
|
}
|
||||||
|
|
||||||
div.nav a, div.styles a {
|
div.nav a, div.styles a {
|
||||||
color: #BBB;
|
color: #BBB;
|
||||||
}
|
}
|
||||||
|
@ -28,12 +28,15 @@ a:hover, a:active {
|
|||||||
border-bottom: 1px dotted #111;
|
border-bottom: 1px dotted #111;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.nav, div.styles {
|
div.header {
|
||||||
color: #666;
|
|
||||||
background: #EEE;
|
background: #EEE;
|
||||||
border-bottom: 1px solid #CCC;
|
border-bottom: 1px solid #CCC;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
div.nav, div.styles {
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
|
||||||
div.nav a, div.styles a {
|
div.nav a, div.styles a {
|
||||||
color: #666;
|
color: #666;
|
||||||
}
|
}
|
||||||
|
@ -63,9 +63,13 @@ a:active {
|
|||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
div.header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
div.nav, div.styles {
|
div.nav, div.styles {
|
||||||
font-size: 0.75em;
|
font-size: 0.75em;
|
||||||
border-bottom: 1px solid #444;
|
|
||||||
padding: 0.25em 0.5em;
|
padding: 0.25em 0.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -73,10 +77,6 @@ div.nav a, div.styles a {
|
|||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.styles {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.content {
|
div.content {
|
||||||
font-size: 11pt;
|
font-size: 11pt;
|
||||||
|
|
||||||
|
@ -11,15 +11,17 @@
|
|||||||
<link rel="icon" href="{{ url_for('static', filename='img/favicon.png') }}">
|
<link rel="icon" href="{{ url_for('static', filename='img/favicon.png') }}">
|
||||||
|
|
||||||
<div class="site-wrap">
|
<div class="site-wrap">
|
||||||
<div class="styles">
|
<div class="header">
|
||||||
<a href="?style=dark">[dark]</a>
|
<div class="nav">
|
||||||
<a href="?style=light">[light]</a>
|
{% for nav in navs %}
|
||||||
</div>
|
<a href="{{ nav.1 }}">{{ nav.0 }}</a>
|
||||||
<div class="nav">
|
{% if not loop.last %} » {% endif %}
|
||||||
{% for nav in navs %}
|
{% endfor %}
|
||||||
<a href="{{ nav.1 }}">{{ nav.0 }}</a>
|
</div>
|
||||||
{% if not loop.last %} » {% endif %}
|
<div class="styles">
|
||||||
{% endfor %}
|
<a href="?style=dark">[dark]</a>
|
||||||
|
<a href="?style=light">[light]</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
{{ content }}
|
{{ content }}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user