mirrors/woodpecker
1
0
Fork 0
mirror of https://github.com/woodpecker-ci/woodpecker.git synced 2024-09-28 14:31:59 +00:00
Code Issues Projects Releases Wiki Activity

Fix error color contrast in dark theme (#2778)

Browse source
This commit is contained in:
Lauris BH 2023-11-09 08:07:20 +02:00 committed by GitHub
parent 4c2dbca2e9
commit 6f07f2acf2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 9 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
web/src/components/atomic/Button.vue
View file

@ -8,7 +8,8 @@
color === 'gray', color === 'gray',
'bg-wp-control-ok-100 hover:bg-wp-control-ok-200 border-wp-control-ok-300 text-white': color === 'green', 'bg-wp-control-ok-100 hover:bg-wp-control-ok-200 border-wp-control-ok-300 text-white': color === 'green',
'bg-wp-control-info-100 hover:bg-wp-control-info-200 border-wp-control-info-300 text-white': color === 'blue', 'bg-wp-control-info-100 hover:bg-wp-control-info-200 border-wp-control-info-300 text-white': color === 'blue',
'bg-wp-control-error-100 hover:bg-wp-control-error-200 border-wp-control-error-300 text-white': color === 'red', 'bg-wp-control-error-100 hover:bg-wp-control-error-200 border-wp-control-error-300 text-white dark:text-dark-300':
color === 'red',
...passedClasses, ...passedClasses,
}" }"
:title="title" :title="title"

4
web/src/components/form/RadioField.vue
View file

@ -54,8 +54,8 @@ const id = (Math.random() + 1).toString(36).substring(7);
display: block; display: block;
top: 50%; top: 50%;
left: 50%; left: 50%;
width: 7px; width: 8px;
height: 7px; height: 8px;
border-radius: 50%; border-radius: 50%;
background: white; background: white;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);

2
web/src/components/repo/settings/ActionsTab.vue
View file

@ -3,7 +3,6 @@
<div class="flex flex-wrap items-center"> <div class="flex flex-wrap items-center">
<Button <Button
class="mr-4 my-1" class="mr-4 my-1"
color="blue"
start-icon="heal" start-icon="heal"
:is-loading="isRepairingRepo" :is-loading="isRepairingRepo"
:text="$t('repo.settings.actions.repair.repair')" :text="$t('repo.settings.actions.repair.repair')"
@ -13,7 +12,6 @@
<Button <Button
v-if="isActive" v-if="isActive"
class="mr-4 my-1" class="mr-4 my-1"
color="blue"
start-icon="turn-off" start-icon="turn-off"
:is-loading="isDeactivatingRepo" :is-loading="isDeactivatingRepo"
:text="$t('repo.settings.actions.disable.disable')" :text="$t('repo.settings.actions.disable.disable')"

2
web/src/views/Login.vue
View file

@ -3,7 +3,7 @@
<!-- TODO: Should use vue notifications. --> <!-- TODO: Should use vue notifications. -->
<div <div
v-if="errorMessage" v-if="errorMessage"
class="bg-wp-control-error-100 border-l-6 border-l-wp-control-error-300 text-white p-4 rounded-md" class="bg-wp-control-error-100 border-l-6 border-l-wp-control-error-300 text-white dark:text-dark-300 p-4 rounded-md"
> >
{{ errorMessage }} {{ errorMessage }}
</div> </div>

8
web/windi.config.ts
View file

@ -79,16 +79,16 @@ export default defineConfig({
300: colors.red[900], 300: colors.red[900],
}, },
'int-wp-control-error-dark': { 'int-wp-control-error-dark': {
100: tinycolor(colors.red[700]).desaturate(25).toString(), 100: tinycolor(colors.red[700]).saturate(100).brighten(40).toString(),
200: tinycolor(colors.red[800]).desaturate(25).toString(), 200: tinycolor(colors.red[800]).saturate(80).brighten(30).toString(),
300: tinycolor(colors.red[900]).desaturate(25).toString(), 300: tinycolor(colors.red[900]).saturate(80).brighten(30).toString(),
}, },
'int-wp-state-error': { 'int-wp-state-error': {
100: colors.red[700], 100: colors.red[700],
}, },
'int-wp-state-error-dark': { 'int-wp-state-error-dark': {
100: tinycolor(colors.red[700]).desaturate(25).toString(), 100: tinycolor(colors.red[700]).saturate(100).brighten(40).toString(),
}, },
'int-wp-state-neutral': { 'int-wp-state-neutral': {
100: colors.gray[600], 100: colors.gray[600],