Add mobile rules for headings and text modifiers

This commit is contained in:
Konstantinos Triantafyllou 2022-11-11 13:55:07 +02:00
parent e3e2a6ec11
commit a9acdff7b3
3 changed files with 18 additions and 6 deletions

View File

@ -10,18 +10,18 @@
/** H1, H2, H3, H4, H5, H6 */ /** H1, H2, H3, H4, H5, H6 */
@base-h1-font-size-m: 66px; @base-h1-font-size-m: 66px;
@base-h1-font-size: 52px; @base-h1-font-size:37px;
@base-h1-line-height: 1.25; @base-h1-line-height: 1.25;
@base-h2-font-size-m: 52px; @base-h2-font-size-m: 52px;
@base-h2-font-size: 41px; @base-h2-font-size: 32px;
@base-h2-line-height: 1.25; @base-h2-line-height: 1.25;
@base-h3-font-size: 41px; @base-h3-font-size: 26px;
@base-h3-line-height: 1.25; @base-h3-line-height: 1.25;
@base-h4-font-size: 32px; @base-h4-font-size: 23px;
@base-h4-line-height: 1.25; @base-h4-line-height: 1.25;
@base-h5-font-size: 26px; @base-h5-font-size: 20px;
@base-h5-line-height: 1.25; @base-h5-line-height: 1.25;
@base-h6-font-size: 20px; @base-h6-font-size: 18px;
@base-h6-line-height: 1.34; @base-h6-line-height: 1.34;
/** Selection */ /** Selection */

View File

@ -2,22 +2,27 @@
@heading-line-height: 1.25; @heading-line-height: 1.25;
@heading-small-font-size-l: 74px; @heading-small-font-size-l: 74px;
@heading-small-font-size: 41px;
@heading-small-font-weight: @heading-font-weight; @heading-small-font-weight: @heading-font-weight;
@heading-small-line-height: @heading-line-height; @heading-small-line-height: @heading-line-height;
@heading-medium-font-size-l: 83px; @heading-medium-font-size-l: 83px;
@heading-medium-font-size: 52px;
@heading-medium-font-weight: @heading-font-weight; @heading-medium-font-weight: @heading-font-weight;
@heading-medium-line-height: @heading-line-height; @heading-medium-line-height: @heading-line-height;
@heading-large-font-size-l: 94px; @heading-large-font-size-l: 94px;
@heading-large-font-size: 52px;
@heading-large-font-weight: @heading-font-weight; @heading-large-font-weight: @heading-font-weight;
@heading-large-line-height: @heading-line-height; @heading-large-line-height: @heading-line-height;
@heading-xlarge-font-size-l: 119px; @heading-xlarge-font-size-l: 119px;
@heading-xlarge-font-size: 52px;
@heading-xlarge-font-weight: @heading-font-weight; @heading-xlarge-font-weight: @heading-font-weight;
@heading-xlarge-line-height: @heading-line-height; @heading-xlarge-line-height: @heading-line-height;
@heading-2xlarge-font-size-l: 133px; @heading-2xlarge-font-size-l: 133px;
@heading-2xlarge-font-size: 52px;
@heading-2xlarge-font-weight: @heading-font-weight; @heading-2xlarge-font-weight: @heading-font-weight;
@heading-2xlarge-line-height: @heading-line-height; @heading-2xlarge-line-height: @heading-line-height;

View File

@ -1,3 +1,4 @@
@text-large-font-size-medium-max: @global-large-font-size - 2px;
@text-xsmall-font-size: @global-xsmall-font-size; @text-xsmall-font-size: @global-xsmall-font-size;
@text-xsmall-line-height: 1.5 * @global-xsmall-font-size; @text-xsmall-line-height: 1.5 * @global-xsmall-font-size;
@text-small-line-height: 1.5 * @global-small-font-size; @text-small-line-height: 1.5 * @global-small-font-size;
@ -37,5 +38,11 @@
} }
} }
@media only screen and (max-width: @breakpoint-medium-max) {
.uk-text-large {
font-size: @text-large-font-size-medium-max !important;
}
}