Add media queries for mobile support
This commit is contained in:
parent
043eb0b966
commit
33be423cf5
3 changed files with 145 additions and 113 deletions
|
@ -12,24 +12,26 @@
|
|||
--medium-font-weight: 500;
|
||||
--semi-bold-font-weight: 600;
|
||||
--bold-font-weight: 700;
|
||||
--text-font-size: 0.8rem;
|
||||
--text-font-size: 1rem;
|
||||
--text-line-height: calc(var(--text-font-size) * 1.2);
|
||||
--footnote-font-size: 0.6rem;
|
||||
--footnote-font-size: 0.8rem;
|
||||
--footnote-line-height: calc(var(--footnote-font-size) * 1.2);
|
||||
--h1-font-size: 1.6rem;
|
||||
--h1-line-height: calc(var(--h1-font-size) * 1.2);
|
||||
--h2-font-size: 1.2rem;
|
||||
--h2-font-size: 1.4rem;
|
||||
--h2-line-height: calc(var(--h2-font-size) * 1.2);
|
||||
--h3-font-size: 1rem;
|
||||
--h3-font-size: 1.2rem;
|
||||
--h3-line-height: calc(var(--h3-font-size) * 1.2);
|
||||
|
||||
// Dimensions
|
||||
|
||||
--logo-width: 2rem;
|
||||
--logo-height: 4rem;
|
||||
--icon-size: 1.75rem;
|
||||
--sidebar-vertical-padding: 1rem;
|
||||
--sidebar-horizontal-padding: 1rem;
|
||||
--logo-width: 6rem;
|
||||
--logo-height: 3rem;
|
||||
--icon-size: 2.25rem;
|
||||
--sidebar-padding-top: calc(1rem + var(--logo-height) + 1rem);
|
||||
--sidebar-padding-right: 1rem;
|
||||
--sidebar-padding-bottom: 1rem;
|
||||
--sidebar-padding-left: 1rem;
|
||||
|
||||
// Colors
|
||||
|
||||
|
@ -50,18 +52,11 @@ $desktop-media-query: 62rem;
|
|||
|
||||
:root {
|
||||
|
||||
// Fonts
|
||||
|
||||
--text-font-size: 1rem;
|
||||
--footnote-font-size: 0.8rem;
|
||||
--h1-font-size: 1.8rem;
|
||||
--h2-font-size: 1.4rem;
|
||||
--h3-font-size: 1.2rem;
|
||||
|
||||
// Dimensions
|
||||
|
||||
--logo-width: 6rem;
|
||||
--logo-height: 3rem;
|
||||
--icon-size: 2.25rem;
|
||||
--sidebar-padding-top: 1rem;
|
||||
--sidebar-padding-right: 1rem;
|
||||
--sidebar-padding-bottom: 1rem;
|
||||
--sidebar-padding-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue