mirror of
https://github.com/yu-i-i/overleaf-cep.git
synced 2026-06-02 05:41:33 +02:00
Rebeka Dekany
3f11776ecd
* Remove components, core and modules LESS stylesheets * Remove variables LESS stylesheets * Remove app LESS stylesheets * Remove github-sync, onboarding LESS stylesheets * Remove main-light and IEEE LESS stylesheets * Remove Less loader configuration * Remove bootstrap-3 entrypoint * Rename bootstrap-5 entrypoint to bootstrap * Remove bootstrap-5 CSS folder and move stylesheets * Update CSS variables * Restore and update github-sync.scss path * Fix try-premium.scss path and fix undefined mixin error * Restore entrypoints * Simplify buildCssPath to always use main-style.css * Remove less from prettier formatting scripts * Remove less from addHook extension * Source format * Remove nvd3 file reference from prettierignore (equivalent of nvd3.scss) * Remove less and less-loader * Add SCSS files to pirates require hook GitOrigin-RevId: bd83c79f4d6ef7305d75993959a4dc5e7714ef9c
113 lines
2.8 KiB
SCSS
113 lines
2.8 KiB
SCSS
// This file provides CSS variables for font size and line height, plus Sass variables for base text size for Bootstrap
|
|
|
|
:root {
|
|
--font-sans: 'Noto Sans', sans-serif;
|
|
--font-size-01: 0.75rem; // 12px
|
|
--font-size-02: 0.875rem; // 14px
|
|
--font-size-03: 1rem; // 16px
|
|
--font-size-04: 1.125rem; // 18px
|
|
--font-size-05: 1.25rem; // 20px
|
|
--font-size-06: 1.5rem; // 24px
|
|
--font-size-07: 1.875rem; // 30px
|
|
--font-size-08: 2.25rem; // 36px
|
|
--font-size-09: 3rem; // 48px
|
|
--font-size-10: 3.25rem; // 52px
|
|
--font-size-11: 3.75rem; // 60px
|
|
--font-size-12: 4.5rem; // 72px
|
|
--font-size-13: 6em; // 96px
|
|
--line-height-01: 1rem; // 16px
|
|
--line-height-02: 1.25rem; // 20px
|
|
--line-height-03: 1.5rem; // 24px
|
|
--line-height-04: 1.75rem; // 28px
|
|
--line-height-05: 2rem; // 32px
|
|
--line-height-06: 2.5rem; // 40px
|
|
--line-height-07: 3rem; // 48px
|
|
--line-height-08: 4rem; // 64px
|
|
--line-height-09: 4.25rem; // 68px
|
|
--line-height-10: 5rem; // 80px
|
|
--line-height-11: 6rem; // 96px
|
|
--line-height-12: 8rem; // 128px
|
|
}
|
|
|
|
// Semantic styles, as Sass mixins
|
|
@mixin display-lg {
|
|
font-size: var(--font-size-13);
|
|
line-height: var(--line-height-12);
|
|
}
|
|
|
|
@mixin display-md {
|
|
font-size: var(--font-size-12);
|
|
line-height: var(--line-height-11);
|
|
}
|
|
|
|
@mixin display-sm {
|
|
font-size: var(--font-size-11);
|
|
line-height: var(--line-height-10);
|
|
}
|
|
|
|
@mixin display-xs {
|
|
font-size: var(--font-size-10);
|
|
line-height: var(--line-height-09);
|
|
}
|
|
|
|
@mixin heading-2xl {
|
|
font-size: var(--font-size-09);
|
|
line-height: var(--line-height-08);
|
|
}
|
|
|
|
@mixin heading-xl {
|
|
font-size: var(--font-size-08);
|
|
line-height: var(--line-height-07);
|
|
}
|
|
|
|
@mixin heading-lg {
|
|
font-size: var(--font-size-07);
|
|
line-height: var(--line-height-06);
|
|
}
|
|
|
|
@mixin heading-md {
|
|
font-size: var(--font-size-06);
|
|
line-height: var(--line-height-05);
|
|
}
|
|
|
|
@mixin heading-sm {
|
|
font-size: var(--font-size-05);
|
|
line-height: var(--line-height-04);
|
|
}
|
|
|
|
@mixin heading-xs {
|
|
font-size: var(--font-size-04);
|
|
line-height: var(--line-height-03);
|
|
}
|
|
|
|
@mixin body-lg {
|
|
font-size: var(--font-size-04);
|
|
line-height: var(--line-height-03);
|
|
}
|
|
|
|
@mixin body-base {
|
|
font-size: var(--font-size-03);
|
|
line-height: var(--line-height-03);
|
|
}
|
|
|
|
@mixin body-sm {
|
|
font-size: var(--font-size-02);
|
|
line-height: var(--line-height-02);
|
|
}
|
|
|
|
@mixin body-xs {
|
|
font-size: var(--font-size-01);
|
|
line-height: var(--line-height-01);
|
|
}
|
|
|
|
@mixin font-mono {
|
|
font-family: 'DM Mono', monospace;
|
|
|
|
// We're using the "ss05" (stylistic set 5) version of the DM Mono, by setting the `font-feature-settings` rule
|
|
// https://developer.mozilla.org/en-US/docs/Web/CSS/font-feature-settings
|
|
// We use the ss05 specifically to remove the "squiggle" below the f letter.
|
|
// You can try removing the `font-feature-settings` rule and check what happens to the letter "f",
|
|
// as it's quite hard to describe it with sentences alone
|
|
font-feature-settings: 'ss05';
|
|
}
|