Evandro Fonseca Junior
166abeb64e
Updated CardList component to use ListaProductCard instead of ProductCard for rendering products, improving component specificity for list views. Also adjusted indentation for consistency.
109 lines
2.1 KiB
CSS
109 lines
2.1 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
/* Otimizações de performance para animações */
|
|
@layer utilities {
|
|
.animate-in {
|
|
animation: fadeInUp 0.6s ease-out forwards;
|
|
}
|
|
|
|
.fade-in-0 {
|
|
opacity: 0;
|
|
}
|
|
|
|
.slide-in-from-bottom-4 {
|
|
transform: translateY(1rem);
|
|
}
|
|
|
|
@keyframes fadeInUp {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(1rem);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
/* Otimização para listas grandes */
|
|
.product-grid {
|
|
contain: layout style paint;
|
|
}
|
|
|
|
.product-card {
|
|
will-change: transform;
|
|
backface-visibility: hidden;
|
|
}
|
|
}
|
|
|
|
@layer base {
|
|
:root {
|
|
--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: 215 90% 50%;
|
|
/* Azul Royal (#0055FF) */
|
|
--primary-foreground: 210 40% 98%;
|
|
|
|
--secondary: 185 70% 45%;
|
|
/* Verde-azulado (#19A7A7) */
|
|
--secondary-foreground: 222.2 47.4% 11.2%;
|
|
|
|
--muted: 210 40% 96.1%;
|
|
--muted-foreground: 215.4 16.3% 46.9%;
|
|
|
|
--accent: 185 70% 95%;
|
|
/* Verde-azulado claro */
|
|
--accent-foreground: 222.2 47.4% 11.2%;
|
|
|
|
--destructive: 0 84.2% 60.2%;
|
|
--destructive-foreground: 210 40% 98%;
|
|
|
|
--border: 214.3 31.8% 91.4%;
|
|
--input: 214.3 31.8% 91.4%;
|
|
--ring: 215 90% 50%;
|
|
--radius: 0.5rem;
|
|
}
|
|
|
|
.dark {
|
|
--background: 217 33% 17%;
|
|
/* Fundo escuro azulado */
|
|
--foreground: 210 40% 98%;
|
|
|
|
--card: 217 33% 17%;
|
|
--card-foreground: 210 40% 98%;
|
|
|
|
--popover: 217 33% 17%;
|
|
--popover-foreground: 210 40% 98%;
|
|
|
|
--primary: 215 90% 60%;
|
|
/* Azul Royal mais claro */
|
|
--primary-foreground: 222.2 47.4% 11.2%;
|
|
|
|
--secondary: 185 70% 40%;
|
|
/* Verde-azulado ajustado */
|
|
--secondary-foreground: 210 40% 98%;
|
|
|
|
--muted: 217 33% 25%;
|
|
--muted-foreground: 215 20.2% 65.1%;
|
|
|
|
--accent: 185 70% 25%;
|
|
--accent-foreground: 210 40% 98%;
|
|
|
|
--destructive: 0 62.8% 30.6%;
|
|
--destructive-foreground: 210 40% 98%;
|
|
|
|
--border: 217 33% 25%;
|
|
--input: 217 33% 25%;
|
|
--ring: 215 90% 60%;
|
|
}
|
|
}
|