gnh1201/mastodon
1
0
Fork 0
mirror of https://github.com/mastodon/mastodon.git synced 2025-11-29 19:03:41 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

Replace $ui-base-lighter-color

Browse Source
This commit is contained in:
diondiondion 2025-10-23 10:42:42 +02:00
parent d3cdb0100a
commit e1a49267e9
5 changed files with 21 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/javascript/styles/mastodon-light/variables.scss
View File

@ -11,6 +11,5 @@ $grey-600: hsl(240deg, 8%, 33%); // Trout
@use '../mastodon/variables' with ( @use '../mastodon/variables' with (
$ui-base-color: hsl(255deg, 25%, 88%), $ui-base-color: hsl(255deg, 25%, 88%),
$ui-base-lighter-color: hsl(250deg, 24%, 75%),
$emojis-requiring-inversion: 'chains' $emojis-requiring-inversion: 'chains'
); );

4
app/javascript/styles/mastodon/_variables.scss
View File

@ -15,10 +15,6 @@ $grey-100: hsl(240deg, 51%, 90%); // Topaz
// Tell UI to use selected colors // Tell UI to use selected colors
$ui-base-color: hsl(240deg, 16%, 19%) !default; // Darkest $ui-base-color: hsl(240deg, 16%, 19%) !default; // Darkest
$ui-base-lighter-color: lighten(
$ui-base-color,
26%
) !default; // Lighter darkest
// Keep this filter a SCSS variable rather than // Keep this filter a SCSS variable rather than
// a CSS Custom Property due to this Safari bug: // a CSS Custom Property due to this Safari bug:

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

@ -5338,7 +5338,7 @@ a.status-card {
inset-inline-start: 0; inset-inline-start: 0;
z-index: -1; z-index: -1;
border-radius: 4px; border-radius: 4px;
background: $ui-base-color; background: var(--clr-bg-elevated);
box-shadow: 0 0 5px var(--clr-shadow-primary); box-shadow: 0 0 5px var(--clr-shadow-primary);
} }
@ -5351,7 +5351,7 @@ a.status-card {
color: var(--clr-text-primary); color: var(--clr-text-primary);
font-size: 18px; font-size: 18px;
font-weight: 500; font-weight: 500;
border: 2px dashed $ui-base-lighter-color; border: 2px dashed var(--clr-border-primary);
border-radius: 4px; border-radius: 4px;
} }

9
app/javascript/styles/mastodon/forms.scss
View File

@ -944,9 +944,9 @@ code {
} }
.permissions-list { .permissions-list {
border: 1px solid $ui-base-color; border: 1px solid var(--clr-border-primary);
border-radius: 4px; border-radius: 4px;
background: darken($ui-base-color, 4%); background: var(--clr-bg-secondary);
margin-bottom: 30px; margin-bottom: 30px;
} }
@ -1229,7 +1229,6 @@ code {
align-items: center; align-items: center;
padding-bottom: 30px; padding-bottom: 30px;
margin-bottom: 30px; margin-bottom: 30px;
color: $white;
li { li {
flex: 0 0 auto; flex: 0 0 auto;
@ -1238,7 +1237,7 @@ code {
.separator { .separator {
height: 2px; height: 2px;
background: $ui-base-lighter-color; background: var(--clr-border-primary);
flex: 1 1 auto; flex: 1 1 auto;
&.completed { &.completed {
@ -1252,7 +1251,7 @@ code {
width: 30px; width: 30px;
height: 30px; height: 30px;
border-radius: 50%; border-radius: 50%;
border: 2px solid $ui-base-lighter-color; border: 2px solid var(--clr-border-primary);
flex: 0 0 auto; flex: 0 0 auto;
display: flex; display: flex;
align-items: center; align-items: center;

18
app/javascript/styles/mastodon/modal.scss
View File

@ -2,13 +2,25 @@
@use 'functions' as *; @use 'functions' as *;
.modal-layout { .modal-layout {
background: darken($ui-base-color, 4%) background: var(--clr-bg-accent-subtle);
url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.80078 31.757813" width="234.80078" height="31.757812"><path d="M19.599609 0c-1.05 0-2.10039.375-2.90039 1.125L0 16.925781v14.832031h234.80078V17.025391l-16.5-15.900391c-1.6-1.5-4.20078-1.5-5.80078 0l-13.80078 13.099609c-1.6 1.5-4.19883 1.5-5.79883 0L179.09961 1.125c-1.6-1.5-4.19883-1.5-5.79883 0L159.5 14.224609c-1.6 1.5-4.20078 1.5-5.80078 0L139.90039 1.125c-1.6-1.5-4.20078-1.5-5.80078 0l-13.79883 13.099609c-1.6 1.5-4.20078 1.5-5.80078 0L100.69922 1.125c-1.600001-1.5-4.198829-1.5-5.798829 0l-13.59961 13.099609c-1.6 1.5-4.200781 1.5-5.800781 0L61.699219 1.125c-1.6-1.5-4.198828-1.5-5.798828 0L42.099609 14.224609c-1.6 1.5-4.198828 1.5-5.798828 0L22.5 1.125C21.7.375 20.649609 0 19.599609 0z" fill="#{hex-color($ui-base-lighter-color)}33"/></svg>')
repeat-x bottom fixed;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100vh; height: 100vh;
padding: 0; padding: 0;
&::after {
content: '';
position: absolute;
inset: auto 0 0;
height: 32px;
background-color: var(--clr-bg-accent-subtle);
/* Decorative zig-zag pattern at the bottom of the page */
mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.80078 31.757813" width="234.80078" height="31.757812"><path d="M19.599609 0c-1.05 0-2.10039.375-2.90039 1.125L0 16.925781v14.832031h234.80078V17.025391l-16.5-15.900391c-1.6-1.5-4.20078-1.5-5.80078 0l-13.80078 13.099609c-1.6 1.5-4.19883 1.5-5.79883 0L179.09961 1.125c-1.6-1.5-4.19883-1.5-5.79883 0L159.5 14.224609c-1.6 1.5-4.20078 1.5-5.80078 0L139.90039 1.125c-1.6-1.5-4.20078-1.5-5.80078 0l-13.79883 13.099609c-1.6 1.5-4.20078 1.5-5.80078 0L100.69922 1.125c-1.600001-1.5-4.198829-1.5-5.798829 0l-13.59961 13.099609c-1.6 1.5-4.200781 1.5-5.800781 0L61.699219 1.125c-1.6-1.5-4.198828-1.5-5.798828 0L42.099609 14.224609c-1.6 1.5-4.198828 1.5-5.798828 0L22.5 1.125C21.7.375 20.649609 0 19.599609 0z" fill="black"/></svg>');
mask-position: bottom;
mask-repeat: repeat-x;
z-index: -1;
}
} }
.modal-layout__mastodon { .modal-layout__mastodon {