hamburger now has a background, and is no longer the heaven trigram unicode symbol
This commit is contained in:
parent
23e5cc262c
commit
266298132a
2 changed files with 30 additions and 6 deletions
|
@ -1,4 +1,4 @@
|
|||
<div id='hamburger'>☰</div>
|
||||
<div id='hamburger'><div id='hb-icon'></div></div>
|
||||
<header id='header'>
|
||||
<h1>Menu</h1>
|
||||
<span class='internal'>
|
||||
|
|
|
@ -180,16 +180,40 @@ html.night header a:hover {
|
|||
|
||||
#hamburger {
|
||||
display: none;
|
||||
color: mediumpurple;
|
||||
font-size: 2em;
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
z-index: 1;
|
||||
transition: 0.2s all;
|
||||
padding: 10px;
|
||||
background: #fafafa;
|
||||
border-radius: 10px;
|
||||
height: 27px;
|
||||
width: 27px;
|
||||
}
|
||||
#hamburger.active {
|
||||
color: white;
|
||||
html.night #hamburger {
|
||||
background: #333;
|
||||
}
|
||||
#hb-icon {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
mediumpurple, mediumpurple 10%,
|
||||
#fafafa 10%, #fafafa 45%,
|
||||
mediumpurple 45%, mediumpurple 55%,
|
||||
#fafafa 55%, #fafafa 90%,
|
||||
mediumpurple 90%, mediumpurple 100%
|
||||
);
|
||||
}
|
||||
html.night #hb-icon {
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
mediumpurple, mediumpurple 10%,
|
||||
#333 10%, #333 45%,
|
||||
mediumpurple 45%, mediumpurple 55%,
|
||||
#333 55%, #333 90%,
|
||||
mediumpurple 90%, mediumpurple 100%
|
||||
);
|
||||
}
|
||||
|
||||
#theme-control {
|
||||
|
|
Loading…
Reference in a new issue