diff options
author | David O'Regan <doregan@gitlab.com> | 2021-05-15 03:37:26 +0300 |
---|---|---|
committer | David O'Regan <doregan@gitlab.com> | 2021-05-17 04:10:33 +0300 |
commit | 5a21fa346c54a2c00cdb4c2e96740190b1f5292c (patch) | |
tree | f67c5a9abe77886bbf6cf171b485c57ce1ed923f /content | |
parent | 85d4653d7c7ce909ea1c9ee496dbac3aa0284fd0 (diff) |
Remove GlMarkdown class
Diffstat (limited to 'content')
-rw-r--r-- | content/assets/stylesheets/_mixins.scss | 3 | ||||
-rw-r--r-- | content/assets/stylesheets/_typography.scss | 8 | ||||
-rw-r--r-- | content/assets/stylesheets/_variables.scss | 52 | ||||
-rw-r--r-- | content/assets/stylesheets/help.scss | 2 | ||||
-rw-r--r-- | content/assets/stylesheets/mixins/_functions.scss | 55 |
5 files changed, 30 insertions, 90 deletions
diff --git a/content/assets/stylesheets/_mixins.scss b/content/assets/stylesheets/_mixins.scss index 88e81681..0bc2be74 100644 --- a/content/assets/stylesheets/_mixins.scss +++ b/content/assets/stylesheets/_mixins.scss @@ -1,10 +1,9 @@ --- -version: 1 +version: 2 --- // Mixins -@import 'mixins/functions'; @import 'mixins/breakpoints'; @import 'mixins/screen-reader'; @import 'mixins/md-typography'; diff --git a/content/assets/stylesheets/_typography.scss b/content/assets/stylesheets/_typography.scss index 92ca1fca..702e93fa 100644 --- a/content/assets/stylesheets/_typography.scss +++ b/content/assets/stylesheets/_typography.scss @@ -1,17 +1,13 @@ --- -version: 1 +version: 2 --- -// Typography - @import 'variables'; @import 'mixins/breakpoints'; @import 'mixins/md-typography'; @import 'mixins/spacing'; -// Documentation Markdown typescale - -.gl-markdown { +.gl-docs { p, ul, ol, diff --git a/content/assets/stylesheets/_variables.scss b/content/assets/stylesheets/_variables.scss index 15072b60..bb1f0f12 100644 --- a/content/assets/stylesheets/_variables.scss +++ b/content/assets/stylesheets/_variables.scss @@ -317,9 +317,9 @@ $gl-font-weights: ( 'bold': $gl-font-weight-bold, ); -$gl-font-size-monospace: px-to-rem(13px); -$gl-font-size-monospace-lg: px-to-rem(15px); -$gl-font-size-monospace-sm: px-to-rem(11px); +$gl-font-size-monospace: 0.813rem; +$gl-font-size-monospace-lg: 0.938rem; +$gl-font-size-monospace-sm: 0.688rem; // Misc mixins @@ -373,20 +373,20 @@ $gl-font-size-monospace-sm: px-to-rem(11px); $gl-border-size-1: 1px; // Responsive breakpoints -$breakpoint-sm: px-to-rem(576px); -$breakpoint-md: px-to-rem(768px); -$breakpoint-lg: px-to-rem(992px); -$breakpoint-xl: px-to-rem(1200px); +$breakpoint-sm: 36rem; +$breakpoint-md: 48rem; +$breakpoint-lg: 62rem; +$breakpoint-xl: 75rem; // Line height -$gl-line-height-16: px-to-rem(16px); -$gl-line-height-20: px-to-rem(20px); -$gl-line-height-24: px-to-rem(24px); -$gl-line-height-28: px-to-rem(28px); -$gl-line-height-32: px-to-rem(32px); -$gl-line-height-36: px-to-rem(36px); -$gl-line-height-44: px-to-rem(44px); -$gl-line-height-52: px-to-rem(52px); +$gl-line-height-16: 1rem; +$gl-line-height-20: 1.25rem; +$gl-line-height-24: 1.5rem; +$gl-line-height-28: 1.75rem; +$gl-line-height-32: 2rem; +$gl-line-height-36: 2.25rem; +$gl-line-height-44: 2.75rem; +$gl-line-height-52: 3.25rem; // Layout $grid-size: 0.5rem; @@ -410,19 +410,19 @@ $gl-spacing-scale-20: 20 * $grid-size; // Markdown typescale // default (min-width: 0) -$gl-font-size-markdown: px-to-rem(16px); -$gl-font-size-markdown-sm: px-to-rem(14px); +$gl-font-size-markdown: 1rem; +$gl-font-size-markdown-sm: 0.875rem; -$gl-font-size-markdown-h1: px-to-rem(28px); -$gl-font-size-markdown-h2: px-to-rem(23px); -$gl-font-size-markdown-h3: px-to-rem(19px); +$gl-font-size-markdown-h1: 1.75rem; +$gl-font-size-markdown-h2: 1.438rem; +$gl-font-size-markdown-h3: 1.188rem; // breakpoint (min-width: 768px) -$gl-font-size-markdown-h1-md: px-to-rem(31px); -$gl-font-size-markdown-h2-md: px-to-rem(25px); -$gl-font-size-markdown-h3-md: px-to-rem(20px); +$gl-font-size-markdown-h1-md: 1.938rem; +$gl-font-size-markdown-h2-md: 1.563rem; +$gl-font-size-markdown-h3-md: 1.25rem; // breakpoint (min-width: 1200px) -$gl-font-size-markdown-h1-xl: px-to-rem(45px); -$gl-font-size-markdown-h2-xl: px-to-rem(32px); -$gl-font-size-markdown-h3-xl: px-to-rem(23px); +$gl-font-size-markdown-h1-xl: 2.813rem; +$gl-font-size-markdown-h2-xl: 2rem; +$gl-font-size-markdown-h3-xl: 1.438rem; diff --git a/content/assets/stylesheets/help.scss b/content/assets/stylesheets/help.scss index 988fdea0..db1fa84f 100644 --- a/content/assets/stylesheets/help.scss +++ b/content/assets/stylesheets/help.scss @@ -1,5 +1,5 @@ --- -version: 5 +version: 6 --- @import 'variables'; diff --git a/content/assets/stylesheets/mixins/_functions.scss b/content/assets/stylesheets/mixins/_functions.scss deleted file mode 100644 index 0a7aec9f..00000000 --- a/content/assets/stylesheets/mixins/_functions.scss +++ /dev/null @@ -1,55 +0,0 @@ ---- -version: 1 ---- - -/* -* SASS preserves units in arithmetic operations. For example: -* 12em * 0 = 0em. This function return the unit of a numeric value. -* -* For more examples, see: https://codepen.io/paulgv/pen/XWrqMgQ -*/ -@function extract-unit($number) { - @return $number * 0 + 1; -} - -@function strip-unit($number) { - @if type-of($number) == 'number' and not unitless($number) { - @return $number / extract-unit($number); - } - - @return $number; -} - -@function single-unit-rem($value, $font-size-base) { - @if (extract-unit($value) != 1px) { - @return $value; - } - - $converted: $value / $font-size-base; - - @return strip-unit($converted) * 1rem; -} - -@function multiple-units-rem($values, $font-size-base) { - $rem-values: (); - - @each $value in $values { - $rem-values: append($rem-values, single-unit-rem($value, $font-size-base)); - } - - @return $rem-values; -} - -@function px-to-rem($px, $font-size-base: 16px) { - @if type-of($px) == 'number' { - @return single-unit-rem($px, $font-size-base); - } @else if type-of($px) == 'list' { - @return multiple-units-rem($px, $font-size-base); - } @else { - @return $px; - } -} - -@function if-important($important) { - @return #{if($important, '!important', '')}; -} |