cherry-pick: pub components from feat/laporan-tindakan-185

This commit is contained in:
Khafid Prayoga
2025-12-08 11:01:44 +07:00
parent 5e3d0d7911
commit a5ec824f4d
19 changed files with 434 additions and 85 deletions
@@ -1,5 +1,5 @@
<script setup lang="ts">
import { cn } from '~/lib/utils';
import { cn } from '~/lib/utils'
const props = defineProps<{
label: string
@@ -9,15 +9,17 @@ const props = defineProps<{
</script>
<template>
<div :class="cn(`flex flex-col gap-1 lg:grid lg:grid-cols-[180px_minmax(0,1fr)] lg:gap-x-3`, props.class)">
<div :class="cn(`flex flex-col gap-0.5 lg:grid lg:grid-cols-[180px_auto_minmax(0,1fr)] lg:gap-x-3 lg:gap-y-1`, props.class)">
<!-- Label -->
<span :class="cn(`text-md font-normal text-muted-foreground`, props.labelClass)">
{{ label }}
</span>
<!-- Colon (hidden on mobile) -->
<span class="hidden text-md tracking-wide text-muted-foreground lg:block">:</span>
<!-- Value -->
<span class="truncate lg:whitespace-normal">
<span class="me-3 hidden lg:inline-block">:</span>
<span class="text-md font-sans tracking-wide">
<slot />
</span>
</div>