Fix edit history CSS (#1255)
This dropdown now uses the correct background colors in the Macaron theme. Also fixed a bunch of linter errors.
This commit is contained in:
Darius Kazemi
GitHub
parent
6281823df0
commit
a5d93111aa
File diff suppressed because one or more lines are too long
|
|
@ -50,6 +50,7 @@ $dark-text-color: $purpleicon !default;
|
|||
$secondary-text-color: $ui-secondary-color !default;
|
||||
$highlight-text-color: $ui-highlight-color !default;
|
||||
$action-button-color: $purpleicon !default;
|
||||
|
||||
// For texts on inverted backgrounds
|
||||
$inverted-text-color: $ui-base-color !default;
|
||||
$lighter-text-color: $ui-base-lighter-color !default;
|
||||
|
|
@ -60,6 +61,7 @@ $cjk-langs: ja, ko, zh-CN, zh-HK, zh-TW;
|
|||
|
||||
// Variables for components
|
||||
$media-modal-media-max-width: 100%;
|
||||
|
||||
// put margins on top and bottom of image to avoid the screen covered by image.
|
||||
$media-modal-media-max-height: 80%;
|
||||
|
||||
|
|
|
|||
|
|
@ -5,34 +5,36 @@ html {
|
|||
scrollbar-color: $pink rgba($pink, 0.25);
|
||||
}
|
||||
|
||||
.loading-bar
|
||||
{
|
||||
background-color: $green;
|
||||
}
|
||||
.loading-bar {
|
||||
background-color: $green;
|
||||
}
|
||||
|
||||
.status__content a, .reply-indicator__content a {
|
||||
&:hover, &:active, &:focus {
|
||||
.status__content a,
|
||||
.reply-indicator__content a {
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
color: $bilberry;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: $pink;
|
||||
border: 0;
|
||||
background: $pink;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: $pink;
|
||||
border: 0;
|
||||
background: $pink;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: $pink;
|
||||
border: 0;
|
||||
background: $pink;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track:hover {
|
||||
background: $green;
|
||||
background: $green;
|
||||
}
|
||||
|
||||
.ui {
|
||||
|
|
@ -78,12 +80,9 @@ html {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.column-header__back-button,
|
||||
.column-header__button,
|
||||
.column-header__button.active,
|
||||
|
||||
.column-header__button.active {
|
||||
color: $ui-highlight-color;
|
||||
|
||||
|
|
@ -142,8 +141,7 @@ html {
|
|||
.box-widget input[type="email"],
|
||||
.box-widget input[type="password"],
|
||||
.box-widget textarea,
|
||||
.statuses-grid .detailed-status
|
||||
.audio-player {
|
||||
.statuses-grid .detailed-status .audio-player {
|
||||
border: 1px solid lighten(#eeeeee, 4%);
|
||||
}
|
||||
|
||||
|
|
@ -164,12 +162,12 @@ html {
|
|||
}
|
||||
|
||||
.status {
|
||||
border-bottom: 1px solid lighten(#eeeeee, 4%);
|
||||
border-bottom: 1px solid lighten(#eeeeee, 4%);
|
||||
}
|
||||
|
||||
.detailed-status__action-bar {
|
||||
border-top: 1px solid lighten($purple, 4%);
|
||||
border-bottom: 1px solid lighten($purple, 4%);
|
||||
border-top: 1px solid lighten($purple, 4%);
|
||||
border-bottom: 1px solid lighten($purple, 4%);
|
||||
}
|
||||
|
||||
.search__input {
|
||||
|
|
@ -183,7 +181,7 @@ html {
|
|||
}
|
||||
|
||||
.search__input {
|
||||
&:focus{
|
||||
&:focus {
|
||||
background: $purple;
|
||||
border: 1px solid lighten($purple, 8%);
|
||||
}
|
||||
|
|
@ -203,7 +201,8 @@ html {
|
|||
border-top-color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.notification__filter-bar, .account__section-headline {
|
||||
.notification__filter-bar,
|
||||
.account__section-headline {
|
||||
background: $green;
|
||||
border: 1px solid lighten($green, 8%);
|
||||
border-top: 0;
|
||||
|
|
@ -312,8 +311,8 @@ html {
|
|||
}
|
||||
|
||||
.status.status-direct:not(.read) {
|
||||
background: $ui-base-color;
|
||||
border-bottom-color: lighten($ui-base-color, 4%);
|
||||
background: $ui-base-color;
|
||||
border-bottom-color: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
.detailed-status,
|
||||
|
|
@ -377,13 +376,20 @@ html {
|
|||
color: $darker-text-color;
|
||||
}
|
||||
}
|
||||
|
||||
&__container {
|
||||
&__header {
|
||||
background: $white;
|
||||
border-bottom: 1px solid lighten($purple, 16%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
body.admin {
|
||||
background: $cream;
|
||||
}
|
||||
|
||||
.card>a:hover {
|
||||
.card > a:hover {
|
||||
.card__bar {
|
||||
background: $blue;
|
||||
}
|
||||
|
|
@ -417,17 +423,19 @@ body.admin {
|
|||
border-bottom: 2px solid lighten($blueberry, 8%);
|
||||
}
|
||||
|
||||
.table>tbody>tr:nth-child(odd)>td, .table>tbody>tr:nth-child(odd)>th {
|
||||
background: $green;
|
||||
.table > tbody > tr:nth-child(odd) > td,
|
||||
.table > tbody > tr:nth-child(odd) > th {
|
||||
background: $green;
|
||||
}
|
||||
|
||||
.table td, .table th {
|
||||
padding: 8px;
|
||||
line-height: 18px;
|
||||
vertical-align: top;
|
||||
border-top: 1px solid $green;
|
||||
text-align: left;
|
||||
background: $blue;
|
||||
.table td,
|
||||
.table th {
|
||||
padding: 8px;
|
||||
line-height: 18px;
|
||||
vertical-align: top;
|
||||
border-top: 1px solid $green;
|
||||
text-align: left;
|
||||
background: $blue;
|
||||
}
|
||||
|
||||
.card__bar {
|
||||
|
|
@ -438,7 +446,8 @@ body.admin {
|
|||
background: $green;
|
||||
}
|
||||
|
||||
.admin-wrapper .content h2, .admin-wrapper .content h4 {
|
||||
.admin-wrapper .content h2,
|
||||
.admin-wrapper .content h4 {
|
||||
border-bottom: 1px solid #eeeeee;
|
||||
}
|
||||
|
||||
|
|
@ -594,7 +603,7 @@ body.admin {
|
|||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
background: lighten($blue,4%);
|
||||
background: lighten($blue, 4%);
|
||||
}
|
||||
|
||||
&.active {
|
||||
|
|
@ -614,7 +623,9 @@ body.admin {
|
|||
border-bottom-color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.getting-started__wrapper, .getting-started, .flex-spacer {
|
||||
.getting-started__wrapper,
|
||||
.getting-started,
|
||||
.flex-spacer {
|
||||
background: $purple;
|
||||
}
|
||||
|
||||
|
|
@ -637,7 +648,8 @@ body.admin {
|
|||
}
|
||||
}
|
||||
|
||||
.directory__tag a:hover, .directory__tag a:focus {
|
||||
.directory__tag a:hover,
|
||||
.directory__tag a:focus {
|
||||
background: $blue;
|
||||
border: 1px solid lighten($blue, 4%);
|
||||
}
|
||||
|
|
@ -647,7 +659,9 @@ body.admin {
|
|||
border: 1px solid lighten($purple, 4%);
|
||||
}
|
||||
|
||||
.directory, .nothing-here, .directory__tag a {
|
||||
.directory,
|
||||
.nothing-here,
|
||||
.directory__tag a {
|
||||
background: $green;
|
||||
border: 1px solid lighten($green, 4%);
|
||||
}
|
||||
|
|
@ -668,13 +682,14 @@ body.admin {
|
|||
}
|
||||
|
||||
.simple_form {
|
||||
input[type=text],
|
||||
input[type=number],
|
||||
input[type=email],
|
||||
input[type=password],
|
||||
input[type="text"],
|
||||
input[type="number"],
|
||||
input[type="email"],
|
||||
input[type="password"],
|
||||
select,
|
||||
textarea {
|
||||
border-color: $blueberry;
|
||||
|
||||
&:hover {
|
||||
border-color: $bilberry;
|
||||
}
|
||||
|
|
@ -734,7 +749,6 @@ body.admin {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
.batch-table {
|
||||
&__toolbar,
|
||||
&__row,
|
||||
|
|
@ -965,7 +979,8 @@ body {
|
|||
background: $cream;
|
||||
}
|
||||
|
||||
.public-layout .header, .public-layout .public-account-header__image {
|
||||
.public-layout .header,
|
||||
.public-layout .public-account-header__image {
|
||||
background: $pink;
|
||||
border: 1px solid lighten($pink, 8%);
|
||||
}
|
||||
|
|
@ -973,7 +988,8 @@ body {
|
|||
.public-layout .header .nav-button {
|
||||
background: darken($pink, 4%);
|
||||
|
||||
&:hover, &:focus {
|
||||
&:hover,
|
||||
&:focus {
|
||||
background: darken($pink, 6%);
|
||||
}
|
||||
}
|
||||
|
|
@ -982,7 +998,7 @@ body {
|
|||
border: 4px solid $blue;
|
||||
}
|
||||
|
||||
.public-layout .public-account-header__bar:before {
|
||||
.public-layout .public-account-header__bar::before {
|
||||
background: $blue;
|
||||
border: 1px solid lighten($blue, 8%);
|
||||
}
|
||||
|
|
@ -999,7 +1015,14 @@ body {
|
|||
background: $pink;
|
||||
}
|
||||
|
||||
.notification__filter-bar button.active::before, .notification__filter-bar button.active::after, .notification__filter-bar a.active::before, .notification__filter-bar a.active::after, .account__section-headline button.active::before, .account__section-headline button.active::after, .account__section-headline a.active::before, .account__section-headline a.active::after {
|
||||
.notification__filter-bar button.active::before,
|
||||
.notification__filter-bar button.active::after,
|
||||
.notification__filter-bar a.active::before,
|
||||
.notification__filter-bar a.active::after,
|
||||
.account__section-headline button.active::before,
|
||||
.account__section-headline button.active::after,
|
||||
.account__section-headline a.active::before,
|
||||
.account__section-headline a.active::after {
|
||||
border-color: transparent transparent $white;
|
||||
}
|
||||
|
||||
|
|
@ -1068,7 +1091,8 @@ a.status-card.compact:hover {
|
|||
background: $purple;
|
||||
}
|
||||
|
||||
.admin-wrapper .sidebar ul a, .admin-wrapper .sidebar ul ul a {
|
||||
.admin-wrapper .sidebar ul a,
|
||||
.admin-wrapper .sidebar ul ul a {
|
||||
border-bottom: 1px solid $blue;
|
||||
}
|
||||
}
|
||||
|
|
@ -1120,3 +1144,12 @@ button.icon-button.disabled i.fa-retweet {
|
|||
.compose-form__upload__warning > button {
|
||||
color: $white !important;
|
||||
}
|
||||
|
||||
.dropdown-menu__item.edited-timestamp__history__item {
|
||||
border-bottom: 1px solid lighten($purple, 16%);
|
||||
|
||||
&.dropdown-menu__item--text,
|
||||
button {
|
||||
background: $white;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -35,10 +35,10 @@ $inverted-text-color: $black !default;
|
|||
$lighter-text-color: $classic-base-color !default;
|
||||
$light-text-color: #444b5d;
|
||||
|
||||
//Newly added colors
|
||||
// Newly added colors
|
||||
$account-background-color: $white !default;
|
||||
|
||||
//Invert darkened and lightened colors
|
||||
// Invert darkened and lightened colors
|
||||
@function darken($color, $amount) {
|
||||
@return hsl(hue($color), saturation($color), lightness($color) + $amount);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -838,6 +838,7 @@
|
|||
height: 20px;
|
||||
margin: -3px 0 0;
|
||||
}
|
||||
|
||||
.status__content__text {
|
||||
img {
|
||||
max-height: 300px;
|
||||
|
|
@ -938,9 +939,9 @@
|
|||
}
|
||||
|
||||
&.mention {
|
||||
span {
|
||||
text-decoration: underline;
|
||||
}
|
||||
span {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.fa {
|
||||
|
|
@ -2266,7 +2267,6 @@ a.account__display-name {
|
|||
overflow-x: hidden;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -2802,7 +2802,6 @@ $ui-header-height: 55px;
|
|||
@media screen and (max-width: 1550px) {
|
||||
overflow-y: visible;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.autosuggest-textarea__textarea {
|
||||
|
|
@ -2881,7 +2880,8 @@ $ui-header-height: 55px;
|
|||
min-height: 47px;
|
||||
display: none;
|
||||
|
||||
> img, svg {
|
||||
> img,
|
||||
svg {
|
||||
display: block;
|
||||
object-fit: contain;
|
||||
object-position: bottom left;
|
||||
|
|
@ -3639,7 +3639,7 @@ a.status-card.compact:hover {
|
|||
}
|
||||
|
||||
&__label {
|
||||
margin-top: 0px;
|
||||
margin-top: 0;
|
||||
|
||||
strong {
|
||||
display: block;
|
||||
|
|
@ -7896,7 +7896,7 @@ div.status__content--with-spoiler {
|
|||
p {
|
||||
span.show_more_button {
|
||||
display: block;
|
||||
margin: 0.25rem 0 0 0;
|
||||
margin: 0.25rem 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue