refactor: standardize using media queries (#5630)

* refactor: standardize using media queries

* Better reusing
This commit is contained in:
Alexey Pyltsyn 2021-10-01 17:09:51 +03:00 committed by GitHub
parent afff053cc9
commit a96878048d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 6 additions and 6 deletions

View file

@ -51,7 +51,7 @@ html[data-announcement-bar-initially-dismissed='true'] .announcementBar {
text-decoration: underline; text-decoration: underline;
} }
@media screen and (min-width: 1024px) { @media (min-width: 997px) {
:root { :root {
--docusaurus-announcement-bar-height: 30px; --docusaurus-announcement-bar-height: 30px;
} }

View file

@ -37,7 +37,7 @@
color: var(--ifm-color-primary) !important; color: var(--ifm-color-primary) !important;
} }
@media only screen and (max-width: 996px) { @media (max-width: 996px) {
.sidebar { .sidebar {
display: none; display: none;
} }

View file

@ -10,7 +10,7 @@
margin-top: 0; margin-top: 0;
} }
@media only screen and (min-width: 997px) { @media (min-width: 997px) {
.docItemCol { .docItemCol {
max-width: 75% !important; max-width: 75% !important;
} }

View file

@ -11,7 +11,7 @@
font-size: smaller; font-size: smaller;
} }
@media only screen and (min-width: 997px) { @media (min-width: 997px) {
.lastUpdated { .lastUpdated {
text-align: right; text-align: right;
} }

View file

@ -8,7 +8,7 @@
/* /*
Hide toggle in small viewports Hide toggle in small viewports
*/ */
@media screen and (max-width: 997px) { @media (max-width: 996px) {
.toggle { .toggle {
display: none; display: none;
} }

View file

@ -12,7 +12,7 @@
top: calc(var(--ifm-navbar-height) + 1rem); top: calc(var(--ifm-navbar-height) + 1rem);
} }
@media only screen and (max-width: 996px) { @media (max-width: 996px) {
.tableOfContents { .tableOfContents {
display: none; display: none;
} }