mirror of
https://github.com/woodpecker-ci/woodpecker.git
synced 2025-02-16 11:25:14 +00:00
Fix error color contrast in dark theme (#2778)
This commit is contained in:
parent
4c2dbca2e9
commit
6f07f2acf2
5 changed files with 9 additions and 10 deletions
|
@ -8,7 +8,8 @@
|
|||
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-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,
|
||||
}"
|
||||
:title="title"
|
||||
|
|
|
@ -54,8 +54,8 @@ const id = (Math.random() + 1).toString(36).substring(7);
|
|||
display: block;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background: white;
|
||||
transform: translate(-50%, -50%);
|
||||
|
|
|
@ -3,7 +3,6 @@
|
|||
<div class="flex flex-wrap items-center">
|
||||
<Button
|
||||
class="mr-4 my-1"
|
||||
color="blue"
|
||||
start-icon="heal"
|
||||
:is-loading="isRepairingRepo"
|
||||
:text="$t('repo.settings.actions.repair.repair')"
|
||||
|
@ -13,7 +12,6 @@
|
|||
<Button
|
||||
v-if="isActive"
|
||||
class="mr-4 my-1"
|
||||
color="blue"
|
||||
start-icon="turn-off"
|
||||
:is-loading="isDeactivatingRepo"
|
||||
:text="$t('repo.settings.actions.disable.disable')"
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<!-- TODO: Should use vue notifications. -->
|
||||
<div
|
||||
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 }}
|
||||
</div>
|
||||
|
|
|
@ -79,16 +79,16 @@ export default defineConfig({
|
|||
300: colors.red[900],
|
||||
},
|
||||
'int-wp-control-error-dark': {
|
||||
100: tinycolor(colors.red[700]).desaturate(25).toString(),
|
||||
200: tinycolor(colors.red[800]).desaturate(25).toString(),
|
||||
300: tinycolor(colors.red[900]).desaturate(25).toString(),
|
||||
100: tinycolor(colors.red[700]).saturate(100).brighten(40).toString(),
|
||||
200: tinycolor(colors.red[800]).saturate(80).brighten(30).toString(),
|
||||
300: tinycolor(colors.red[900]).saturate(80).brighten(30).toString(),
|
||||
},
|
||||
|
||||
'int-wp-state-error': {
|
||||
100: colors.red[700],
|
||||
},
|
||||
'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': {
|
||||
100: colors.gray[600],
|
||||
|
|
Loading…
Reference in a new issue