Feat: hamburger button for phonemode
This commit is contained in:
parent
1764489028
commit
0607f2a69a
@ -124,7 +124,7 @@ aside {
|
|||||||
|
|
||||||
.title {
|
.title {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding-bottom: 20px;
|
//padding-bottom: 20px;
|
||||||
padding-top: 20px;
|
padding-top: 20px;
|
||||||
|
|
||||||
img {
|
img {
|
||||||
@ -144,8 +144,84 @@ aside {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
nav {
|
nav {
|
||||||
|
.toctree {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
#toggle {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
#toggle:checked + .toctree {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
label {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 40px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
ul.toctree {
|
||||||
|
display: none;
|
||||||
|
padding-inline-start: 0px;
|
||||||
|
h2 {
|
||||||
|
background-color: @navbar-bg;
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
ul {
|
||||||
|
padding-inline-start: 0px;
|
||||||
|
display: block;
|
||||||
|
li {
|
||||||
|
padding: 0;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
color: @navbar-text-color;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
li.toctree-l1 {
|
||||||
|
li.current{
|
||||||
|
background-color: @navbar-toctree-l2-sel-bg;
|
||||||
|
color: @navbar-toctree-l2-sel-txt;
|
||||||
|
padding: 10px;
|
||||||
|
border-left: solid 2px @orange;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
li.current{
|
||||||
|
a {
|
||||||
|
background-color: @navbar-toctree-l1-sel-bg;
|
||||||
|
color: @navbar-toctree-l1-sel-txt;
|
||||||
|
border-top: solid 1px @light-grey;
|
||||||
|
border-bottom: solid 1px @light-grey;
|
||||||
|
border-left: solid 2px @orange;
|
||||||
|
}
|
||||||
|
a:hover {
|
||||||
|
color: @orange;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
li.toctree-l2 {
|
||||||
|
a {
|
||||||
|
border: none;
|
||||||
|
background-color: @navbar-toctree-l2-bg;
|
||||||
|
color: @navbar-toctree-l2-txt;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
a:hover {
|
||||||
|
color: @orange;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
ul.list {
|
||||||
|
li {
|
||||||
|
display: inline;
|
||||||
|
line-height: 1.6em;
|
||||||
|
font-size: 1.28em;
|
||||||
|
text-transform: lowercase;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.tagcloud {
|
.tagcloud {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
@ -440,68 +516,17 @@ ul.social {
|
|||||||
padding-top: 50px;
|
padding-top: 50px;
|
||||||
}
|
}
|
||||||
nav {
|
nav {
|
||||||
display: block;
|
|
||||||
background-color: @navbar-bg;
|
background-color: @navbar-bg;
|
||||||
h2 {
|
label, #toggle
|
||||||
background-color: @navbar-bg;
|
{
|
||||||
margin-bottom: 0;
|
display: none;
|
||||||
}
|
}
|
||||||
ul {
|
ul {
|
||||||
padding-inline-start: 0px;
|
padding-inline-start: 0px;
|
||||||
display: block;
|
display: block;
|
||||||
li {
|
|
||||||
padding: 0;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
ul.toctree {
|
ul.toctree {
|
||||||
li {
|
display: block;
|
||||||
a {
|
|
||||||
color: @navbar-text-color;
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
li.toctree-l1 {
|
|
||||||
li.current{
|
|
||||||
background-color: @navbar-toctree-l2-sel-bg;
|
|
||||||
color: @navbar-toctree-l2-sel-txt;
|
|
||||||
padding: 10px;
|
|
||||||
border-left: solid 2px @orange;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
li.current{
|
|
||||||
a {
|
|
||||||
background-color: @navbar-toctree-l1-sel-bg;
|
|
||||||
color: @navbar-toctree-l1-sel-txt;
|
|
||||||
border-top: solid 1px @light-grey;
|
|
||||||
border-bottom: solid 1px @light-grey;
|
|
||||||
border-left: solid 2px @orange;
|
|
||||||
}
|
|
||||||
a:hover {
|
|
||||||
color: @orange;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
li.toctree-l2 {
|
|
||||||
a {
|
|
||||||
border: none;
|
|
||||||
background-color: @navbar-toctree-l2-bg;
|
|
||||||
color: @navbar-toctree-l2-txt;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
a:hover {
|
|
||||||
color: @orange;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
ul.list {
|
|
||||||
li {
|
|
||||||
display: inline;
|
|
||||||
line-height: 1.6em;
|
|
||||||
font-size: 1.28em;
|
|
||||||
text-transform: lowercase;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
2
theme/static/stylesheet/style.min.css
vendored
2
theme/static/stylesheet/style.min.css
vendored
File diff suppressed because one or more lines are too long
@ -86,6 +86,9 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<nav>
|
<nav>
|
||||||
|
<label for="toggle">☰</label>
|
||||||
|
<input type="checkbox" id="toggle">
|
||||||
|
|
||||||
{% if TOCTREE %}
|
{% if TOCTREE %}
|
||||||
{% include "partial/toctree.html" %}
|
{% include "partial/toctree.html" %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
Loading…
Reference in New Issue
Block a user