techhub/mastodon
2
0
Fork 0
Code Activity

Visibility Modal fixes (#35865)

Browse Source
This commit is contained in:
Echo
2025-08-22 14:34:37 +02:00
committed by GitHub
parent a1c7b853ec
commit 4df50b9c7e
5 changed files with 64 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
app/javascript/styles/mastodon-light/diff.scss
View File

@@ -384,14 +384,8 @@
.compose-form__actions .icon-button.active,
.dropdown-button.active,
.privacy-dropdown__option.active,
.privacy-dropdown__option:focus,
.language-dropdown__dropdown__results__item:focus,
.language-dropdown__dropdown__results__item.active,
.privacy-dropdown__option:focus .privacy-dropdown__option__content,
.privacy-dropdown__option:focus .privacy-dropdown__option__content strong,
.privacy-dropdown__option.active .privacy-dropdown__option__content,
.privacy-dropdown__option.active .privacy-dropdown__option__content strong,
.language-dropdown__dropdown__results__item:focus
.language-dropdown__dropdown__results__item__common-name,
.language-dropdown__dropdown__results__item.active
@@ -399,6 +393,14 @@
color: $white;
}
.privacy-dropdown__option,
.visibility-dropdown__option {
&:focus,
&.active {
--dropdown-text-color: #{$white};
}
}
.compose-form .spoiler-input__input {
color: lighten($ui-highlight-color, 8%);
}

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

@@ -5496,6 +5496,8 @@ a.status-card {
.privacy-dropdown__option,
.visibility-dropdown__option {
--dropdown-text-color: $primary-text-color;
font-size: 14px;
line-height: 20px;
letter-spacing: 0.25px;
@@ -5505,7 +5507,22 @@ a.status-card {
align-items: center;
gap: 12px;
border-radius: 4px;
color: $primary-text-color;
color: var(--dropdown-text-color);
// Make sure adjacent hover/active states don't have a meeting radius.
&:hover + &:is(:focus, .active),
&:is(:focus, .active) + &:hover,
&:is(:focus, .active) + &:is(:focus, .active) {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
&:hover:has(+ :focus, .active),
&:is(:focus, .active):has(+ :hover),
&:is(:focus, .active):has(+ :is(:focus, .active)) {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
&:hover,
&:active {
@@ -5515,7 +5532,7 @@ a.status-card {
&:focus,
&.active {
background: $ui-highlight-color;
color: $primary-text-color;
color: var(--dropdown-text-color);
outline: 0;
.privacy-dropdown__option__content,
@@ -5524,7 +5541,7 @@ a.status-card {
.visibility-dropdown__option__content,
.visibility-dropdown__option__content strong,
.visibility-dropdown__option__additional {
color: $primary-text-color;
color: var(--dropdown-text-color);
}
}
@@ -6532,6 +6549,14 @@ a.status-card {
max-height: 45vh;
}
}
&__actions {
display: flex;
align-items: center;
gap: 8px;
justify-content: flex-end;
padding: 0 24px 24px;
}
}
&__popout {