230419/my_closet
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

card preference 2

Browse Source
This commit is contained in:
Vitor Moreira
2026-05-06 09:47:08 +01:00
parent b4c7b88685
commit b7824ac999
2 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/App.jsx
View File

@@ -1191,10 +1191,14 @@ export default function App() {
</div> </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 => ( {filteredClothes.map(item => (
<div key={item.id} className="group"> <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} /> <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"> <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">

10
src/lib/i18n.js
View File

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