immich-app/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-12-20 09:15:35 +03:00
Code Issues Packages Projects Releases 18 Wiki Activity

refactor: css variables (#19146)

Browse Source
This commit is contained in:
Jason Rasmussen
2025-06-12 19:06:38 -04:00
committed by GitHub
parent 2f3d4e15d2
commit 8923d5b0a3
19 changed files with 63 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
web/src/lib/components/elements/badge.svelte
View File

@@ -1,29 +1,16 @@
<script lang="ts" module>
export type Color = 'primary' | 'secondary';
export type Rounded = false | true | 'full';
</script>
<script lang="ts">
import type { Snippet } from 'svelte';
interface Props {
color?: Color;
rounded?: Rounded;
rounded?: boolean | 'full';
children?: Snippet;
}
let { color = 'primary', rounded = true, children }: Props = $props();
const colorClasses: Record<Color, string> = {
primary: 'text-gray-100 dark:text-immich-dark-gray bg-immich-primary dark:bg-immich-dark-primary',
secondary: 'text-immich-dark-bg dark:text-immich-gray dark:bg-gray-600 bg-gray-300 dark:text-immich-gray',
};
let { rounded = true, children }: Props = $props();
</script>
<span
class="inline-block h-min whitespace-nowrap px-3 py-1 text-center align-baseline text-xs leading-none {colorClasses[
color
]}"
class="bg-primary text-subtle inline-block h-min whitespace-nowrap px-3 py-1 text-center align-baseline text-xs leading-none"
class:rounded-md={rounded === true}
class:rounded-full={rounded === 'full'}
>