plant: private Cargill Gouda tracker (/trackers/cargill)
All checks were successful
Deploy production / deploy (push) Successful in 1m19s
All checks were successful
Deploy production / deploy (push) Successful in 1m19s
Owner-only tracker for learning the Cargill Bioindustrial plant in Gouda: schema plant (entries, links with confidence, pending refs), plant.apply_entries bulk import, overview with clusters and flow diagram, kind tabs, glossary, questions, detail pages and owner inline editing. Docs in docs/plant-tracker.md.
This commit is contained in:
51
src/lib/plant/KindIcon.svelte
Normal file
51
src/lib/plant/KindIcon.svelte
Normal file
@@ -0,0 +1,51 @@
|
||||
<script lang="ts">
|
||||
// A small gradient tile with the kind's icon (colourful icons on a black-and-white page).
|
||||
import { KIND_COLOR, KIND_LABEL, type PlantKind } from '#lib/plant.js';
|
||||
import Workflow from 'lucide-svelte/icons/workflow';
|
||||
import Package from 'lucide-svelte/icons/package';
|
||||
import Building2 from 'lucide-svelte/icons/building-2';
|
||||
import Wrench from 'lucide-svelte/icons/wrench';
|
||||
import BookA from 'lucide-svelte/icons/book-a';
|
||||
import CircleQuestionMark from 'lucide-svelte/icons/circle-question-mark';
|
||||
import StickyNote from 'lucide-svelte/icons/sticky-note';
|
||||
import UserRound from 'lucide-svelte/icons/user-round';
|
||||
|
||||
let { kind, size = 22 }: { kind: PlantKind; size?: number } = $props();
|
||||
|
||||
const ICONS = {
|
||||
process_step: Workflow,
|
||||
product: Package,
|
||||
department: Building2,
|
||||
equipment: Wrench,
|
||||
glossary: BookA,
|
||||
question: CircleQuestionMark,
|
||||
note: StickyNote,
|
||||
person_role: UserRound
|
||||
} as const;
|
||||
const Icon = $derived(ICONS[kind] ?? StickyNote);
|
||||
const colors = $derived(KIND_COLOR[kind] ?? KIND_COLOR.note);
|
||||
</script>
|
||||
|
||||
<span
|
||||
class="kind-icon"
|
||||
style:--from={colors[0]}
|
||||
style:--to={colors[1]}
|
||||
style:--size="{size}px"
|
||||
title={KIND_LABEL[kind]?.one ?? kind}
|
||||
aria-hidden="true"><Icon size={Math.round(size * 0.58)} strokeWidth={2.25} /></span
|
||||
>
|
||||
|
||||
<style>
|
||||
.kind-icon {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
width: var(--size);
|
||||
height: var(--size);
|
||||
border-radius: calc(var(--size) * 0.3);
|
||||
color: #fff;
|
||||
background: linear-gradient(135deg, var(--from), var(--to));
|
||||
box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.12);
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user