Antes de meterle a sprint 1 etapa 4 y 5

This commit is contained in:
2026-05-16 13:46:27 -03:00
parent 0ef75aa9a9
commit f9a008bce5
14 changed files with 666 additions and 8 deletions

View File

@@ -26,7 +26,7 @@ const TabsTrigger = React.forwardRef<
<TabsPrimitive.Trigger
ref={ref}
className={cn(
'inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow',
'inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-inq-orange data-[state=active]:shadow data-[state=active]:font-semibold',
className
)}
{...props}

View File

@@ -9,14 +9,19 @@
@layer base {
:root {
/* ── Shadcn/ui tokens — primary cambiado a InQ Orange ─────────────────
Antes: azul (221.2 83.2% 53.3%).
Ahora: naranja InQ #F59845 ≈ HSL(28, 90%, 62%).
Esto actualiza automáticamente Button default, Switch checked,
Tabs ring, Slider y cualquier componente que use bg-primary/text-primary. */
--background: 0 0% 100%;
--foreground: 222.2 84% 4.9%;
--card: 0 0% 100%;
--card-foreground: 222.2 84% 4.9%;
--popover: 0 0% 100%;
--popover-foreground: 222.2 84% 4.9%;
--primary: 221.2 83.2% 53.3%;
--primary-foreground: 210 40% 98%;
--primary: 28 90% 62%;
--primary-foreground: 0 0% 100%;
--secondary: 210 40% 96.1%;
--secondary-foreground: 222.2 47.4% 11.2%;
--muted: 210 40% 96.1%;
@@ -27,8 +32,25 @@
--destructive-foreground: 210 40% 98%;
--border: 214.3 31.8% 91.4%;
--input: 214.3 31.8% 91.4%;
--ring: 221.2 83.2% 53.3%;
--ring: 28 90% 62%;
--radius: 0.5rem;
/* ── InQ ROI brand variables ─────────────────────────────────────────
Para uso en CSS inline, SVG y contextos donde Tailwind no aplica.
En componentes React, preferir las clases Tailwind (bg-inq-orange, etc.) */
--inq-orange: #F59845;
--inq-orange-dark: #B45309;
--inq-orange-light: #FEF3E2;
--inq-orange-lighter: #FFF8ED;
--inq-magenta: #ED3E8F;
/* ── Semánticos ──────────────────────────────────────────────────────*/
--color-success: #16A34A;
--color-success-light: #F0FDF4;
--color-warning: #F59E0B;
--color-warning-bg: #FFFBEB;
--color-danger: #EF4444;
--color-danger-light: #FEE2E2;
}
}