helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-11-07 17:27:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(server/web): jobs clear button + queue status (#2144)

Browse source 
* feat(server/web): jobs clear button + queue status

* adjust design and colors

* Adjust some styling

* show status next to buttons instead of on top

* Update rounded corner for badge

---------

Co-authored-by: Alex Tran <alex.tran1502@gmail.com>
This commit is contained in:
Michel Heusschen 2023-04-01 22:46:07 +02:00 • committed by GitHub
parent d04f340b5b
commit b06ddec2d5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
32 changed files with 722 additions and 242 deletions
Download patch file Download diff file Expand all files Collapse all files

20
web/src/lib/components/elements/badge.svelte
View file

@ -1,27 +1,25 @@
<script lang="ts" context="module">
export type BadgeColor = 'primary' | 'dark' | 'warning' | 'success' | 'danger';
export type BadgeRounded = false | true | 'full';
export type Color = 'primary' | 'secondary';
export type Rounded = false | true | 'full';
</script>
<script lang="ts">
export let color: BadgeColor = 'primary';
export let rounded: BadgeRounded = true;
export let color: Color = 'primary';
export let rounded: Rounded = true;
const colorClasses: { [Key in BadgeColor]: string } = {
const colorClasses: Record<Color, string> = {
primary:
'text-gray-100 dark:text-immich-dark-gray bg-immich-primary dark:bg-immich-dark-primary',
dark: 'text-neutral-50 dark:text-neutral-50 bg-neutral-900 dark:bg-neutral-900',
warning: 'text-yellow-900 bg-yellow-200',
success: 'text-green-900 bg-green-200',
danger: 'text-red-900 bg-red-200'
secondary:
'text-immich-dark-bg dark:text-immich-gray dark:bg-gray-600 bg-gray-300 dark:text-immich-gray'
};
</script>
<span
class="inline-block h-min whitespace-nowrap px-[0.65em] pt-[0.35em] pb-[0.25em] text-center align-baseline text-[0.65em] font-bold leading-none {colorClasses[
class="inline-block h-min whitespace-nowrap px-4 pt-[0.55em] pb-[0.55em] text-center align-baseline text-xs leading-none {colorClasses[
color
]}"
class:rounded={rounded === true}
class:rounded-md={rounded === true}
class:rounded-full={rounded === 'full'}
>
<slot />