card preference 2

This commit is contained in:
2026-05-06 09:47:08 +01:00
parent b4c7b88685
commit b7824ac999
2 changed files with 11 additions and 7 deletions

View File

@@ -1191,10 +1191,14 @@ export default function App() {
</div>
)}
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 2xl:grid-cols-4 gap-10">
<div className={
cardSize === 'small' ? 'grid grid-cols-2 sm:grid-cols-4 lg:grid-cols-5 2xl:grid-cols-6 gap-6'
: cardSize === 'medium' ? 'grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 2xl:grid-cols-5 gap-8'
: 'grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 2xl:grid-cols-4 gap-10'
}>
{filteredClothes.map(item => (
<div key={item.id} className="group">
<Card className={`overflow-hidden p-0 relative border-none hover:shadow-2xl transition-all duration-500 ${cardSize === 'small' ? 'h-[240px]' : cardSize === 'medium' ? 'h-[360px]' : 'h-[480px]'}`} darkMode={darkMode}>
<Card className={`overflow-hidden p-0 relative border-none hover:shadow-2xl transition-all duration-500 ${cardSize === 'small' ? 'h-[180px]' : cardSize === 'medium' ? 'h-[320px]' : 'h-[480px]'}`} darkMode={darkMode}>
<img src={item.imageUrl} className="w-full h-full object-cover transition-transform duration-1000 group-hover:scale-110" alt={item.name} />
<div className="absolute inset-0 bg-gradient-to-t from-black/80 via-transparent opacity-0 group-hover:opacity-100 transition-all duration-300 flex flex-col justify-end p-6 pb-[136px] text-white z-10 pointer-events-none">

View File

@@ -192,7 +192,7 @@ export const translations = {
selectOneColor: "Selecione pelo menos uma cor",
addColorsToItems: "Adicione cores aos seus itens.",
or: "OU",
cardSize: "Tamanho do Card",
cardSize: "Tamanho dos itens",
cardSizeDesc: "Tamanho no armário/carrinho",
small: "Pequeno",
medium: "Médio",
@@ -391,7 +391,7 @@ export const translations = {
selectOneColor: "Select at least one color",
addColorsToItems: "Add colors to your items.",
or: "OR",
cardSize: "Card Size",
cardSize: "Item Size",
cardSizeDesc: "Size in closet/cart",
small: "Small",
medium: "Medium",
@@ -590,7 +590,7 @@ export const translations = {
selectOneColor: "Selecciona al menos un color",
addColorsToItems: "Añade colores a tus artículos.",
or: "O",
cardSize: "Tamaño de Tarjeta",
cardSize: "Tamaño de los ítems",
cardSizeDesc: "Tamaño en armario/carrito",
small: "Pequeño",
medium: "Medio",
@@ -789,7 +789,7 @@ export const translations = {
selectOneColor: "Sélectionnez au moins une couleur",
addColorsToItems: "Ajoutez des couleurs à vos articles.",
or: "OU",
cardSize: "Taille de la Carte",
cardSize: "Taille des articles",
cardSizeDesc: "Taille dans placard/panier",
small: "Petit",
medium: "Moyen",
@@ -988,7 +988,7 @@ export const translations = {
selectOneColor: "Wählen Sie mindestens eine Farbe",
addColorsToItems: "Fügen Sie Ihren Artikeln Farben hinzu.",
or: "ODER",
cardSize: "Kartengröße",
cardSize: "Artikelgröße",
cardSizeDesc: "Größe in Schrank/Warenkorb",
small: "Klein",
medium: "Mittel",