moon
/
soapbox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Replace $primary-text-color

This commit is contained in:
Alex Gleason 2020-05-31 18:44:20 -05:00
parent 36f888c027
commit 4a2493a7e2
No known key found for this signature in database
GPG Key ID: 7211D1F99744FBB7
24 changed files with 116 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
app/soapbox/reducers/theme.js
View File

@ -7,6 +7,17 @@ import { brightness, hue, convert } from 'chromatism';
const initialState = ImmutableMap();
const modes = ImmutableMap({
light: ImmutableMap({
'primary-text-color': '#000000',
'primary-text-color-faint': 'rgba(0, 0, 0, 0.7)',
}),
dark: ImmutableMap({
'primary-text-color': '#ffffff',
'primary-text-color-faint': 'rgba(255, 255, 255, 0.7)',
}),
});
const cssrgba = (color, a) => {
const { r, g, b } = convert(color).rgb;
return `rgba(${[r, g, b, a].join(',')})`;
@ -18,14 +29,14 @@ const makeContrast = (percent, color, mode) => {
};
export const generateTheme = (brandColor, mode) => {
return ImmutableMap({
return modes.get(mode).merge(ImmutableMap({
'brand-color': brandColor,
'accent-color': brightness(10, hue(-3, brandColor).hex).hex,
'brand-color-faint': cssrgba(brandColor, 0.1),
'brand-color-med': cssrgba(brandColor, 0.2),
'highlight-text-color': makeContrast(5, brandColor, mode).hex,
'brand-color-hicontrast': makeContrast(15, brandColor, mode).hex,
});
}));
};
export const setTheme = themeData => {

10
app/styles/soapbox-light/diff.scss
View File

@ -187,7 +187,7 @@ body {
// Change the default color used for the text in an empty column or on the error column
.empty-column-indicator,
.error-column {
color: $primary-text-color;
color: var(--primary-text-color);
background: $white;
}
@ -210,12 +210,12 @@ body {
.status.light {
.status__content {
color: $primary-text-color;
color: var(--primary-text-color);
}
.display-name {
strong {
color: $primary-text-color;
color: var(--primary-text-color);
}
}
}
@ -226,7 +226,7 @@ body {
.name {
a {
color: $primary-text-color;
color: var(--primary-text-color);
}
}
@ -235,7 +235,7 @@ body {
}
.account__header__content {
color: $primary-text-color;
color: var(--primary-text-color);
}
}
}

1
app/styles/soapbox-light/variables.scss
View File

@ -22,7 +22,6 @@ $ui-primary-color: #9bcbed;
$ui-secondary-color: $classic-base-color !default;
$ui-highlight-color: #990099;
$primary-text-color: $black !default;
$darker-text-color: $classic-base-color !default;
$dark-text-color: #444b5d;
$action-button-color: #606984;

10
app/styles/soapbox/about.scss
View File

@ -189,7 +189,7 @@ $small-breakpoint: 960px;
font-family: $font-sans-serif, sans-serif;
font-size: 16px;
line-height: 28px;
color: $primary-text-color;
color: var(--primary-text-color);
text-align: right;
padding: 10px 15px;
@ -274,7 +274,7 @@ $small-breakpoint: 960px;
a {
display: block;
color: $primary-text-color;
color: var(--primary-text-color);
text-decoration: none;
&:hover {
@ -586,7 +586,7 @@ $small-breakpoint: 960px;
h1 {
font-weight: 500;
color: $primary-text-color;
color: var(--primary-text-color);
margin-bottom: 0;
small {
@ -659,8 +659,6 @@ $small-breakpoint: 960px;
}
.public-layout {
$gab-background: $gab-background-base-dark !default;
position: relative;
background-color: var(--brand-color);
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 889" width="1440px" height="889px"><path d="M 0 0 L 0 851.82031 C 115.03104 776.54213 236.097 723.10606 363.20703 691.54492 C 640.06491 622.80164 852.93698 468.14039 954.31055 358.01367 C 1092.1151 208.31032 1206.0509 47.69868 1365.3828 13.457031 C 1391.8162 7.7762737 1416.6827 3.2957237 1440 0.001953125 L 1440 0 L 0 0 z" fill="#{hex-color($gab-background)}"/></svg>');
@ -966,7 +964,7 @@ $small-breakpoint: 960px;
.brand__tagline {
display: block;
width: 470px;
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 30px;
line-height: 1.4;
margin-top: 25px;

6
app/styles/soapbox/accounts.scss
View File

@ -78,7 +78,7 @@
strong {
font-size: 15px;
color: $primary-text-color;
color: var(--primary-text-color);
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
@ -108,7 +108,7 @@
.page,
.gap {
font-size: 14px;
color: $primary-text-color;
color: var(--primary-text-color);
font-weight: 500;
display: inline-block;
padding: 6px 10px;
@ -310,7 +310,7 @@
}
strong {
color: $primary-text-color;
color: var(--primary-text-color);
font-weight: 700;
}
}

2
app/styles/soapbox/basics.scss
View File

@ -165,7 +165,7 @@ button {
}
.explanation-box {
color: $primary-text-color;
color: var(--primary-text-color);
padding: 15px 20px;
font-size: 14px;
background-color: var(--brand-color-faint);

76
app/styles/soapbox/components.scss
View File

@ -8,7 +8,7 @@
border: 10px none;
border-radius: 4px;
box-sizing: border-box;
color: $primary-text-color;
color: var(--primary-text-color);
cursor: pointer;
display: inline-block;
font-family: inherit;
@ -188,7 +188,7 @@
&.overlayed {
box-sizing: content-box;
background: rgba($base-overlay-background, 0.6);
color: rgba($primary-text-color, 0.7);
color: var(--primary-text-color-faint);
border-radius: 4px;
padding: 2px;
@ -372,7 +372,7 @@
overflow: hidden;
text-overflow: ellipsis;
padding-top: 2px;
color: $primary-text-color;
color: var(--primary-text-color);
&:focus {
outline: 0;
@ -592,7 +592,7 @@
}
a.status__content__spoiler-link {
color: $primary-text-color;
color: var(--primary-text-color);
background: $ui-primary-color;
&:hover {
@ -756,7 +756,7 @@
.domain__domain-name {
flex: 1 1 auto;
display: block;
color: $primary-text-color;
color: var(--primary-text-color);
text-decoration: none;
font-size: 14px;
font-weight: 500;
@ -961,7 +961,7 @@ a .account__avatar {
display: block;
font-size: 15px;
font-weight: 500;
color: $primary-text-color;
color: var(--primary-text-color);
@each $lang in $cjk-langs {
&:lang(#{$lang}) {
@ -998,7 +998,7 @@ a .account__avatar {
.status__display-name,
.account__display-name {
strong {
color: $primary-text-color;
color: var(--primary-text-color);
}
}
@ -1044,7 +1044,7 @@ a.account__display-name {
strong {
font-size: 16px;
color: $primary-text-color;
color: var(--primary-text-color);
}
.display-name__account {
@ -1139,7 +1139,7 @@ a.account__display-name {
text-decoration: none;
&:hover {
color: $primary-text-color;
color: var(--primary-text-color);
text-decoration: underline;
}
}
@ -1678,13 +1678,13 @@ a.account__display-name {
&__btn {
display: block;
text-align: left;
color: $primary-text-color;
color: var(--primary-text-color);
text-decoration: none;
font-size: 15px;
padding: 0 20px;
&:hover {
color: darken($primary-text-color, 14%);
color: var(--primary-text-color-faint);
span {
text-decoration: underline;
@ -1949,7 +1949,7 @@ a.account__display-name {
.column-link {
background: var(--brand-color-med);
color: $primary-text-color;
color: var(--primary-text-color);
display: block;
font-size: 16px;
padding: 15px;
@ -1973,7 +1973,7 @@ a.account__display-name {
&:focus,
&:active {
background: transparent;
color: $primary-text-color;
color: var(--primary-text-color);
}
&.active {
@ -2098,7 +2098,7 @@ a.account__display-name {
&:focus,
&:active {
color: $primary-text-color;
color: var(--primary-text-color);
border-bottom-color: var(--highlight-text-color);
}
@ -2179,7 +2179,7 @@ a.account__display-name {
&:hover,
&:active,
&:focus {
color: $primary-text-color;
color: var(--primary-text-color);
}
}
@ -2455,7 +2455,7 @@ a.status-card.compact:hover {
}
&.active {
color: $primary-text-color;
color: var(--primary-text-color);
border-radius: 10px;
background-color: var(--brand-color-faint);
}
@ -2513,11 +2513,11 @@ a.status-card.compact:hover {
&:hover {color: lighten($darker-text-color, 7%);}
&.active {
color: $primary-text-color;
color: var(--primary-text-color);
background: var(--brand-color-med);
&:hover {
color: $primary-text-color;
color: var(--primary-text-color);
background: var(--brand-color-med);
}
}
@ -2683,7 +2683,7 @@ a.status-card.compact:hover {
.video-error-cover {
align-items: center;
background: $base-overlay-background;
color: $primary-text-color;
color: var(--primary-text-color);
cursor: pointer;
display: flex;
flex-direction: column;
@ -2756,7 +2756,7 @@ a.status-card.compact:hover {
background: rgba($base-overlay-background, 0.5);
border-radius: 8px;
padding: 8px 12px;
color: $primary-text-color;
color: var(--primary-text-color);
font-weight: 500;
font-size: 14px;
}
@ -2890,7 +2890,7 @@ a.status-card.compact:hover {
}
.relationship-tag {
color: $primary-text-color;
color: var(--primary-text-color);
margin-bottom: 4px;
display: block;
vertical-align: top;
@ -3244,14 +3244,14 @@ a.status-card.compact:hover {
&:hover,
&.active {
background: var(--brand-color);
color: $primary-text-color;
color: var(--primary-text-color);
outline: 0;
.privacy-dropdown__option__content {
color: $primary-text-color;
color: var(--primary-text-color);
strong {
color: $primary-text-color;
color: var(--primary-text-color);
}
}
}
@ -3299,7 +3299,7 @@ a.status-card.compact:hover {
background: var(--brand-color);
.icon-button {
color: $primary-text-color;
color: var(--primary-text-color);
}
}
}
@ -3433,7 +3433,7 @@ a.status-card.compact:hover {
.media-gallery__gifv__label {
display: block;
position: absolute;
color: $primary-text-color;
color: var(--primary-text-color);
background: rgba($base-overlay-background, 0.5);
bottom: 6px;
left: 6px;
@ -3572,7 +3572,7 @@ a.status-card.compact:hover {
&::before {
content: 'GIF';
position: absolute;
color: $primary-text-color;
color: var(--primary-text-color);
background: rgba($base-overlay-background, 0.5);
bottom: 6px;
left: 6px;
@ -3664,7 +3664,7 @@ a.status-card.compact:hover {
.status__video-player-expand,
.status__video-player-mute {
color: $primary-text-color;
color: var(--primary-text-color);
opacity: 0.8;
position: absolute;
right: 4px;
@ -3673,7 +3673,7 @@ a.status-card.compact:hover {
.status__video-player-spoiler {
display: none;
color: $primary-text-color;
color: var(--primary-text-color);
left: 4px;
position: absolute;
text-shadow: 0 1px 1px $base-shadow-color, 1px 0 1px $base-shadow-color;
@ -4008,7 +4008,7 @@ a.status-card.compact:hover {
.media-spoiler-video-play-icon {
border-radius: 100px;
color: rgba($primary-text-color, 0.8);
color: var(--primary-text-color-faint);
font-size: 36px;
left: 50%;
padding: 5px;
@ -4073,7 +4073,7 @@ a.status-card.compact:hover {
position: relative;
&.active {
color: $primary-text-color;
color: var(--primary-text-color);
&::before,
&::after {
@ -4262,7 +4262,7 @@ noscript {
padding: 10px;
font-family: $font-monospace, monospace;
background: var(--brand-color-med);
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 14px;
margin: 0;
margin-bottom: 15px;
@ -4711,7 +4711,7 @@ noscript {
&__label {
flex: 1 1;
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 16px;
font-weight: bold;
line-height: 19px;
@ -4782,7 +4782,7 @@ noscript {
margin-top: 6px;
&__name {
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 14px;
font-weight: bold;
line-height: 16px;
@ -4808,7 +4808,7 @@ noscript {
}
&__icon {
color: $primary-text-color;
color: var(--primary-text-color);
}
}
}
@ -4969,7 +4969,7 @@ noscript {
}
span {
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 15px;
line-height: 1.25;
}
@ -5017,7 +5017,7 @@ noscript {
&__bio {
display: block;
flex: 1 1;
color: $primary-text-color;
color: var(--primary-text-color);
margin: 15px 0;
font-size: 15px;
line-height: 1.25;
@ -5155,7 +5155,7 @@ noscript {
}
&__title-text {
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 27px;
font-weight: bold;
line-height: 32px;

4
app/styles/soapbox/components/account-header.scss
View File

@ -128,7 +128,7 @@
display: block;
&:first-of-type {
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 20px;
font-weight: 800;
line-height: 24px;
@ -148,7 +148,7 @@
&:hover,
&.active {
border-bottom: 2px solid $primary-text-color;
border-bottom: 2px solid var(--primary-text-color);
}
&.score {border-bottom: 0 !important;}
}

2
app/styles/soapbox/components/compose-form.scss
View File

@ -30,7 +30,7 @@
}
.compose-form__warning {
color: $primary-text-color;
color: var(--primary-text-color);
margin-bottom: 10px;
background: $ui-primary-color;
box-shadow: 0 2px 6px rgba($base-shadow-color, 0.3);

4
app/styles/soapbox/components/group-card.scss
View File

@ -47,7 +47,7 @@
padding: 15px;
.group-card__title {
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 16px;
font-weight: bold;
}
@ -60,7 +60,7 @@
}
.group-card__description {
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 14px;
}
}

4
app/styles/soapbox/components/group-detail.scss
View File

@ -26,11 +26,11 @@
text-decoration: none;
padding: 16px 22px;
text-align: center;
color: $primary-text-color;
color: var(--primary-text-color);
&:hover,
&--active {
border-bottom: 2px solid $primary-text-color;
border-bottom: 2px solid var(--primary-text-color);
}
}

4
app/styles/soapbox/components/group-sidebar-panel.scss
View File

@ -3,13 +3,13 @@
padding: 0 15px 15px;
&__show-all {
color: $primary-text-color;
color: var(--primary-text-color);
}
}
&__item {
display: block;
color: $primary-text-color;
color: var(--primary-text-color);
text-decoration: none;
margin-bottom: 15px;

2
app/styles/soapbox/components/hotkeys-modal.scss
View File

@ -27,7 +27,7 @@
display: block;
padding-left: 10px;
margin-bottom: 10px;
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 16px;
font-weight: 600;
}

4
app/styles/soapbox/components/modal.scss
View File

@ -98,7 +98,7 @@
background: rgba($base-overlay-background, 0.5);
box-sizing: border-box;
border: 0;
color: $primary-text-color;
color: var(--primary-text-color);
cursor: pointer;
display: flex;
align-items: center;
@ -158,7 +158,7 @@
}
.media-modal__button {
background-color: $primary-text-color;
background-color: var(--primary-text-color);
height: 12px;
width: 12px;
border-radius: 6px;

4
app/styles/soapbox/components/user-panel.scss
View File

@ -43,7 +43,7 @@
&__account {
a {
text-decoration: none;
color: $primary-text-color;
color: var(--primary-text-color);
}
&__name {
@ -85,7 +85,7 @@
a {
text-decoration: none;
color: $primary-text-color;
color: var(--primary-text-color);
&:hover {
opacity: 0.8;

16
app/styles/soapbox/containers.scss
View File

@ -30,7 +30,7 @@
display: flex;
justify-content: center;
align-items: center;
color: $primary-text-color;
color: var(--primary-text-color);
text-decoration: none;
outline: 0;
padding: 12px 16px;
@ -329,7 +329,7 @@
font-size: 14px;
font-weight: 600;
text-decoration: none;
color: $primary-text-color;
color: var(--primary-text-color);
white-space: nowrap;
text-align: center;
@ -337,7 +337,7 @@
&:focus,
&:active {
text-decoration: underline;
color: $primary-text-color;
color: var(--primary-text-color);
}
&--hollow {
@ -574,7 +574,7 @@
h1 {
font-size: 20px;
line-height: 18px * 1.5;
color: $primary-text-color;
color: var(--primary-text-color);
font-weight: 500;
overflow: hidden;
white-space: nowrap;
@ -584,7 +584,7 @@
small {
display: block;
font-size: 14px;
color: $primary-text-color;
color: var(--primary-text-color);
font-weight: 400;
overflow: hidden;
text-overflow: ellipsis;
@ -695,7 +695,7 @@
font-weight: 500;
font-size: 18px;
margin-bottom: 5px;
color: $primary-text-color;
color: var(--primary-text-color);
font-family: $font-display, sans-serif;
}
}
@ -744,7 +744,7 @@
strong {
font-weight: 700;
color: $primary-text-color;
color: var(--primary-text-color);
}
}
}
@ -801,7 +801,7 @@
.account__header__content {
padding: 20px;
padding-bottom: 0;
color: $primary-text-color;
color: var(--primary-text-color);
}
&__extra,

2
app/styles/soapbox/dashboard.scss
View File

@ -36,7 +36,7 @@
font-weight: 500;
font-size: 24px;
line-height: 21px;
color: $primary-text-color;
color: var(--primary-text-color);
font-family: $font-display, sans-serif;
margin-bottom: 20px;
line-height: 30px;

4
app/styles/soapbox/donations.scss
View File

@ -20,7 +20,7 @@
&--active {
background-color: var(--brand-color);
color: $primary-text-color;
color: var(--primary-text-color);
}
}
}
@ -126,7 +126,7 @@
background: transparent;
border: 0;
margin: 0;
color: $primary-text-color;
color: var(--primary-text-color);
appearance: textfield;
&::-webkit-inner-spin-button,

4
app/styles/soapbox/footer.scss
View File

@ -48,13 +48,13 @@
margin-right: auto;
span {
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 1.3rem;
font-weight: 500;
line-height: 1.5;
&:last-of-type {
color: darken($primary-text-color, 20%);
color: var(--primary-text-color-faint);
}
}
}

34
app/styles/soapbox/forms.scss
View File

@ -49,7 +49,7 @@ code {
font-family: inherit;
font-size: 14px;
padding-top: 5px;
color: $primary-text-color;
color: var(--primary-text-color);
display: block;
width: auto;
}
@ -148,7 +148,7 @@ code {
& > label {
font-family: inherit;
font-size: 14px;
color: $primary-text-color;
color: var(--primary-text-color);
font-weight: 500;
min-width: 150px;
flex: 0 0 auto;
@ -170,7 +170,7 @@ code {
.label_input > label {
font-family: inherit;
font-size: 14px;
color: $primary-text-color;
color: var(--primary-text-color);
display: block;
margin-bottom: 8px;
word-wrap: break-word;
@ -192,7 +192,7 @@ code {
& > label {
font-family: inherit;
font-size: 16px;
color: $primary-text-color;
color: var(--primary-text-color);
display: block;
font-weight: 500;
padding-top: 5px;
@ -266,7 +266,7 @@ code {
margin-bottom: 5px;
font-family: inherit;
font-size: 14px;
color: $primary-text-color;
color: var(--primary-text-color);
display: block;
width: auto;
}
@ -276,7 +276,7 @@ code {
label {
font-family: inherit;
font-size: 14px;
color: $primary-text-color;
color: var(--primary-text-color);
display: inline-block;
width: auto;
position: relative;
@ -300,8 +300,8 @@ code {
input[type=email],
input[type=password],
textarea {
color: rgba($primary-text-color, 0.5);
border-color: rgba($primary-text-color, 0.5);
color: var(--primary-text-color-faint);
border-color: var(--primary-text-color-faint);
}
}
@ -312,7 +312,7 @@ code {
textarea {
box-sizing: border-box;
font-size: 16px;
color: $primary-text-color;
color: var(--primary-text-color);
display: block;
width: 100%;
outline: 0;
@ -390,7 +390,7 @@ code {
border: 0;
border-radius: 4px;
background: var(--brand-color);
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 18px;
line-height: inherit;
height: auto;
@ -440,7 +440,7 @@ code {
appearance: none;
box-sizing: border-box;
font-size: 16px;
color: $primary-text-color;
color: var(--primary-text-color);
display: block;
width: 100%;
outline: 0;
@ -509,7 +509,7 @@ code {
&.rich-formatting {
&,
p {
color: $primary-text-color;
color: var(--primary-text-color);
}
}
}
@ -550,7 +550,7 @@ code {
text-decoration: none;
&:hover {
color: $primary-text-color;
color: var(--primary-text-color);
text-decoration: underline;
}
}
@ -568,7 +568,7 @@ code {
padding: 10px;
font-family: $font-monospace, monospace;
background: var(--brand-color-med);
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 14px;
margin: 0;
@ -719,7 +719,7 @@ code {
.warning {
box-sizing: border-box;
background: rgba($error-value-color, 0.5);
color: $primary-text-color;
color: var(--primary-text-color);
text-shadow: 1px 1px 0 rgba($base-shadow-color, 0.3);
box-shadow: 0 2px 6px rgba($base-shadow-color, 0.4);
border-radius: 4px;
@ -727,7 +727,7 @@ code {
margin-bottom: 15px;
a {
color: $primary-text-color;
color: var(--primary-text-color);
text-decoration: underline;
&:hover,
@ -787,7 +787,7 @@ code {
h4 {
font-size: 16px;
color: $primary-text-color;
color: var(--primary-text-color);
text-align: center;
margin-bottom: 20px;
border: 0;

4
app/styles/soapbox/stream_entries.scss
View File

@ -77,7 +77,7 @@
flex: 0 auto;
font-size: 14px;
background: var(--brand-color);
color: $primary-text-color;
color: var(--primary-text-color);
text-transform: none;
line-height: 36px;
height: auto;
@ -89,7 +89,7 @@
height: auto;
vertical-align: middle;
margin-right: 5px;
fill: $primary-text-color;
fill: var(--primary-text-color);
}
&:active,

2
app/styles/soapbox/tables.scss
View File

@ -113,7 +113,7 @@ a.table-action-link {
font-weight: 500;
&:hover {
color: $primary-text-color;
color: var(--primary-text-color);
}
i.fa {

3
app/styles/soapbox/variables.scss
View File

@ -9,7 +9,6 @@
// STATIC COLORS
$gab-brand-default: #990099 !default;
$gab-alert-red: #e600e6 !default;
$gab-secondary-text: #999 !default;
$gab-text-highlight: #e600e6 !default;
$gab-small-cta-primary: #607cf5 !default;
@ -72,7 +71,6 @@ $classic-highlight-color: $gab-text-highlight;
// Variables for defaults in UI
$base-shadow-color: $black !default;
$base-overlay-background: $black !default;
$base-border-color: $white !default;
$simple-background-color: $white !default;
$valid-value-color: $success-green !default;
$error-value-color: $error-red !default;
@ -89,7 +87,6 @@ $nav-ui-highlight-color: $gab-text-highlight !default;
$nav-ui-search-bg-color: darken($nav-ui-highlight-color, 52%) !default;
// Variables for texts
$primary-text-color: $white !default;
$darker-text-color: $gab-secondary-text !default;
$dark-text-color: $ui-base-lighter-color !default;
$secondary-text-color: $ui-secondary-color !default;

10
app/styles/soapbox/widgets.scss
View File

@ -142,7 +142,7 @@
margin-top: 10px;
a {
color: $primary-text-color;
color: var(--primary-text-color);
text-decoration: none;
}
}
@ -237,7 +237,7 @@
margin: 10px 0;
h1 {
color: $primary-text-color;
color: var(--primary-text-color);
font-size: 36px;
line-height: 1.1;
font-weight: 700;
@ -303,7 +303,7 @@
flex: 1 1 auto;
font-size: 18px;
font-weight: 700;
color: $primary-text-color;
color: var(--primary-text-color);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
@ -325,7 +325,7 @@
&,
.fa,
small {
color: $primary-text-color;
color: var(--primary-text-color);
}
}
@ -407,7 +407,7 @@
text-align: center;
font-size: 15px;
font-weight: 500;
color: $primary-text-color;
color: var(--primary-text-color);
small {
display: block;