granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

use text color css vars in ui components

Browse source
This commit is contained in:
Justin Edmund 2025-12-20 20:58:16 -08:00
parent 1a511461e5
commit d238754d8b
7 changed files with 13 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/lib/components/extra/GuidebookUnit.svelte
View file

@ -61,7 +61,7 @@
.unit { position: relative; width: 100%; display: flex; flex-direction: column; align-items: center; gap: $unit; } .unit { position: relative; width: 100%; display: flex; flex-direction: column; align-items: center; gap: $unit; }
.image { width: 100%; height: auto; border: 1px solid $grey-75; border-radius: 8px; display: block; background: var(--extra-purple-card-bg); } .image { width: 100%; height: auto; border: 1px solid $grey-75; border-radius: 8px; display: block; background: var(--extra-purple-card-bg); }
.name { font-size: $font-small; text-align: center; color: $grey-50; } .name { font-size: $font-small; text-align: center; color: var(--text-secondary); }
.remove, .add { position: absolute; top: 6px; right: 6px; background: rgba(0,0,0,.6); color: white; border: none; border-radius: 12px; width: 24px; height: 24px; line-height: 24px; cursor: pointer; } .remove, .add { position: absolute; top: 6px; right: 6px; background: rgba(0,0,0,.6); color: white; border: none; border-radius: 12px; width: 24px; height: 24px; line-height: 24px; cursor: pointer; }
.add { right: 6px; } .add { right: 6px; }
</style> </style>

6
src/lib/components/ui/DetailItem.svelte
View file

@ -179,12 +179,12 @@
.label { .label {
font-weight: typography.$medium; font-weight: typography.$medium;
color: colors.$grey-50; color: var(--text-secondary);
} }
.sublabel { .sublabel {
font-size: typography.$font-small; font-size: typography.$font-small;
color: colors.$grey-60; color: var(--text-tertiary);
font-weight: typography.$normal; font-weight: typography.$normal;
} }
@ -223,7 +223,7 @@
border: none; border: none;
border-radius: layout.$item-corner; border-radius: layout.$item-corner;
background: transparent; background: transparent;
color: colors.$grey-50; color: var(--text-secondary);
cursor: pointer; cursor: pointer;
flex-shrink: 0; flex-shrink: 0;
@include effects.smooth-transition(effects.$duration-quick, background-color, color, opacity); @include effects.smooth-transition(effects.$duration-quick, background-color, color, opacity);

2
src/lib/components/ui/DetailsHeader.svelte
View file

@ -201,7 +201,7 @@
.job-tier { .job-tier {
font-size: typography.$font-small; font-size: typography.$font-small;
color: colors.$grey-50; color: var(--text-secondary);
} }
} }
} }

6
src/lib/components/ui/DisclosureRow.svelte
View file

@ -101,7 +101,7 @@
.sublabel { .sublabel {
font-size: typography.$font-small; font-size: typography.$font-small;
color: colors.$grey-60; color: var(--text-tertiary);
font-weight: typography.$normal; font-weight: typography.$normal;
} }
@ -109,13 +109,13 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: spacing.$unit-half; gap: spacing.$unit-half;
color: colors.$grey-50; color: var(--text-secondary);
flex-shrink: 0; flex-shrink: 0;
} }
.value { .value {
font-size: typography.$font-regular; font-size: typography.$font-regular;
color: colors.$grey-50; color: var(--text-secondary);
} }
// Element-colored value // Element-colored value

2
src/lib/components/ui/SuggestionBadge.svelte
View file

@ -135,7 +135,7 @@
.suggestion-label { .suggestion-label {
font-size: calc($font-small * 0.9); font-size: calc($font-small * 0.9);
color: $grey-50; color: var(--text-secondary);
font-weight: $normal; font-weight: $normal;
} }

6
src/lib/components/ui/SuggestionDetailItem.svelte
View file

@ -228,12 +228,12 @@
.label { .label {
font-weight: typography.$medium; font-weight: typography.$medium;
color: colors.$grey-50; color: var(--text-secondary);
} }
.sublabel { .sublabel {
font-size: typography.$font-small; font-size: typography.$font-small;
color: colors.$grey-60; color: var(--text-tertiary);
font-weight: typography.$normal; font-weight: typography.$normal;
} }
@ -270,7 +270,7 @@
border: none; border: none;
border-radius: layout.$item-corner; border-radius: layout.$item-corner;
background: transparent; background: transparent;
color: colors.$grey-50; color: var(--text-secondary);
cursor: pointer; cursor: pointer;
flex-shrink: 0; flex-shrink: 0;
@include effects.smooth-transition(effects.$duration-quick, background-color, color, opacity); @include effects.smooth-transition(effects.$duration-quick, background-color, color, opacity);

2
src/lib/components/ui/checkbox/CheckboxGroup.svelte
View file

@ -89,7 +89,7 @@
.option-label { .option-label {
font-size: $font-small; font-size: $font-small;
color: $grey-50; color: var(--text-secondary);
user-select: none; user-select: none;
transition: color 0.15s ease; transition: color 0.15s ease;
} }