DEV: Use more css vars (#18561)

Followup to #18518

This time it's mostly line-height vars and a couple of other uncommon vars.
This commit is contained in:
Jarek Radosz 2022-10-12 16:05:42 +02:00 committed by GitHub
parent 55909e30bc
commit 4170b9bb58
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
57 changed files with 122 additions and 122 deletions

View File

@ -145,7 +145,7 @@ $mobile-breakpoint: 700px;
tr { tr {
grid-template-columns: repeat(3, 1fr); grid-template-columns: repeat(3, 1fr);
display: grid; display: grid;
line-height: $line-height-medium; line-height: var(--line-height-medium);
padding: 8px 0; padding: 8px 0;
min-width: 0; min-width: 0;
td { td {
@ -547,7 +547,7 @@ $mobile-breakpoint: 700px;
} }
h1 { h1 {
font-size: var(--font-up-3); font-size: var(--font-up-3);
line-height: $line-height-medium; line-height: var(--line-height-medium);
color: var(--primary); color: var(--primary);
} }
.controls { .controls {
@ -708,7 +708,7 @@ section.details {
clear: both; clear: both;
text-align: right; text-align: right;
.btn { .btn {
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
@media (max-width: $mobile-breakpoint) { @media (max-width: $mobile-breakpoint) {
.btn { .btn {

View File

@ -23,7 +23,7 @@
width: 65%; width: 65%;
h1 { h1 {
display: inline-block; display: inline-block;
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
} }
.external-link { .external-link {

View File

@ -502,7 +502,7 @@
.ace_placeholder { .ace_placeholder {
font-family: inherit; font-family: inherit;
font-size: var(--font-up-1); font-size: var(--font-up-1);
color: $primary-high; color: var(--primary-high);
} }
.status-actions { .status-actions {
@ -573,7 +573,7 @@
margin: 0.15em 0 0; margin: 0.15em 0 0;
color: var(--primary-high); color: var(--primary-high);
font-size: var(--font-down-1); font-size: var(--font-down-1);
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
.invalid .hex input { .invalid .hex input {

View File

@ -568,7 +568,7 @@
.version-number { .version-number {
font-size: var(--font-up-2); font-size: var(--font-up-2);
line-height: $line-height-small; line-height: var(--line-height-small);
box-sizing: border-box; box-sizing: border-box;
font-weight: bold; font-weight: bold;
margin-bottom: 2em; margin-bottom: 2em;

View File

@ -81,7 +81,7 @@
padding: 3px 5px 3px 18px; padding: 3px 5px 3px 18px;
margin: 3px 0 3px 5px; margin: 3px 0 3px 5px;
position: relative; position: relative;
line-height: $line-height-small; line-height: var(--line-height-small);
cursor: default; cursor: default;
border: 1px dashed var(--primary-low-mid); border: 1px dashed var(--primary-low-mid);
border-radius: 3px; border-radius: 3px;
@ -95,7 +95,7 @@
.validation-error { .validation-error {
padding-top: 3px; padding-top: 3px;
font-size: var(--font-down-1); font-size: var(--font-down-1);
line-height: $line-height-large; line-height: var(--line-height-large);
} }
.validation-error { .validation-error {
color: var(--danger); color: var(--danger);

View File

@ -40,7 +40,7 @@
margin-left: 12px; margin-left: 12px;
@media (max-width: $mobile-breakpoint) { @media (max-width: $mobile-breakpoint) {
margin-left: 0; margin-left: 0;
line-height: $line-height-large; line-height: var(--line-height-large);
margin-top: 5px; margin-top: 5px;
} }
} }

View File

@ -94,7 +94,7 @@
max-width: 100%; max-width: 100%;
p { p {
margin-top: 0; margin-top: 0;
line-height: $line-height-large; line-height: var(--line-height-large);
font-size: var(--font-up-3); font-size: var(--font-up-3);
} }
} }
@ -215,7 +215,7 @@
} }
.topic-list-data { .topic-list-data {
line-height: $line-height-large; line-height: var(--line-height-large);
text-align: left; text-align: left;
vertical-align: middle; vertical-align: middle;
} }
@ -286,7 +286,7 @@
margin-top: 0.33em; margin-top: 0.33em;
color: var(--primary-high); color: var(--primary-high);
word-wrap: break-word; word-wrap: break-word;
line-height: $line-height-large; line-height: var(--line-height-large);
padding-right: 20px; padding-right: 20px;
} }
@ -424,5 +424,5 @@ div.education {
.topic-post-badges { .topic-post-badges {
white-space: nowrap; white-space: nowrap;
align-self: center; align-self: center;
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }

View File

@ -11,7 +11,7 @@
.account-created { .account-created {
.ac-message { .ac-message {
font-size: var(--font-up-1); font-size: var(--font-up-1);
line-height: $line-height-large; line-height: var(--line-height-large);
} }
.activation-controls { .activation-controls {
button { button {

View File

@ -9,7 +9,7 @@
max-width: 100%; max-width: 100%;
@include ellipsis; @include ellipsis;
vertical-align: text-top; vertical-align: text-top;
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
&.with-topics { &.with-topics {
.subcategories-with-subcategories { .subcategories-with-subcategories {
@ -163,7 +163,7 @@
font-size: var(--font-up-2); font-size: var(--font-up-2);
margin-bottom: 0.5em; margin-bottom: 0.5em;
margin-top: 0.25em; margin-top: 0.25em;
line-height: $line-height-medium; line-height: var(--line-height-medium);
text-align: center; text-align: center;
color: var(--primary); color: var(--primary);
overflow: hidden; overflow: hidden;
@ -189,7 +189,7 @@
} }
.category-text-title { .category-text-title {
order: 2; order: 2;
line-height: $line-height-medium; line-height: var(--line-height-medium);
overflow: hidden; overflow: hidden;
margin-bottom: 0.25em; margin-bottom: 0.25em;
word-wrap: break-word; word-wrap: break-word;

View File

@ -448,7 +448,7 @@ div.ac-wrap div.item a.remove,
.remove-link { .remove-link {
margin-left: 4px; margin-left: 4px;
font-size: var(--font-down-1); font-size: var(--font-down-1);
line-height: $line-height-small; line-height: var(--line-height-small);
padding: 1px 3.5px; padding: 1px 3.5px;
border-radius: 12px; border-radius: 12px;
box-sizing: border-box; box-sizing: border-box;
@ -471,10 +471,10 @@ div.ac-wrap {
div.item { div.item {
float: left; float: left;
padding: 4px 10px; padding: 4px 10px;
line-height: $line-height-large; line-height: var(--line-height-large);
span { span {
display: inline-block; display: inline-block;
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
} }

View File

@ -90,7 +90,7 @@ h3,
h4, h4,
h5, h5,
h6 { h6 {
font-family: $heading-font-family; font-family: var(--heading-font-family);
margin-top: 0; margin-top: 0;
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
@ -145,7 +145,7 @@ input {
margin-top: 0.17em; margin-top: 0.17em;
margin-right: 0.43em; margin-right: 0.43em;
margin-left: 0.1em; margin-left: 0.1em;
line-height: $line-height-small; line-height: var(--line-height-small);
cursor: pointer; cursor: pointer;
flex-shrink: 0; // Adding for safety, Safari will shrink checkboxes flex-shrink: 0; // Adding for safety, Safari will shrink checkboxes
} }
@ -534,7 +534,7 @@ table {
right: 70px; right: 70px;
top: 60px; top: 60px;
width: 230px; width: 230px;
line-height: $line-height-medium; line-height: var(--line-height-medium);
.first-notification, .first-notification,
.read-later { .read-later {
@ -655,11 +655,11 @@ table {
} }
.control-label { .control-label {
font-family: $heading-font-family; font-family: var(--heading-font-family);
font-weight: bold; font-weight: bold;
font-size: var(--font-up-2); font-size: var(--font-up-2);
line-height: $line-height-large; line-height: var(--line-height-large);
} }
.controls { .controls {
@ -860,7 +860,7 @@ table {
} }
.broken-theme-alert { .broken-theme-alert {
font-size: $base-font-size; font-size: var(--base-font-size);
font-weight: bold; font-weight: bold;
padding: 5px 0; padding: 5px 0;
background: var(--danger); background: var(--danger);

View File

@ -86,7 +86,7 @@
span { span {
width: 100%; width: 100%;
word-break: break-word; word-break: break-word;
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
} }
} }
@ -148,10 +148,10 @@
} }
&.groups-notifications-form { &.groups-notifications-form {
.control-instructions { .control-instructions {
color: $primary-medium; color: var(--primary-medium);
margin-bottom: 10px; margin-bottom: 10px;
font-size: var(--font-down-1); font-size: var(--font-down-1);
line-height: $line-height-large; line-height: var(--line-height-large);
} }
.category-selector, .category-selector,

View File

@ -181,7 +181,7 @@
.d-icon { .d-icon {
width: 100%; width: 100%;
font-size: var(--font-up-4); font-size: var(--font-up-4);
line-height: $line-height-large; line-height: var(--line-height-large);
display: inline-block; display: inline-block;
color: var(--header_primary-low-mid); color: var(--header_primary-low-mid);
} }
@ -250,7 +250,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
height: 100%; height: 100%;
line-height: $line-height-medium; line-height: var(--line-height-medium);
padding: 0 1.5em 0 0.5em; padding: 0 1.5em 0 0.5em;
// we need to hide overflow in both to truncate the title in a flexbox // we need to hide overflow in both to truncate the title in a flexbox
overflow: hidden; overflow: hidden;

View File

@ -325,7 +325,7 @@ body.invite-page {
.instructions { .instructions {
margin-top: 0.15em; margin-top: 0.15em;
color: var(--primary-medium); color: var(--primary-medium);
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
} }
} }
@ -402,7 +402,7 @@ body.invite-page {
margin: 0; margin: 0;
font-size: var(--font-down-1); font-size: var(--font-down-1);
font-weight: normal; font-weight: normal;
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
.tip { .tip {
font-size: var(--font-down-1); font-size: var(--font-down-1);

View File

@ -261,7 +261,7 @@ button {
.mfp-close { .mfp-close {
width: 44px; width: 44px;
height: 44px; height: 44px;
line-height: $line-height-large; line-height: var(--line-height-large);
position: absolute; position: absolute;
right: 0; right: 0;
top: 0; top: 0;
@ -307,7 +307,7 @@ button {
right: 0; right: 0;
color: $controls-text-color; color: $controls-text-color;
font-size: var(--font-down-1); font-size: var(--font-down-1);
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
// Navigation arrows // Navigation arrows
@ -459,7 +459,7 @@ button {
color: $caption-subtitle-color; color: $caption-subtitle-color;
display: block; display: block;
font-size: var(--font-down-1); font-size: var(--font-down-1);
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
figure { figure {
margin: 0; margin: 0;
@ -475,7 +475,7 @@ button {
} }
.mfp-title { .mfp-title {
text-align: left; text-align: left;
line-height: $line-height-medium; line-height: var(--line-height-medium);
color: $caption-title-color; color: $caption-title-color;
word-wrap: break-word; word-wrap: break-word;
padding-right: 36px; // leave some space for counter at right side padding-right: 36px; // leave some space for counter at right side
@ -561,7 +561,7 @@ button {
right: 0; right: 0;
width: 35px; width: 35px;
height: 35px; height: 35px;
line-height: $line-height-large; line-height: var(--line-height-large);
background: rgba(0, 0, 0, 0.6); background: rgba(0, 0, 0, 0.6);
position: fixed; position: fixed;
text-align: center; text-align: center;

View File

@ -223,7 +223,7 @@
} }
justify-content: unset; justify-content: unset;
line-height: $line-height-large; line-height: var(--line-height-large);
width: 100%; width: 100%;
.d-icon { .d-icon {
@ -325,7 +325,7 @@
display: inline; display: inline;
padding: 0; padding: 0;
font-size: var(--font-down-1); font-size: var(--font-down-1);
line-height: $line-height-large; line-height: var(--line-height-large);
} }
.badge-wrapper { .badge-wrapper {
&.bar, &.bar,

View File

@ -311,7 +311,7 @@
.delete-user-modal { .delete-user-modal {
.modal-footer { .modal-footer {
.btn { .btn {
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
} }
} }
@ -452,7 +452,7 @@
.flag-action-type-details { .flag-action-type-details {
width: 100%; width: 100%;
max-width: 500px; max-width: 500px;
line-height: $line-height-large; line-height: var(--line-height-large);
} }
} }

View File

@ -5,7 +5,7 @@
h1.title { h1.title {
font-size: var(--font-up-5); font-size: var(--font-up-5);
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
&-search { &-search {

View File

@ -372,14 +372,14 @@ pre.onebox code ol.lines li:before {
text-align: right; text-align: right;
padding-right: 5px; padding-right: 5px;
font-size: var(--font-down-1); font-size: var(--font-down-1);
line-height: $line-height-large; line-height: var(--line-height-large);
content: counter(li-counter); content: counter(li-counter);
counter-increment: li-counter; counter-increment: li-counter;
} }
pre.onebox code ol { pre.onebox code ol {
margin-left: 0; margin-left: 0;
line-height: $line-height-large; line-height: var(--line-height-large);
} }
pre.onebox code { pre.onebox code {
background-color: var(--primary-very-low); background-color: var(--primary-very-low);
@ -647,7 +647,7 @@ aside.onebox.twitterstatus .onebox-body {
.date { .date {
display: flex; display: flex;
line-height: $line-height-small; line-height: var(--line-height-small);
.timestamp { .timestamp {
color: var(--primary-medium); color: var(--primary-medium);
@ -690,7 +690,7 @@ aside.onebox.twitterstatus .onebox-body {
.album-title { .album-title {
width: 100%; width: 100%;
font-size: var(--font-up-1); font-size: var(--font-up-1);
line-height: $line-height-large; line-height: var(--line-height-large);
color: #ccc; color: #ccc;
text-decoration: none; text-decoration: none;
} }

View File

@ -2,5 +2,5 @@
margin: 0 auto; margin: 0 auto;
text-align: center; text-align: center;
font-size: var(--font-up-4); font-size: var(--font-up-4);
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }

View File

@ -309,7 +309,7 @@
} }
.badge-notification { .badge-notification {
line-height: $line-height-medium; line-height: var(--line-height-medium);
vertical-align: text-top; vertical-align: text-top;
} }

View File

@ -1,7 +1,7 @@
@mixin user-item-flex { @mixin user-item-flex {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
line-height: $line-height-medium; line-height: var(--line-height-medium);
color: var(--primary-high-or-secondary-low); color: var(--primary-high-or-secondary-low);
} }
@ -82,7 +82,7 @@ $search-pad-horizontal: 0.5em;
.search-result-topic { .search-result-topic {
.first-line { .first-line {
display: block; display: block;
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
.second-line { .second-line {

View File

@ -315,7 +315,7 @@
.blurb { .blurb {
font-size: var(--font-0); font-size: var(--font-0);
line-height: $line-height-large; line-height: var(--line-height-large);
color: var(--primary-medium); color: var(--primary-medium);
.date { .date {
color: var(--primary-high); color: var(--primary-high);
@ -342,14 +342,14 @@
.search-link { .search-link {
.topic-title { .topic-title {
font-size: var(--font-up-1); font-size: var(--font-up-1);
line-height: $line-height-medium; line-height: var(--line-height-medium);
color: var(--primary); color: var(--primary);
} }
.topic-statuses { .topic-statuses {
display: inline-block; display: inline-block;
flex-shrink: 0; flex-shrink: 0;
font-size: 1.3em; font-size: 1.3em;
line-height: $line-height-medium; line-height: var(--line-height-medium);
color: var(--primary-medium); color: var(--primary-medium);
span { span {
line-height: 1; line-height: 1;

View File

@ -27,7 +27,7 @@
.tag-count { .tag-count {
font-size: var(--font-down-1); font-size: var(--font-down-1);
vertical-align: middle; vertical-align: middle;
line-height: $line-height-small; line-height: var(--line-height-small);
} }
} }

View File

@ -84,7 +84,7 @@ $quote-share-maxwidth: 150px;
.cooked, .cooked,
.d-editor-preview { .d-editor-preview {
word-wrap: break-word; word-wrap: break-word;
line-height: $line-height-large; line-height: var(--line-height-large);
> *:first-child { > *:first-child {
margin-top: 0; margin-top: 0;
@ -97,7 +97,7 @@ $quote-share-maxwidth: 150px;
h5, h5,
h6 { h6 {
margin: 30px 0 10px; margin: 30px 0 10px;
line-height: $line-height-medium; line-height: var(--line-height-medium);
a.anchor { a.anchor {
opacity: 0; opacity: 0;
transition: opacity 0.25s; transition: opacity 0.25s;
@ -677,7 +677,7 @@ aside.quote {
text-align: center; text-align: center;
font-weight: normal; font-weight: normal;
font-size: var(--font-down-2); font-size: var(--font-down-2);
line-height: $line-height-small; line-height: var(--line-height-small);
} }
} }
@ -698,7 +698,7 @@ aside.quote {
h3 { h3 {
margin-bottom: 4px; margin-bottom: 4px;
color: var(--primary); color: var(--primary);
line-height: $line-height-large; line-height: var(--line-height-large);
font-weight: normal; font-weight: normal;
font-size: var(--font-0); font-size: var(--font-0);
} }
@ -708,7 +708,7 @@ aside.quote {
color: var(--primary-med-or-secondary-med); color: var(--primary-med-or-secondary-med);
font-weight: normal; font-weight: normal;
font-size: var(--font-down-1); font-size: var(--font-down-1);
line-height: $line-height-small; line-height: var(--line-height-small);
} }
span.domain { span.domain {
@ -1057,7 +1057,7 @@ kbd {
display: inline-flex; display: inline-flex;
font-size: var(--font-down-1); font-size: var(--font-down-1);
justify-content: center; justify-content: center;
line-height: $line-height-large; line-height: var(--line-height-large);
margin: 0 0.15em; margin: 0 0.15em;
min-width: 24px; min-width: 24px;
padding: 0.15em 0.6em; padding: 0.15em 0.6em;
@ -1184,7 +1184,7 @@ blockquote > *:last-child {
> p { > p {
margin: 0; margin: 0;
padding-right: 0.5em; padding-right: 0.5em;
line-height: $line-height-medium; line-height: var(--line-height-medium);
flex: 1 1; flex: 1 1;
} }
} }
@ -1292,7 +1292,7 @@ a.mention-group {
color: var(--primary-med-or-secondary-med); color: var(--primary-med-or-secondary-med);
margin-right: 6px; margin-right: 6px;
font-size: var(--font-0); font-size: var(--font-0);
line-height: $line-height-large; line-height: var(--line-height-large);
} }
> span.url { > span.url {
@ -1308,7 +1308,7 @@ a.mention-group {
color: var(--primary-med-or-secondary-med); color: var(--primary-med-or-secondary-med);
font-size: var(--font-down-1); font-size: var(--font-down-1);
font-style: italic; font-style: italic;
line-height: $line-height-large; line-height: var(--line-height-large);
margin-bottom: 1px; margin-bottom: 1px;
} }
@ -1522,7 +1522,7 @@ a.mention-group {
.text { .text {
margin-left: 0.5em; margin-left: 0.5em;
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
} }
} }

View File

@ -196,7 +196,7 @@ $topic-progress-height: 42px;
h4 { h4 {
display: inline; display: inline;
font-size: var(--font-up-2); font-size: var(--font-up-2);
line-height: $line-height-small; line-height: var(--line-height-small);
} }
.d-icon { .d-icon {
position: absolute; position: absolute;
@ -377,7 +377,7 @@ a.badge-category {
.suggested-topics h3 .badge-wrapper.bullet span.badge-category { .suggested-topics h3 .badge-wrapper.bullet span.badge-category {
// Override vertical-align: text-top from `badges.css.scss` // Override vertical-align: text-top from `badges.css.scss`
vertical-align: baseline; vertical-align: baseline;
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
.suggested-topics h3 .badge-wrapper.bullet, .suggested-topics h3 .badge-wrapper.bullet,

View File

@ -3,7 +3,7 @@
padding: 3px 8px; padding: 3px 8px;
color: var(--primary); color: var(--primary);
border: 1px solid var(--primary-low); border: 1px solid var(--primary-low);
line-height: $line-height-large; line-height: var(--line-height-large);
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
background-color: var(--secondary); background-color: var(--secondary);

View File

@ -572,7 +572,7 @@
color: var(--primary-medium); color: var(--primary-medium);
margin-bottom: 10px; margin-bottom: 10px;
font-size: var(--font-down-1); font-size: var(--font-down-1);
line-height: $line-height-large; line-height: var(--line-height-large);
a[href] { a[href] {
color: var(--tertiary); color: var(--tertiary);

View File

@ -153,7 +153,7 @@
a.badge-category { a.badge-category {
display: inline-block; display: inline-block;
padding: 6px 8px; padding: 6px 8px;
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
} }
} }
@ -167,7 +167,7 @@
min-width: 0.5em; min-width: 0.5em;
color: var(--secondary); color: var(--secondary);
font-size: var(--font-down-2); font-size: var(--font-down-2);
line-height: $line-height-small; line-height: var(--line-height-small);
text-align: center; text-align: center;
background-color: var(--primary-low-mid-or-secondary-low); background-color: var(--primary-low-mid-or-secondary-low);
&[href] { &[href] {
@ -217,7 +217,7 @@
.badge-posts { .badge-posts {
font-weight: normal; font-weight: normal;
font-size: var(--font-0); font-size: var(--font-0);
line-height: $line-height-small; line-height: var(--line-height-small);
&[href] { &[href] {
color: var(--primary-med-or-secondary-med); color: var(--primary-med-or-secondary-med);
} }

View File

@ -34,7 +34,7 @@ $mobile-breakpoint: 700px;
display: inline-block; display: inline-block;
margin-right: 1em; margin-right: 1em;
margin-bottom: 0.25em; margin-bottom: 0.25em;
line-height: $line-height-medium; line-height: var(--line-height-medium);
span { span {
word-break: break-word; word-break: break-word;
} }

View File

@ -260,7 +260,7 @@
.btn-flat { .btn-flat {
background: transparent; background: transparent;
border: 0; border: 0;
line-height: $line-height-small; line-height: var(--line-height-small);
transition: color 0.25s, background 0.25s; transition: color 0.25s, background 0.25s;
.d-icon { .d-icon {
color: var(--primary-low-mid); color: var(--primary-low-mid);

View File

@ -74,7 +74,7 @@
} }
kbd { kbd {
font-family: $base-font-family; font-family: var(--font-family);
font-weight: bold; font-weight: bold;
} }
} }

View File

@ -34,7 +34,7 @@
padding: 6px 12px; padding: 6px 12px;
color: var(--primary); color: var(--primary);
font-size: var(--font-up-1); font-size: var(--font-up-1);
line-height: $line-height-small; line-height: var(--line-height-small);
box-sizing: border-box; box-sizing: border-box;
min-height: 30px; min-height: 30px;
display: flex; display: flex;
@ -88,7 +88,7 @@
margin: 0; margin: 0;
padding: 0.75em; padding: 0.75em;
font-size: var(--font-up-1); font-size: var(--font-up-1);
line-height: $line-height-small; line-height: var(--line-height-small);
cursor: pointer; cursor: pointer;
color: var(--primary); color: var(--primary);
@include ellipsis; @include ellipsis;
@ -120,6 +120,6 @@
width: 1.25em; width: 1.25em;
text-align: center; text-align: center;
margin-right: 0.25em; margin-right: 0.25em;
line-height: $line-height-large; line-height: var(--line-height-large);
} }
} }

View File

@ -101,7 +101,7 @@ $avatar_margin: -50px; // negative margin makes avatars extend above cards
margin-bottom: 5px; margin-bottom: 5px;
} }
h1 { h1 {
line-height: $line-height-medium; line-height: var(--line-height-medium);
.d-icon { .d-icon {
color: var(--primary); color: var(--primary);
} }

View File

@ -4,27 +4,27 @@
html { html {
color: var(--primary); color: var(--primary);
font-family: $base-font-family; font-family: var(--font-family);
font-size: $base-font-size; font-size: var(--base-font-size);
line-height: $line-height-large; line-height: var(--line-height-large);
background-color: var(--secondary); background-color: var(--secondary);
overflow-y: scroll; overflow-y: scroll;
direction: ltr; direction: ltr;
&.text-size-smallest { &.text-size-smallest {
font-size: $base-font-size-smallest; font-size: var(--base-font-size-smallest);
} }
&.text-size-smaller { &.text-size-smaller {
font-size: $base-font-size-smaller; font-size: var(--base-font-size-smaller);
} }
&.text-size-larger { &.text-size-larger {
font-size: $base-font-size-larger; font-size: var(--base-font-size-larger);
} }
&.text-size-largest { &.text-size-largest {
font-size: $base-font-size-largest; font-size: var(--base-font-size-largest);
} }
} }

View File

@ -24,14 +24,14 @@
.category-status { .category-status {
color: var(--primary); color: var(--primary);
line-height: $line-height-large; line-height: var(--line-height-large);
flex: 1 1 auto; flex: 1 1 auto;
} }
.category-desc { .category-desc {
flex: 1 1 auto; flex: 1 1 auto;
font-size: var(--font-down-1); font-size: var(--font-down-1);
line-height: $line-height-large; line-height: var(--line-height-large);
} }
} }
} }

View File

@ -44,7 +44,7 @@
a { a {
white-space: nowrap; white-space: nowrap;
color: var(--primary); color: var(--primary);
line-height: $line-height-medium; line-height: var(--line-height-medium);
font-weight: bold; font-weight: bold;
display: block; display: block;
padding: 0.75em; padding: 0.75em;

View File

@ -35,7 +35,7 @@
} }
.texts { .texts {
line-height: $line-height-medium; line-height: var(--line-height-medium);
flex: 1 1 0%; flex: 1 1 0%;
align-items: flex-start; align-items: flex-start;
display: flex; display: flex;

View File

@ -5,7 +5,7 @@
.future-date-input-selector-header { .future-date-input-selector-header {
.btn-clear { .btn-clear {
line-height: $line-height-large; line-height: var(--line-height-large);
} }
} }

View File

@ -158,7 +158,7 @@
align-items: center; align-items: center;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
line-height: $line-height-medium; line-height: var(--line-height-medium);
.d-icon { .d-icon {
margin-left: 5px; margin-left: 5px;

View File

@ -77,7 +77,7 @@
} }
.post-excerpt { .post-excerpt {
max-width: 650px; max-width: 650px;
line-height: $line-height-large; line-height: var(--line-height-large);
display: block; display: block;
@include line-clamp(8); @include line-clamp(8);
@media screen and (max-height: 425px) { @media screen and (max-height: 425px) {
@ -98,7 +98,7 @@
h2 { h2 {
margin-top: 0; margin-top: 0;
display: block; display: block;
line-height: $line-height-medium; line-height: var(--line-height-medium);
font-size: var(--font-up-2); font-size: var(--font-up-2);
@include line-clamp(4); @include line-clamp(4);
} }

View File

@ -95,7 +95,7 @@
border-left: 6px solid; border-left: 6px solid;
h3, h3,
h4 { h4 {
line-height: $line-height-medium; line-height: var(--line-height-medium);
a[href] { a[href] {
color: var(--primary); color: var(--primary);
} }

View File

@ -58,7 +58,7 @@ select,
textarea { textarea {
font-size: var(--font-0); font-size: var(--font-0);
font-weight: normal; font-weight: normal;
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
select, select,
@ -66,7 +66,7 @@ textarea {
display: inline-block; display: inline-block;
margin-bottom: 9px; margin-bottom: 9px;
font-size: var(--font-0); font-size: var(--font-0);
line-height: $line-height-large; line-height: var(--line-height-large);
color: var(--primary); color: var(--primary);
} }
@ -77,7 +77,7 @@ textarea {
select, select,
input[type="file"] { input[type="file"] {
line-height: $line-height-large; line-height: var(--line-height-large);
} }
select { select {

View File

@ -35,7 +35,7 @@
display: block; display: block;
word-wrap: break-word; word-wrap: break-word;
font-size: var(--font-down-2); font-size: var(--font-down-2);
line-height: $line-height-large; line-height: var(--line-height-large);
.search-highlight { .search-highlight {
color: var(--primary-high-or-secondary-low); color: var(--primary-high-or-secondary-low);
} }

View File

@ -140,7 +140,7 @@
padding: 3em 3em 2.5em; padding: 3em 3em 2.5em;
.login-welcome-header { .login-welcome-header {
.login-title { .login-title {
line-height: $line-height-small; line-height: var(--line-height-small);
font-size: var(--font-up-6); font-size: var(--font-up-6);
} }
p.login-subheader { p.login-subheader {
@ -277,7 +277,7 @@
.login-title { .login-title {
font-size: var(--font-up-6); font-size: var(--font-up-6);
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
p.login-subheader { p.login-subheader {
font-size: var(--font-up-1); font-size: var(--font-up-1);

View File

@ -36,7 +36,7 @@
button.bulk-select { button.bulk-select {
padding: 0; padding: 0;
line-height: $line-height-large; line-height: var(--line-height-large);
} }
.topic-list-data.bulk-select { .topic-list-data.bulk-select {
@ -118,7 +118,7 @@
a { a {
color: var(--primary-med-or-secondary-med); color: var(--primary-med-or-secondary-med);
margin-right: 3px; margin-right: 3px;
line-height: $line-height-large; line-height: var(--line-height-large);
} }
} }
.activity { .activity {

View File

@ -270,7 +270,7 @@ pre.codeblock-buttons:hover {
.number, .number,
.d-icon { .d-icon {
font-size: var(--font-up-2); font-size: var(--font-up-2);
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
button .d-icon, button .d-icon,
button:hover .d-icon { button:hover .d-icon {

View File

@ -25,7 +25,7 @@
} }
h1 { h1 {
font-size: var(--font-up-4); font-size: var(--font-up-4);
line-height: $line-height-medium; line-height: var(--line-height-medium);
overflow-wrap: break-word; overflow-wrap: break-word;
width: 100%; width: 100%;
a { a {
@ -48,7 +48,7 @@
margin-right: auto; margin-right: auto;
font-size: var(--font-up-4); font-size: var(--font-up-4);
text-align: center; text-align: center;
line-height: $line-height-medium; line-height: var(--line-height-medium);
.topic-retry { .topic-retry {
display: block; display: block;

View File

@ -6,7 +6,7 @@
border-bottom: 1px solid rgba(var(--primary-low-rgb), 0.5); border-bottom: 1px solid rgba(var(--primary-low-rgb), 0.5);
.name { .name {
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
&:last-child { &:last-child {

View File

@ -72,7 +72,7 @@
.d-header-icons { .d-header-icons {
.d-icon { .d-icon {
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
.active .icon { .active .icon {
&:after { &:after {

View File

@ -12,7 +12,7 @@
max-width: 90vw; max-width: 90vw;
} }
#revision-numbers { #revision-numbers {
line-height: $line-height-large; line-height: var(--line-height-large);
} }
img { img {
max-width: 95%; max-width: 95%;

View File

@ -52,7 +52,7 @@
border: 1px solid var(--primary-medium); border: 1px solid var(--primary-medium);
} }
> li > a { > li > a {
line-height: $line-height-large; line-height: var(--line-height-large);
display: flex; display: flex;
align-items: center; align-items: center;
.d-icon { .d-icon {
@ -118,7 +118,7 @@
} }
.main-link { .main-link {
line-height: $line-height-medium; line-height: var(--line-height-medium);
position: relative; position: relative;
z-index: z("base") + 1; // Intentionally overlapping category to create bigger tap target z-index: z("base") + 1; // Intentionally overlapping category to create bigger tap target
font-size: var(--font-up-1); font-size: var(--font-up-1);
@ -140,7 +140,7 @@
display: inline-block; display: inline-block;
top: -1px; top: -1px;
font-size: var(--font-0); font-size: var(--font-0);
line-height: $line-height-small; line-height: var(--line-height-small);
padding: 0.15em 0.4em 0.2em 0.4em; padding: 0.15em 0.4em 0.2em 0.4em;
.d-icon { .d-icon {
color: var(--secondary); color: var(--secondary);

View File

@ -134,7 +134,7 @@ a.reply-to-tab {
.topic-map { .topic-map {
margin: 10px 0; margin: 10px 0;
h4 { h4 {
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
.user { .user {
float: left; float: left;
@ -154,7 +154,7 @@ a.reply-to-tab {
} }
} }
.number { .number {
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
.number, .number,
.d-icon { .d-icon {
@ -346,7 +346,7 @@ span.highlighted {
margin-left: 50px; margin-left: 50px;
font-size: var(--font-down-1); font-size: var(--font-down-1);
.names { .names {
line-height: $line-height-medium; line-height: var(--line-height-medium);
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;

View File

@ -15,7 +15,7 @@
#topic-title { #topic-title {
h1 { h1 {
font-size: var(--font-up-3); font-size: var(--font-up-3);
line-height: $line-height-medium; line-height: var(--line-height-medium);
a { a {
color: var(--primary); color: var(--primary);
vertical-align: middle; vertical-align: middle;
@ -78,7 +78,7 @@
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
font-size: var(--font-up-4); font-size: var(--font-up-4);
line-height: $line-height-medium; line-height: var(--line-height-medium);
.topic-retry { .topic-retry {
display: block; display: block;

View File

@ -103,11 +103,11 @@
margin-bottom: 12px; margin-bottom: 12px;
h1 { h1 {
line-height: $line-height-small; line-height: var(--line-height-small);
} }
h2 { h2 {
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
.user-profile-avatar { .user-profile-avatar {

View File

@ -253,7 +253,7 @@ body.wizard {
&__step-title { &__step-title {
font-size: 2.75em; font-size: 2.75em;
color: var(--primary); color: var(--primary);
line-height: $line-height-medium; line-height: var(--line-height-medium);
margin: 0 0 1.5em 0; margin: 0 0 1.5em 0;
@include breakpoint("medium") { @include breakpoint("medium") {
font-size: var(--font-up-5); font-size: var(--font-up-5);

View File

@ -40,7 +40,7 @@ div.poll {
.info-label { .info-label {
font-size: var(--font-up-4); font-size: var(--font-up-4);
line-height: $line-height-medium; line-height: var(--line-height-medium);
} }
.info-text { .info-text {