adjust media query page sizes
Ensures its actually possible to read a page at a given size. Needs future work to add a stage between phone UI and half a 1080p monitor.
This commit is contained in:
parent
2ce79597b5
commit
24d3b1bfd2
|
@ -376,7 +376,7 @@ html.dark .typevariants {
|
|||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
@media (min-width: 65rem) {
|
||||
.root-nav {
|
||||
& .root-nav-entry {
|
||||
display: grid;
|
||||
|
@ -427,7 +427,7 @@ html.dark .typevariants {
|
|||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1280px) {
|
||||
@media (min-width: 85rem) {
|
||||
.root-nav {
|
||||
min-width: 45svw;
|
||||
}
|
||||
|
|
|
@ -80,7 +80,7 @@ ul {
|
|||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
@media (min-width: 65rem) {
|
||||
.docs,
|
||||
.docslayout-root {
|
||||
gap: 0.648rem;
|
||||
|
@ -109,7 +109,7 @@ ul {
|
|||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1280px) {
|
||||
@media (min-width: 85rem) {
|
||||
.docs {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
|
|
@ -95,7 +95,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
@media (min-width: 65rem) {
|
||||
.nav-wrapper-mobile {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
@ -313,7 +313,7 @@ button[data-close-modal] {
|
|||
--search-cancel-space: 5rem;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
@media (min-width: 65rem) {
|
||||
|
||||
/* difault styles */
|
||||
.search-label {
|
||||
|
|
|
@ -84,15 +84,15 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1280px) {
|
||||
@media (min-width: 768px) {
|
||||
@media (max-width: 85rem) {
|
||||
@media (min-width: 65rem) {
|
||||
.toc-toggle {
|
||||
--width: 25svw;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1280px) {
|
||||
@media (min-width: 85rem) {
|
||||
.toc-wrapper-mobile {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
@ -184,7 +184,7 @@ footer {
|
|||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
@media (min-width: 65rem) {
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
@ -212,5 +212,3 @@ footer {
|
|||
color: hsla(var(--white) 40 50 / 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
/* @media (min-width: 1280px) {} */
|
||||
|
|
|
@ -117,7 +117,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
@media (min-width: 65rem) {
|
||||
.main-page_hero-text {
|
||||
text-align: end;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue