mirrors/woodpecker
1
0
Fork 0
mirror of https://github.com/woodpecker-ci/woodpecker.git synced 2025-02-16 19:35:14 +00:00
Code Issues Projects Releases Wiki Activity

Make service icon rotate (#3149)

Browse source 
add animation for color blind people

[video](https://cloud.obermui.de/s/adpxqpMw6dEgZcC/download/recording_woodpecker-pull-3148.mkv)
This commit is contained in:
6543 2024-01-09 07:45:41 +01:00 committed by GitHub
parent 5715bd1027
commit 1ee2b8c41c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
web/src/components/repo/pipeline/PipelineStatusIcon.vue
View file

@ -11,6 +11,7 @@
'text-wp-state-ok-100': pipelineStatusColors[status] === 'green',
'text-wp-state-info-100': pipelineStatusColors[status] === 'blue',
'text-wp-state-warn-100': pipelineStatusColors[status] === 'orange',
'rotate-animation': service && pipelineStatusColors[status] === 'blue',
}"
/>
</div>

13
web/src/style.css
View file

@ -150,3 +150,16 @@ body,
.code-box-inline {
@apply bg-wp-code-200 rounded-md text-wp-code-text-100;
}
/* TODO(2194): https://tailwindcss.com/docs/animation */
@keyframes rotate-kf {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.rotate-animation {
animation: rotate-kf 2s linear infinite;
}