mirrors
/
hometown
mirror of https://github.com/hometown-fork/hometown.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

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 2022-12-28 11:40:29 -08:00 committed by GitHub
parent 6281823df0
commit a5d93111aa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 212 additions and 115 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

172
app/javascript/styles/fairy-floss/diff.scss
View File

File diff suppressed because one or more lines are too long

2
app/javascript/styles/fairy-floss/variables.scss
View File

@ -50,6 +50,7 @@ $dark-text-color: $purpleicon !default;
$secondary-text-color: $ui-secondary-color !default; $secondary-text-color: $ui-secondary-color !default;
$highlight-text-color: $ui-highlight-color !default; $highlight-text-color: $ui-highlight-color !default;
$action-button-color: $purpleicon !default; $action-button-color: $purpleicon !default;
// For texts on inverted backgrounds // For texts on inverted backgrounds
$inverted-text-color: $ui-base-color !default; $inverted-text-color: $ui-base-color !default;
$lighter-text-color: $ui-base-lighter-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 // Variables for components
$media-modal-media-max-width: 100%; $media-modal-media-max-width: 100%;
// put margins on top and bottom of image to avoid the screen covered by image. // put margins on top and bottom of image to avoid the screen covered by image.
$media-modal-media-max-height: 80%; $media-modal-media-max-height: 80%;

133
app/javascript/styles/macaron/diff.scss
View File

