Use --brand-color-faint in more spots

This commit is contained in:
Alex Gleason 2020-05-30 21:58:18 -05:00
parent 0491183877
commit be3065405c
No known key found for this signature in database
GPG Key ID: 7211D1F99744FBB7
11 changed files with 30 additions and 30 deletions

View File

@ -52,13 +52,13 @@ body {
&:focus,
&:active,
&.selected {
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
}
}
}
.emoji-mart-bar {
border-color: lighten($ui-base-color, 4%);
border-color: var(--brand-color-faint);
&:first-child {
background: darken($ui-base-color, 6%);
@ -72,11 +72,11 @@ body {
// Change the background colors of statuses
.focusable:focus {
background: $ui-base-color;
background: var(--brand-color-faint);
}
.status.status-direct {
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
}
.focusable:focus .status.status-direct {

View File

@ -235,7 +235,7 @@ $small-breakpoint: 960px;
color: $darker-text-color;
padding-bottom: 5px;
margin-bottom: 15px;
border-bottom: 1px solid lighten($ui-base-color, 4%);
border-bottom: 1px solid var(--brand-color-faint);
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;

View File

@ -48,7 +48,7 @@
display: flex;
justify-content: flex-start;
align-items: center;
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
border-radius: 0 0 4px 4px;
@media screen and (max-width: $no-gap-breakpoint) {

View File

@ -72,7 +72,7 @@ body {
}
&.embed {
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
margin: 0;
padding-bottom: 0;

View File

@ -502,7 +502,7 @@
.focusable {
&:focus {
outline: 0;
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
.status.status-direct {
background: lighten($ui-base-color, 12%);
@ -1768,7 +1768,7 @@ a.account__display-name {
}
.column-back-button {
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
color: var(--highlight-text-color);
cursor: pointer;
flex: 0 0 auto;
@ -1787,7 +1787,7 @@ a.account__display-name {
}
.column-header__back-button {
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
border: 0;
font-family: inherit;
color: var(--highlight-text-color);
@ -2261,7 +2261,7 @@ a.status-card {
}
.status-card.compact {
border-color: lighten($ui-base-color, 4%);
border-color: var(--brand-color-faint);
&.interactive {
border: 0;
@ -2282,7 +2282,7 @@ a.status-card {
}
a.status-card.compact:hover {
background-color: lighten($ui-base-color, 4%);
background-color: var(--brand-color-faint);
}
.status-card__image-image {
@ -2760,7 +2760,7 @@ a.status-card.compact:hover {
}
.account--panel {
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
border-top: 1px solid lighten($ui-base-color, 8%);
border-bottom: 1px solid lighten($ui-base-color, 8%);
display: flex;
@ -3518,7 +3518,7 @@ a.status-card.compact:hover {
border-radius: 4px;
position: relative;
width: 100%;
background-color: lighten($ui-base-color, 8%);
background-color: var(--brand-color-faint);
}
.media-gallery__item {
@ -4258,7 +4258,7 @@ noscript {
}
&:focus {
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
}
@media screen and (max-width: 600px) {
@ -4282,7 +4282,7 @@ noscript {
.account__moved-note {
padding: 14px 10px;
padding-bottom: 16px;
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
border-top: 1px solid lighten($ui-base-color, 8%);
border-bottom: 1px solid lighten($ui-base-color, 8%);
@ -4322,7 +4322,7 @@ noscript {
display: flex;
justify-content: flex-start;
align-items: center;
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
label {
flex: 1 1 auto;

View File

@ -36,14 +36,14 @@
min-height: 74px;
width: 100%;
position: relative;
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
@media (min-width: 895px) {height: 74px;}
}
&__avatar {
display: block;
position: absolute;
border: 5px solid lighten($ui-base-color, 4%);
border: 5px solid var(--brand-color-faint);
left: 0;
top: -90px;
border-radius: 50%;
@ -156,7 +156,7 @@
@media screen and (max-width: 895px) {
.account-mobile-container {
display: block;
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
margin-top: 10px;
position: relative;
padding: 10px 10px 0;

View File

@ -7,7 +7,7 @@
}
.detailed-status {
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
padding: 14px 10px;
&--flex {
@ -52,7 +52,7 @@
}
.detailed-status__action-bar {
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
border-top: 1px solid lighten($ui-base-color, 8%);
border-bottom: 1px solid lighten($ui-base-color, 8%);
display: flex;

View File

@ -499,7 +499,7 @@
&::before {
content: "";
display: block;
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
position: absolute;
bottom: 0;
left: 0;
@ -522,14 +522,14 @@
height: 100%;
margin: 0;
border-radius: 50%;
border: 4px solid lighten($ui-base-color, 4%);
border: 4px solid var(--brand-color-faint);
background: darken($ui-base-color, 8%);
}
}
@media screen and (max-width: 600px) {
margin-top: 0;
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
border-radius: 0 0 4px 4px;
padding: 5px;
@ -638,7 +638,7 @@
flex: 0 0 auto;
color: $darker-text-color;
padding: 10px;
border-right: 1px solid lighten($ui-base-color, 4%);
border-right: 1px solid var(--brand-color-faint);
cursor: default;
text-align: center;
position: relative;
@ -869,7 +869,7 @@
&:hover,
&:active,
&:focus {
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
}
}
}

View File

@ -13,7 +13,7 @@
& > div,
& > a {
padding: 20px;
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
border-radius: 4px;
}

View File

@ -583,7 +583,7 @@ code {
}
&:focus {
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
}
}

View File

@ -251,7 +251,7 @@
@media screen and (max-width: $no-gap-breakpoint) {
margin-top: 0;
background: lighten($ui-base-color, 4%);
background: var(--brand-color-faint);
h1 {
font-size: 24px;