mirror of
https://github.com/Sendouc/sendou.ink.git
synced 2026-07-18 16:43:56 -05:00
Fix bug main content not centered
Closes #494 A bit hacky but seems to work. Play with negative margins to get the content centered and set them to 0 before the menu overlaps with the content.
This commit is contained in:
parent
eb72e234f6
commit
a1b34698e1
|
|
@ -21,6 +21,7 @@ const Nav = () => {
|
|||
return (
|
||||
<Box
|
||||
width={expanded ? "175px" : "60px"}
|
||||
marginRight={expanded ? "-175px" : "-60px"}
|
||||
as="nav"
|
||||
flexShrink={0}
|
||||
position="sticky"
|
||||
|
|
|
|||
|
|
@ -29,19 +29,25 @@ header {
|
|||
row-gap: 1.5rem;
|
||||
column-gap: 1.5rem;
|
||||
grid-template-rows: 37px 1fr 100px;
|
||||
grid-template-columns: auto 1fr 175px;
|
||||
grid-template-columns: auto 1fr;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
@media (max-width: 1365px) {
|
||||
nav {
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
#__next {
|
||||
grid-template-columns: auto 1fr 0px;
|
||||
grid-template-columns: auto 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#__next {
|
||||
grid-template-columns: 0px 1fr 0px;
|
||||
grid-template-columns: 0px 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user