diff --git a/assets/css/productpage.css b/assets/css/productpage.css index 27df462..20b2d4c 100644 --- a/assets/css/productpage.css +++ b/assets/css/productpage.css @@ -91,3 +91,108 @@ S flex-direction: column; } } + + +/********* SHOP OFFERS *************/ + +.shop-offers { + margin: 50px 0 80px 0; /* unten mehr Abstand */ + display: flex; + color: white; + flex-direction: column; + gap: 14px; /* etwas enger */ +} + +.shop-line { + display: flex; + align-items: center; + justify-content: space-between; + + background: #1f2a3a; + border: 1px solid #2f3c52; + border-radius: 12px; + + padding: 12px 20px; /* vorher 20px 28px → jetzt kompakter */ + min-height: 70px; /* feste, schlanke Höhe */ +} + +.shop-line:hover { + background: #243248; + transform: translateY(-3px); + box-shadow: 0 8px 20px rgba(0,0,0,0.25); +} + +.shop-left { + display: flex; + align-items: center; + gap: 16px; +} + +.shop-logo { + display: flex; + align-items: center; + height: 40px; /* feste Höhe */ +} + +.shop-logo img { + max-height: 40px; /* Logo passt sich an */ + max-width: 100px; /* verhindert Überstehen */ + object-fit: contain; +} + +.shop-name { + color: white; + font-weight: 600; + font-size: 16px; + text-decoration: none; +} + +.shop-name:hover { + text-decoration: underline; +} + +.shop-middle { + display: flex; /* statt column */ + align-items: center; + gap: 30px; /* Abstand zwischen Preis / Versand / Lager */ + color: #cbd5e1; + font-size: 14px; +} +.shop-shipping { + display: flex; + flex-direction: column; + gap: 4px; +} + +.shop-stock { + font-weight: 500; + display: flex; + align-items: center; + gap: 6px; +} + +/* Grün */ +.shop-stock.in-stock::before { + content: "✔"; + color: #22c55e; +} + +/* Rot */ +.shop-stock.out-stock::before { + content: "✖"; + color: #ef4444; +} + +.shop-price { + font-size: 18px; /* kleiner als vorher */ + font-weight: 700; + color: #4ade80; +} + +.no-shop { + background: #1f2a3a; + padding: 20px; + border-radius: 12px; + color: #cbd5e1; + text-align: center; +} \ No newline at end of file diff --git a/assets/images/shopLogo/Apple.png b/assets/images/shopLogo/Apple.png new file mode 100644 index 0000000..dbafb53 Binary files /dev/null and b/assets/images/shopLogo/Apple.png differ diff --git a/productpage.php b/productpage.php index ddfb92a..e9fb594 100644 --- a/productpage.php +++ b/productpage.php @@ -181,7 +181,7 @@ $productId = isset($_GET['id']) ? (int)$_GET['id'] : 0;
- - -
- Preis:
- Versand:
- Lagernd: +
+ +
+ + + +
+
+ +
+
+ Versand: € + Lieferzeit: Werktage +
+
+ +
+
+ Preis:
+
+
-

Keine Shops bieten dieses Produkt an.

+
+

Keine Shops bieten dieses Produkt an.

+