mobile updates
This commit is contained in:
parent
be9bc4f65c
commit
af5f3d4a29
5 changed files with 54 additions and 17 deletions
|
@ -21,6 +21,7 @@
|
|||
}
|
||||
|
||||
body {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: var(--l-yellow);
|
||||
|
@ -41,7 +42,7 @@ nav {
|
|||
background-color: var(--d-red);
|
||||
}
|
||||
nav a {
|
||||
margin: 0 10px;
|
||||
margin: 0 5px;
|
||||
background-color: var(--red);
|
||||
color: var(--white);
|
||||
|
||||
|
@ -81,7 +82,7 @@ nav a:hover {
|
|||
padding: 10px 20px;
|
||||
}
|
||||
#headnav a:first-child {
|
||||
margin-left: 20px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
#headnav .spacer {
|
||||
flex-grow: 1;
|
||||
|
@ -102,3 +103,35 @@ nav a:hover {
|
|||
#socials a:hover {
|
||||
background-color: var(--l-red);
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 520px) {
|
||||
#headnav {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
width: 25px;
|
||||
writing-mode: vertical-rl;
|
||||
text-orientation: mixed;
|
||||
margin: auto 0;
|
||||
margin-right: 5px;
|
||||
transform: rotate(0deg) !important;
|
||||
|
||||
z-index: 100;
|
||||
}
|
||||
#headnav a {
|
||||
padding: 5px 0;
|
||||
margin: 5px 0;
|
||||
}
|
||||
body {
|
||||
width: calc(100% - 25px) !important;
|
||||
margin: auto 0 auto auto !important;
|
||||
}
|
||||
#headnav a:first-child {
|
||||
margin-left: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
#bnav {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue