cherrry-pick

This commit is contained in:
Khafid Prayoga
2025-12-05 18:51:14 +07:00
parent d84a13272c
commit d848e5bd07
4 changed files with 34 additions and 4 deletions

No files matched your search

@@ -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>