@ -5,34 +5,36 @@ html {
scrollbar-color: $pink rgba($pink, 0.25); scrollbar-color: $pink rgba($pink, 0.25);
} }
.loading-bar .loading-bar {
{ background-color: $green;
background-color: $green; }
}
.status__content a, .reply-indicator__content a { .status__content a,
&:hover, &:active, &:focus { .reply-indicator__content a {
&:hover,
&:active,
&:focus {
color: $bilberry; color: $bilberry;
} }
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background: $pink; background: $pink;
border: 0; border: 0;
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background: $pink; background: $pink;
border: 0; border: 0;
} }
::-webkit-scrollbar-thumb:hover { ::-webkit-scrollbar-thumb:hover {
background: $pink; background: $pink;
border: 0; border: 0;
} }
::-webkit-scrollbar-track:hover { ::-webkit-scrollbar-track:hover {
background: $green; background: $green;
} }
.ui { .ui {
@ -78,12 +80,9 @@ html {
} }
} }
.column-header__back-button, .column-header__back-button,
.column-header__button, .column-header__button,
.column-header__button.active, .column-header__button.active,
.column-header__button.active { .column-header__button.active {
color: $ui-highlight-color; color: $ui-highlight-color;
@ -142,8 +141,7 @@ html {
.box-widget input[type="email"], .box-widget input[type="email"],
.box-widget input[type="password"], .box-widget input[type="password"],
.box-widget textarea, .box-widget textarea,
.statuses-grid .detailed-status .statuses-grid .detailed-status .audio-player {
.audio-player {
border: 1px solid lighten(#eeeeee, 4%); border: 1px solid lighten(#eeeeee, 4%);
} }
@ -164,12 +162,12 @@ html {
} }
.status { .status {
border-bottom: 1px solid lighten(#eeeeee, 4%); border-bottom: 1px solid lighten(#eeeeee, 4%);
} }
.detailed-status__action-bar { .detailed-status__action-bar {
border-top: 1px solid lighten($purple, 4%); border-top: 1px solid lighten($purple, 4%);
border-bottom: 1px solid lighten($purple, 4%); border-bottom: 1px solid lighten($purple, 4%);
} }
.search__input { .search__input {
@ -183,7 +181,7 @@ html {
} }
.search__input { .search__input {
&:focus{ &:focus {
background: $purple; background: $purple;
border: 1px solid lighten($purple, 8%); border: 1px solid lighten($purple, 8%);
} }
@ -203,7 +201,8 @@ html {
border-top-color: lighten($ui-base-color, 8%); border-top-color: lighten($ui-base-color, 8%);
} }
.notification__filter-bar, .account__section-headline { .notification__filter-bar,
.account__section-headline {
background: $green; background: $green;
border: 1px solid lighten($green, 8%); border: 1px solid lighten($green, 8%);
border-top: 0; border-top: 0;
@ -312,8 +311,8 @@ html {
} }
.status.status-direct:not(.read) { .status.status-direct:not(.read) {
background: $ui-base-color; background: $ui-base-color;
border-bottom-color: lighten($ui-base-color, 4%); border-bottom-color: lighten($ui-base-color, 4%);
} }
.detailed-status, .detailed-status,
@ -377,13 +376,20 @@ html {
color: $darker-text-color; color: $darker-text-color;
} }
} }
&__container {
&__header {
background: $white;
border-bottom: 1px solid lighten($purple, 16%);
}
}
} }
body.admin { body.admin {
background: $cream; background: $cream;
} }
.card>a:hover { .card > a:hover {
.card__bar { .card__bar {
background: $blue; background: $blue;
} }
@ -417,17 +423,19 @@ body.admin {
border-bottom: 2px solid lighten($blueberry, 8%); border-bottom: 2px solid lighten($blueberry, 8%);
} }
.table>tbody>tr:nth-child(odd)>td, .table>tbody>tr:nth-child(odd)>th { .table > tbody > tr:nth-child(odd) > td,
background: $green; .table > tbody > tr:nth-child(odd) > th {
background: $green;
} }
.table td, .table th { .table td,
padding: 8px; .table th {
line-height: 18px; padding: 8px;
vertical-align: top; line-height: 18px;
border-top: 1px solid $green; vertical-align: top;
text-align: left; border-top: 1px solid $green;
background: $blue; text-align: left;
background: $blue;
} }
.card__bar { .card__bar {
@ -438,7 +446,8 @@ body.admin {
background: $green; background: $green;
} }
.admin-wrapper .content h2, .admin-wrapper .content h4 { .admin-wrapper .content h2,
.admin-wrapper .content h4 {
border-bottom: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee;
} }
@ -594,7 +603,7 @@ body.admin {
&:hover, &:hover,
&:active, &:active,
&:focus { &:focus {
background: lighten($blue,4%); background: lighten($blue, 4%);
} }
&.active { &.active {
@ -614,7 +623,9 @@ body.admin {
border-bottom-color: lighten($ui-base-color, 8%); border-bottom-color: lighten($ui-base-color, 8%);
} }
.getting-started__wrapper, .getting-started, .flex-spacer { .getting-started__wrapper,
.getting-started,
.flex-spacer {
background: $purple; 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; background: $blue;
border: 1px solid lighten($blue, 4%); border: 1px solid lighten($blue, 4%);
} }
@ -647,7 +659,9 @@ body.admin {
border: 1px solid lighten($purple, 4%); border: 1px solid lighten($purple, 4%);
} }
.directory, .nothing-here, .directory__tag a { .directory,
.nothing-here,
.directory__tag a {
background: $green; background: $green;
border: 1px solid lighten($green, 4%); border: 1px solid lighten($green, 4%);
} }
@ -668,13 +682,14 @@ body.admin {
} }
.simple_form { .simple_form {
input[type=text], input[type="text"],
input[type=number], input[type="number"],
input[type=email], input[type="email"],
input[type=password], input[type="password"],
select, select,
textarea { textarea {
border-color: $blueberry; border-color: $blueberry;
&:hover { &:hover {
border-color: $bilberry; border-color: $bilberry;
} }
@ -734,7 +749,6 @@ body.admin {
} }
} }
.batch-table { .batch-table {
&__toolbar, &__toolbar,
&__row, &__row,
@ -965,7 +979,8 @@ body {
background: $cream; background: $cream;
} }
.public-layout .header, .public-layout .public-account-header__image { .public-layout .header,
.public-layout .public-account-header__image {
background: $pink; background: $pink;
border: 1px solid lighten($pink, 8%); border: 1px solid lighten($pink, 8%);
} }
@ -973,7 +988,8 @@ body {
.public-layout .header .nav-button { .public-layout .header .nav-button {
background: darken($pink, 4%); background: darken($pink, 4%);
&:hover, &:focus { &:hover,
&:focus {
background: darken($pink, 6%); background: darken($pink, 6%);
} }
} }
@ -982,7 +998,7 @@ body {
border: 4px solid $blue; border: 4px solid $blue;
} }
.public-layout .public-account-header__bar:before { .public-layout .public-account-header__bar::before {
background: $blue; background: $blue;
border: 1px solid lighten($blue, 8%); border: 1px solid lighten($blue, 8%);
} }
@ -999,7 +1015,14 @@ body {
background: $pink; 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; border-color: transparent transparent $white;
} }
@ -1068,7 +1091,8 @@ a.status-card.compact:hover {
background: $purple; 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; border-bottom: 1px solid $blue;
} }
} }
@ -1120,3 +1144,12 @@ button.icon-button.disabled i.fa-retweet {
.compose-form__upload__warning > button { .compose-form__upload__warning > button {
color: $white !important; color: $white !important;
} }
.dropdown-menu__item.edited-timestamp__history__item {
border-bottom: 1px solid lighten($purple, 16%);
&.dropdown-menu__item--text,
button {
background: $white;
}
}

4
app/javascript/styles/macaron/variables.scss
View File

@ -35,10 +35,10 @@ $inverted-text-color: $black !default;
$lighter-text-color: $classic-base-color !default; $lighter-text-color: $classic-base-color !default;
$light-text-color: #444b5d; $light-text-color: #444b5d;
//Newly added colors // Newly added colors
$account-background-color: $white !default; $account-background-color: $white !default;
//Invert darkened and lightened colors // Invert darkened and lightened colors
@function darken($color, $amount) { @function darken($color, $amount) {
@return hsl(hue($color), saturation($color), lightness($color) + $amount); @return hsl(hue($color), saturation($color), lightness($color) + $amount);
} }

16
app/javascript/styles/mastodon/components.scss
View File

@ -838,6 +838,7 @@
height: 20px; height: 20px;
margin: -3px 0 0; margin: -3px 0 0;
} }
.status__content__text { .status__content__text {
img { img {
max-height: 300px; max-height: 300px;
@ -938,9 +939,9 @@
} }
&.mention { &.mention {
span { span {
text-decoration: underline; text-decoration: underline;
} }
} }
.fa { .fa {
@ -2266,7 +2267,6 @@ a.account__display-name {
overflow-x: hidden; overflow-x: hidden;
padding-right: 10px; padding-right: 10px;
} }
} }
} }
@ -2802,7 +2802,6 @@ $ui-header-height: 55px;
@media screen and (max-width: 1550px) { @media screen and (max-width: 1550px) {
overflow-y: visible; overflow-y: visible;
} }
} }
.autosuggest-textarea__textarea { .autosuggest-textarea__textarea {
@ -2881,7 +2880,8 @@ $ui-header-height: 55px;
min-height: 47px; min-height: 47px;
display: none; display: none;
> img, svg { > img,
svg {
display: block; display: block;
object-fit: contain; object-fit: contain;
object-position: bottom left; object-position: bottom left;
@ -3639,7 +3639,7 @@ a.status-card.compact:hover {
} }
&__label { &__label {
margin-top: 0px; margin-top: 0;
strong { strong {
display: block; display: block;
@ -7896,7 +7896,7 @@ div.status__content--with-spoiler {
p { p {
span.show_more_button { span.show_more_button {
display: block; display: block;
margin: 0.25rem 0 0 0; margin: 0.25rem 0 0;
} }
} }
} }