Merge pull request #801 from kmycode/upstream-20240817

Upstream 20240817
This commit is contained in:
KMY(雪あすか) 2024-08-17 10:22:34 +09:00 committed by GitHub
commit fef0b7e28b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
97 changed files with 1377 additions and 472 deletions

View file

@ -697,7 +697,7 @@ body,
top: 15px;
.avatar {
border-radius: 4px;
border-radius: var(--avatar-border-radius);
width: 40px;
height: 40px;
}
@ -748,7 +748,7 @@ body,
top: 15px;
.avatar {
border-radius: 4px;
border-radius: var(--avatar-border-radius);
width: 40px;
height: 40px;
}
@ -872,6 +872,7 @@ a.name-tag,
.account {
padding: 0;
border: none;
&__avatar-wrapper {
margin-inline-start: 0;
@ -1602,7 +1603,7 @@ a.sparkline {
position: absolute;
inset-inline-start: 15px;
top: 15px;
border-radius: 4px;
border-radius: var(--avatar-border-radius);
width: 40px;
height: 40px;
}

View file

@ -1878,6 +1878,7 @@ body > [data-popper-placement] {
.account {
padding: 16px;
border-bottom: 1px solid var(--background-border-color);
.account__display-name {
flex: 1 1 auto;
@ -2066,13 +2067,14 @@ body > [data-popper-placement] {
.account__avatar {
display: block;
position: relative;
border-radius: var(--avatar-border-radius);
img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 4px;
border-radius: var(--avatar-border-radius);
}
&-inline {
@ -2926,7 +2928,7 @@ $ui-header-logo-wordmark-width: 99px;
overflow: hidden;
}
@media screen and (width >= 631px) {
@media screen and (width > $mobile-breakpoint) {
.columns-area {
padding: 0;
}
@ -4393,6 +4395,10 @@ a.status-card {
}
}
.timeline-hint--with-descendants {
border-top: 1px solid var(--background-border-color);
}
.regeneration-indicator {
text-align: center;
font-size: 16px;
@ -4647,10 +4653,19 @@ a.status-card {
opacity: 1;
z-index: 1;
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 {
max-height: 0;
opacity: 0.5;
border-bottom: 0;
}
&.animating {
@ -4667,13 +4682,7 @@ a.status-card {
}
.column-header__collapsible-inner {
border: 1px solid var(--background-border-color);
border-top: 0;
@media screen and (max-width: $no-gap-breakpoint) {
border-left: 0;
border-right: 0;
}
}
.column-header__setting-btn {
@ -6013,7 +6022,7 @@ a.status-card {
user-select: text;
display: flex;
@media screen and (width <= 630px) {
@media screen and (width <= $mobile-breakpoint) {
margin-top: auto;
}
}
@ -6372,7 +6381,7 @@ a.status-card {
border-radius: 0 0 16px 16px;
border-top: 0;
@media screen and (max-width: $no-gap-breakpoint) {
@media screen and (max-width: $mobile-breakpoint) {
border-radius: 0;
border-bottom: 0;
padding-bottom: 32px;
@ -7667,9 +7676,18 @@ a.status-card {
}
.scrollable .account-card__title__avatar {
img,
img {
border: 2px solid var(--background-color);
}
.account__avatar {
border-color: lighten($ui-base-color, 8%);
border: none;
}
}
.scrollable .account-card__header {
img {
border-radius: 4px;
}
}
@ -8402,7 +8420,7 @@ noscript {
.account__avatar {
background: var(--background-color);
border: 1px solid var(--background-border-color);
border-radius: 4px;
border-radius: var(--avatar-border-radius);
}
}
}
@ -9531,8 +9549,9 @@ noscript {
backdrop-filter: var(--background-filter);
border: 1px solid var(--modal-border-color);
padding: 24px;
box-sizing: border-box;
@media screen and (max-width: $no-gap-breakpoint) {
@media screen and (max-width: $mobile-breakpoint) {
border-radius: 16px 16px 0 0;
border-bottom: 0;
padding-bottom: 32px;
@ -10900,6 +10919,13 @@ noscript {
gap: 8px;
flex: 1 1 auto;
overflow: hidden;
container-type: inline-size;
@container (width < 350px) {
&__header time {
display: none;
}
}
&__header {
display: flex;
@ -10958,6 +10984,11 @@ noscript {
border-radius: 8px;
padding: 8px;
}
&__additional-content {
color: $darker-text-color;
margin-top: -8px; // to offset the parent's `gap` property
}
}
&__avatar-group {

View file

@ -81,7 +81,7 @@
height: 100%;
display: block;
margin: 0;
border-radius: 4px;
border-radius: var(--avatar-border-radius);
}
}

View file

@ -324,7 +324,7 @@ code {
margin-bottom: 10px;
max-width: 100%;
height: auto;
border-radius: 4px;
border-radius: var(--avatar-border-radius);
background: url('images/void.png');
&[src$='missing.png'] {

View file

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

View file

@ -93,6 +93,7 @@ $media-modal-media-max-width: 100%;
$media-modal-media-max-height: 80%;
$no-gap-breakpoint: 1175px;
$mobile-breakpoint: 630px;
$font-sans-serif: 'mastodon-font-sans-serif' !default;
$font-display: 'mastodon-font-display' !default;
@ -113,4 +114,5 @@ $font-monospace: 'mastodon-font-monospace' !default;
--surface-background-color: #{darken($ui-base-color, 4%)};
--surface-variant-background-color: #{$ui-base-color};
--surface-variant-active-background-color: #{lighten($ui-base-color, 4%)};
--avatar-border-radius: 8px;
}