diff --git a/parfum-shop/src/App.css b/parfum-shop/src/App.css index ac4291c..c602be5 100644 --- a/parfum-shop/src/App.css +++ b/parfum-shop/src/App.css @@ -116,6 +116,8 @@ backdrop-filter: blur(8px); } +/* --------------------------------------------------- */ + /* SECTIONS */ .section { padding: 28px 20px 10px; @@ -135,6 +137,8 @@ color: #1d1d1d; } +/* --------------------------------------------------- */ + /* GRID */ .product-grid { display: grid; @@ -184,7 +188,7 @@ } .product-image { - width: 100%; + width: 100%; /* Angepasst auf Card */ max-width: 600px; height: auto; object-fit: contain; @@ -212,6 +216,8 @@ line-height: 1; } +/* --------------------------------------------------- */ + /* DISCOVERY */ .discovery-section { display: grid; @@ -267,6 +273,8 @@ cursor: pointer; } +/* --------------------------------------------------- */ + /* RESPONSIVE */ @media (max-width: 900px) { .hero { @@ -326,4 +334,8 @@ .product-card { min-height: 320px; } -} \ No newline at end of file + + +} + +/* --------------------------------------------------- */ \ No newline at end of file diff --git a/parfum-shop/src/App.jsx b/parfum-shop/src/App.jsx index 55b0b27..1b8477a 100644 --- a/parfum-shop/src/App.jsx +++ b/parfum-shop/src/App.jsx @@ -1,5 +1,6 @@ import "./App.css"; +//Images for the grid const perfumes = [ { id: "01", @@ -48,7 +49,9 @@ const perfumes = [ function App() { return (