mirror
/
soapbox
kopia lustrzana https://gitlab.com/soapbox-pub/soapbox
1
0
Forkuj 1
Kod Zgłoszenia Packages Projekty Wydania Wiki Aktywność

Improve dropdown menu style

stable/1.0.x
Alex Gleason 2020-05-31 15:51:20 -05:00
rodzic 4d484153ac
commit 78497bd924
Nie znaleziono w bazie danych klucza dla tego podpisu
ID klucza GPG: 7211D1F99744FBB7
5 zmienionych plików z 13 dodań i 42 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

28
app/styles/soapbox-light/diff.scss
Wyświetl plik

@ -39,10 +39,6 @@ body {
} }
} }
.compose-form__buttons-wrapper {
background: darken($ui-base-color, 6%);
}
.autosuggest-textarea__suggestions { .autosuggest-textarea__suggestions {
background: darken($ui-base-color, 6%); background: darken($ui-base-color, 6%);
} }
@ -105,26 +101,6 @@ body {
// Change the colors used in the dropdown menu // Change the colors used in the dropdown menu
.dropdown-menu { .dropdown-menu {
background: $ui-base-color;
&__arrow {
&.left {
border-left-color: $ui-base-color;
}
&.top {
border-top-color: $ui-base-color;
}
&.bottom {
border-bottom-color: $ui-base-color;
}
&.right {
border-right-color: $ui-base-color;
}
}
&__item { &__item {
a { a {
color: $darker-text-color; color: $darker-text-color;
@ -350,10 +326,6 @@ body {
color: #fff; color: #fff;
} }
.timeline-compose-block .compose-form .compose-form__autosuggest-wrapper .autosuggest-textarea__textarea {
background: $gab-background-base-light;
}
.promo-panel-item { .promo-panel-item {
@include light-theme-shadow; @include light-theme-shadow;
background: $gab-background-container-light; background: $gab-background-container-light;

4
app/styles/soapbox/_mixins.scss
Wyświetl plik

@ -48,7 +48,7 @@
box-shadow: none; box-shadow: none;
font-family: inherit; font-family: inherit;
background: $nav-ui-search-bg-color; background: $nav-ui-search-bg-color;
color: $nav-ui-highlight-color; color: var(--highlight-text-color);
margin: 0; margin: 0;
border-radius: 4px; border-radius: 4px;
@ -92,7 +92,7 @@
li { li {
margin: 0 0 2px; margin: 0 0 2px;
em {color: $nav-ui-highlight-color;} em {color: var(--brand-color);}
} }
} }
} }

6
app/styles/soapbox/components.scss
Wyświetl plik

@ -796,7 +796,7 @@
.account__avatar { .account__avatar {
@include avatar-radius; @include avatar-radius;
position: relative; position: relative;
background-color: $ui-base-color; background-color: var(--accent-color);
&-inline { &-inline {
display: inline-block; display: inline-block;
@ -3342,8 +3342,8 @@ a.status-card.compact:hover {
.fa-times-circle { .fa-times-circle {
@include font-size(17); @include font-size(17);
cursor: pointer; cursor: pointer;
color: $nav-ui-highlight-color; color: var(--highlight-text-color);
&:hover {color: lighten($nav-ui-highlight-color, 7%);} &:hover {color: var(--brand-color);}
} }
} }

4
app/styles/soapbox/components/compose-form.scss
Wyświetl plik

@ -98,7 +98,7 @@
width: 100%; width: 100%;
margin: 0; margin: 0;
color: $inverted-text-color; color: $inverted-text-color;
background: $simple-background-color; background: $gab-background-base-light;
padding: 10px; padding: 10px;
font-family: inherit; font-family: inherit;
font-size: 14px; font-size: 14px;
@ -283,7 +283,7 @@
.compose-form__buttons-wrapper { .compose-form__buttons-wrapper {
padding: 10px; padding: 10px;
background: darken($simple-background-color, 8%); background: $gab-background-base-light;
border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;

13
app/styles/soapbox/components/dropdown-menu.scss
Wyświetl plik

@ -4,9 +4,8 @@
@include font-weight(normal); @include font-weight(normal);
z-index: 9999; z-index: 9999;
position: absolute; position: absolute;
background: $gab-background-container; background: $gab-background-base-light;
border-radius: 4px; border-radius: 6px;
border: 1px solid $gab-placeholder-accent;
padding: 4px 0; padding: 4px 0;
color: $gab-secondary-text; color: $gab-secondary-text;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.5);
@ -25,28 +24,28 @@
right: -5px; right: -5px;
margin-top: -5px; margin-top: -5px;
border-width: 5px 0 5px 5px; border-width: 5px 0 5px 5px;
border-left-color: $gab-placeholder-accent; border-left-color: $gab-background-base-light;
} }
&.top { &.top {
bottom: -5px; bottom: -5px;
margin-left: -5px; margin-left: -5px;
border-width: 5px 5px 0; border-width: 5px 5px 0;
border-top-color: $gab-placeholder-accent; border-top-color: $gab-background-base-light;
} }
&.bottom { &.bottom {
top: -5px; top: -5px;
margin-left: -5px; margin-left: -5px;
border-width: 0 5px 5px; border-width: 0 5px 5px;
border-bottom-color: $gab-placeholder-accent; border-bottom-color: $gab-background-base-light;
} }
&.right { &.right {
left: -5px; left: -5px;
margin-top: -5px; margin-top: -5px;
border-width: 5px 5px 5px 0; border-width: 5px 5px 5px 0;
border-right-color: $gab-placeholder-accent; border-right-color: $gab-background-base-light;
} }
} }