This commit is contained in:
David Arranz 2025-11-22 12:27:25 +01:00
parent cdd32c56db
commit a062732e5e
2 changed files with 8 additions and 42 deletions

View File

@ -2,13 +2,13 @@ export function TailwindIndicator() {
if (process.env.NODE_ENV === "production") return null; if (process.env.NODE_ENV === "production") return null;
return ( return (
<div className='fixed z-50 flex items-center justify-center p-3 font-mono text-xs text-white bg-gray-800 rounded-full bottom-1 left-1 size-6'> <div className="fixed z-50 flex items-center justify-center p-3 font-mono text-xs text-white bg-gray-800 rounded-full bottom-1 left-1 size-8">
<div className='block sm:hidden'>xs</div> <div className="block sm:hidden">xs</div>
<div className='hidden sm:block md:hidden lg:hidden xl:hidden 2xl:hidden'>sm</div> <div className="hidden sm:block md:hidden lg:hidden xl:hidden 2xl:hidden">sm</div>
<div className='hidden md:block lg:hidden xl:hidden 2xl:hidden'>md</div> <div className="hidden md:block lg:hidden xl:hidden 2xl:hidden">md</div>
<div className='hidden lg:block xl:hidden 2xl:hidden'>lg</div> <div className="hidden lg:block xl:hidden 2xl:hidden">lg</div>
<div className='hidden xl:block 2xl:hidden'>xl</div> <div className="hidden xl:block 2xl:hidden">xl</div>
<div className='hidden 2xl:block'>2xl</div> <div className="hidden 2xl:block">2xl</div>
</div> </div>
); );
} }

View File

@ -1,35 +1 @@
@source "**/*.{ts,tsx}"; @source "../**/*.{ts,tsx}";
@layer components {
/**
* Convención: .brand-[surface/text]-[escala]-[dirección]
* Requiere dark mode activo en Tailwind (class o media).
*/
/* Fondo suave diagonal */
.brand-surface-50-br {
@apply bg-gradient-to-br from-blue-50 via-violet-50 to-purple-50 dark:from-blue-950 dark:via-violet-950 dark:to-purple-950;
}
.brand-surface-100-br {
@apply bg-gradient-to-br from-blue-100 via-violet-100 to-purple-100 dark:from-blue-900 dark:via-violet-900 dark:to-purple-900;
}
/* Fondo suave horizontal */
.brand-surface-50-x {
@apply bg-gradient-to-r from-blue-50 to-violet-50 hover:from-blue-50 hover:to-violet-50 dark:from-blue-900 dark:to-violet-900;
}
.brand-surface-100-x {
@apply bg-gradient-to-r from-blue-100 to-violet-100 hover:from-blue-100 hover:to-violet-100 dark:from-blue-900 dark:to-violet-900;
}
.brand-surface-200-x {
@apply bg-gradient-to-r from-blue-200 to-violet-200 dark:from-blue-800 dark:to-violet-800;
}
/* Gradiente para texto (intenso) */
.brand-text-strong-x {
@apply bg-gradient-to-r from-blue-600 to-violet-600 bg-clip-text text-transparent antialiased dark:from-blue-400 dark:to-violet-400;
}
}