.
This commit is contained in:
parent
cdd32c56db
commit
a062732e5e
@ -2,13 +2,13 @@ export function TailwindIndicator() {
|
||||
if (process.env.NODE_ENV === "production") return null;
|
||||
|
||||
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='block sm:hidden'>xs</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 lg:block xl:hidden 2xl:hidden'>lg</div>
|
||||
<div className='hidden xl:block 2xl:hidden'>xl</div>
|
||||
<div className='hidden 2xl:block'>2xl</div>
|
||||
<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="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 lg:block xl:hidden 2xl:hidden">lg</div>
|
||||
<div className="hidden xl:block 2xl:hidden">xl</div>
|
||||
<div className="hidden 2xl:block">2xl</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -1,35 +1 @@
|
||||
@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;
|
||||
}
|
||||
}
|
||||
@source "../**/*.{ts,tsx}";
|
||||
|
||||
Loading…
Reference in New Issue
Block a user