erik/mastodon
1
0
Fork 0
mirror of https://github.com/mastodon/mastodon.git synced 2024-08-20 21:08:15 -07:00
Code Issues Projects Releases Wiki Activity

Fix collapsable column borders in Safari and improve Safari scrollbars (#31389)

Browse source
This commit is contained in:
Michael Stanclift 2024-08-13 16:54:03 -05:00 committed by GitHub
parent d767439205
commit 7d4b602cb2
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 15 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
app/javascript/styles/mastodon/components.scss
View file

@ -4503,10 +4503,19 @@ a.status-card {
opacity: 1; opacity: 1;
z-index: 1; z-index: 1;
position: relative; position: relative;
border-left: 1px solid var(--background-border-color);
border-right: 1px solid var(--background-border-color);
border-bottom: 1px solid var(--background-border-color);
@media screen and (max-width: $no-gap-breakpoint) {
border-left: 0;
border-right: 0;
}
&.collapsed { &.collapsed {
max-height: 0; max-height: 0;
opacity: 0.5; opacity: 0.5;
border-bottom: 0;
} }
&.animating { &.animating {
@ -4523,13 +4532,7 @@ a.status-card {
} }
.column-header__collapsible-inner { .column-header__collapsible-inner {
border: 1px solid var(--background-border-color);
border-top: 0; border-top: 0;
@media screen and (max-width: $no-gap-breakpoint) {
border-left: 0;
border-right: 0;
}
} }
.column-header__setting-btn { .column-header__setting-btn {

31
app/javascript/styles/mastodon/reset.scss
View file

@ -54,40 +54,21 @@ table {
} }
html { html {
scrollbar-color: lighten($ui-base-color, 4%) rgba($base-overlay-background, 0.1); scrollbar-color: var(--background-border-color);
} }
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 12px; width: 4px;
height: 12px; height: 4px;
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background: lighten($ui-base-color, 4%); background-color: $ui-highlight-color;
border: 0px none $base-border-color; opacity: .25;
border-radius: 50px;
}
::-webkit-scrollbar-thumb:hover {
background: lighten($ui-base-color, 6%);
}
::-webkit-scrollbar-thumb:active {
background: lighten($ui-base-color, 4%);
} }
::-webkit-scrollbar-track { ::-webkit-scrollbar-track {
border: 0px none $base-border-color; background-color: var(--background-border-color);
border-radius: 0;
background: rgba($base-overlay-background, 0.1);
}
::-webkit-scrollbar-track:hover {
background: $ui-base-color;
}
::-webkit-scrollbar-track:active {
background: $ui-base-color;
} }
::-webkit-scrollbar-corner { ::-webkit-scrollbar-corner {