feat: Redesign conversation card component UI (#12957)

This commit is contained in:
Sivin Varghese
2025-12-01 10:18:14 +05:30
committed by GitHub
parent a0edf2e6e3
commit f6852c33cb
51 changed files with 1654 additions and 2174 deletions
@@ -24,20 +24,20 @@ const handleChange = event => {
</script>
<template>
<div class="relative w-4 h-4">
<div class="relative w-3.5 h-3.5">
<input
:checked="modelValue"
:indeterminate="indeterminate"
type="checkbox"
:disabled="disabled"
class="peer absolute inset-0 z-10 h-4 w-4 disabled:opacity-50 appearance-none rounded border border-n-slate-6 ring-transparent transition-all duration-200 checked:border-n-brand checked:bg-n-brand dark:border-gray-600 dark:checked:border-n-brand indeterminate:border-n-brand indeterminate:bg-n-brand hover:enabled:bg-n-blue-border cursor-pointer"
class="peer absolute inset-0 z-10 h-3.5 w-3.5 disabled:opacity-50 appearance-none rounded border border-n-slate-6 bg-n-slate-2 ring-transparent transition-all duration-100 checked:border-n-brand checked:bg-n-brand dark:border-gray-600 dark:bg-n-slate-2 dark:checked:border-n-brand indeterminate:border-n-brand indeterminate:bg-n-brand hover:enabled:bg-n-blue-border cursor-pointer"
@change="handleChange"
/>
<!-- Checkmark SVG -->
<svg
viewBox="0 0 14 14"
fill="none"
class="pointer-events-none absolute w-3.5 h-3.5 z-20 stroke-white opacity-0 peer-checked:opacity-100 transition-opacity duration-200 left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2"
class="pointer-events-none absolute w-2.5 h-2.5 z-20 stroke-white opacity-0 peer-checked:opacity-100 transition-opacity duration-200 left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2"
>
<path
d="M3 8L6 11L11 3.5"
@@ -50,7 +50,7 @@ const handleChange = event => {
<svg
viewBox="0 0 14 14"
fill="none"
class="pointer-events-none absolute w-3.5 h-3.5 z-20 stroke-white opacity-0 peer-indeterminate:opacity-100 transition-opacity duration-200 left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2"
class="pointer-events-none absolute w-2.5 h-2.5 z-20 stroke-white opacity-0 peer-indeterminate:opacity-100 transition-opacity duration-200 left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2"
>
<path
d="M3 7L11 7"