Various color variable replacements

This commit is contained in:
Alex Gleason 2020-06-01 19:53:22 -05:00
parent d4a88c0243
commit be2f26980a
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
4 changed files with 17 additions and 19 deletions

View file

@ -423,10 +423,11 @@
} }
.status__content__spoiler-link { .status__content__spoiler-link {
background: $action-button-color; background: var(--brand-color-med);
transition: 0.2s;
&:hover { &:hover {
background: lighten($action-button-color, 7%); background: var(--brand-color-faint);
text-decoration: none; text-decoration: none;
} }
@ -1565,7 +1566,7 @@ a.account__display-name {
&:hover, &:hover,
&:focus, &:focus,
&:active { &:active {
background-color: darken($nav-ui-highlight-color, 10%) !important; background-color: var(--brand-color-hicontrast);
} }
i.fa { i.fa {
@ -2602,7 +2603,7 @@ a.status-card.compact:hover {
} }
.loading-indicator { .loading-indicator {
color: $dark-text-color; color: var(--primary-text-color-faint);
font-size: 12px; font-size: 12px;
font-weight: 400; font-weight: 400;
text-transform: uppercase; text-transform: uppercase;
@ -4880,9 +4881,10 @@ noscript {
} }
&__close { &__close {
position: absolute; position: absolute;
right: 10px; right: 10px;
top: 10px; top: 10px;
color: #999;
} }
&__content { &__content {
@ -5190,7 +5192,6 @@ noscript {
width: 100%; width: 100%;
max-height: 46px; max-height: 46px;
position: relative; position: relative;
background-color: var(--brand-color-faint);
border-bottom: 1px solid; border-bottom: 1px solid;
border-top: 1px solid; border-top: 1px solid;
border-color: var(--brand-color-faint); border-color: var(--brand-color-faint);

View file

@ -49,7 +49,7 @@
border-radius: 50%; border-radius: 50%;
height: 200px; height: 200px;
width: 200px; width: 200px;
background-color: darken($ui-base-color, 8%); background-color: var(--foreground-color);
// NOTE - patch fix for avatar size. Wrapper may not be needed when I do polish up on the page // NOTE - patch fix for avatar size. Wrapper may not be needed when I do polish up on the page
.account__avatar { .account__avatar {
@ -57,6 +57,7 @@
height: 200px; height: 200px;
background-size: 200px 200px; background-size: 200px 200px;
} }
@media screen and (max-width: 895px) { @media screen and (max-width: 895px) {
top: -45px; top: -45px;
left: 10px; left: 10px;

View file

@ -98,7 +98,7 @@
width: 100%; width: 100%;
margin: 0; margin: 0;
color: $inverted-text-color; color: $inverted-text-color;
background: $gab-background-base-light; background: #f2f2f2;
padding: 10px; padding: 10px;
font-family: inherit; font-family: inherit;
font-size: 14px; font-size: 14px;

View file

@ -318,10 +318,11 @@ code {
outline: 0; outline: 0;
font-family: inherit; font-family: inherit;
resize: vertical; resize: vertical;
background: darken($ui-base-color, 10%); background: var(--foreground-color);
border: 1px solid darken($ui-base-color, 14%); border: 1px solid var(--brand-color-faint);
border-radius: 4px; border-radius: 4px;
padding: 10px; padding: 10px;
transition: 0.2s;
&:invalid { &:invalid {
box-shadow: none; box-shadow: none;
@ -335,14 +336,9 @@ code {
border-color: $valid-value-color; border-color: $valid-value-color;
} }
&:hover {
border-color: darken($ui-base-color, 20%);
}
&:active, &:active,
&:focus { &:focus {
border-color: var(--highlight-text-color); border-color: var(--highlight-text-color);
background: darken($ui-base-color, 8%);
} }
} }
@ -439,8 +435,8 @@ code {
outline: 0; outline: 0;
font-family: inherit; font-family: inherit;
resize: vertical; resize: vertical;
background: darken($ui-base-color, 10%) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(var(--brand-color-med))}'/></svg>") no-repeat right 8px center / auto 16px; background: var(--foreground-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(var(--brand-color-med))}'/></svg>") no-repeat right 8px center / auto 16px;
border: 1px solid darken($ui-base-color, 14%); border: 1px solid var(--brand-color-faint);
border-radius: 4px; border-radius: 4px;
padding-left: 10px; padding-left: 10px;
padding-right: 30px; padding-right: 30px;