aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorlonkaars <loek@pipeframe.xyz>2023-04-25 15:08:02 +0200
committerlonkaars <loek@pipeframe.xyz>2023-04-25 15:08:02 +0200
commit8fc79074f2a40e5c1917be90b234df9de8831ca9 (patch)
tree712b3dc6e6d14b7e908338593b18605e3d14bca6
parent7eecf6d9577eb81498fcf35bdd7ae375b227b69c (diff)
fix products style
-rw-r--r--public/global.css4
-rw-r--r--public/nav.css6
-rw-r--r--public/navbar.php8
-rw-r--r--public/products.css10
-rw-r--r--public/products.php8
5 files changed, 23 insertions, 13 deletions
diff --git a/public/global.css b/public/global.css
index 9120a5f..82dc446 100644
--- a/public/global.css
+++ b/public/global.css
@@ -16,3 +16,7 @@ body, html {
padding: 0 12px;
}
+.nolinkstyle {
+ text-decoration: none !important;
+ color: currentColor;
+}
diff --git a/public/nav.css b/public/nav.css
index f5f540c..b1f5666 100644
--- a/public/nav.css
+++ b/public/nav.css
@@ -4,11 +4,7 @@ nav {
}
nav span { vertical-align: middle; }
-nav a {
- text-decoration: none;
- color: currentColor;
- margin-right: 16px;
-}
+nav a { margin-right: 16px; }
nav .site-icon {
height: 48px;
diff --git a/public/navbar.php b/public/navbar.php
index 34d88bb..f22a040 100644
--- a/public/navbar.php
+++ b/public/navbar.php
@@ -1,11 +1,11 @@
<nav>
<div class="limwidth">
- <a href="/" class="site-icon">
+ <a href="/" class="site-icon nolinkstyle">
<span class="icon mdi cart-outline"></span>
<span class="label">winkel</span>
</a>
- <a href="/products.php"><span>producten</span></a>
- <a href="/login.php"><span>login</span></a>
- <a href="/cart.php"><span>mand (</span><span id="cartn">0</span><span>)</span></a>
+ <a href="/products.php" class="nolinkstyle"><span>producten</span></a>
+ <a href="/login.php" class="nolinkstyle"><span>login</span></a>
+ <a href="/cart.php" class="nolinkstyle"><span>mand (</span><span id="cartn">0</span><span>)</span></a>
</div>
</nav>
diff --git a/public/products.css b/public/products.css
index a698a15..dae3805 100644
--- a/public/products.css
+++ b/public/products.css
@@ -3,6 +3,7 @@
display: grid;
grid-template-columns: repeat(var(--grid-columns), 1fr);
gap: 8px;
+ align-items: start;
}
@media (max-width: 600px) { .products { --grid-columns: 2; } }
@media (max-width: 400px) { .products { --grid-columns: 1; } }
@@ -18,3 +19,12 @@
height: 100%;
object-fit: cover;
}
+
+.product span {
+ display: block;
+ color: CanvasText;
+ text-decoration: none;
+}
+
+.product .price::before { content: "\20ac "; }
+.product .price { font-size: 1.5rem; }
diff --git a/public/products.php b/public/products.php
index b42e4db..077702a 100644
--- a/public/products.php
+++ b/public/products.php
@@ -10,22 +10,22 @@
<div class="main limwidth">
<h2>lijst met producten:</h2>
<div class="products">
- <a href="/product.php?id=123" class="product">
+ <a href="/product.php?id=123" class="product nolinkstyle">
<img src="img/placeholder.png" alt="">
<span class="price">3,45</span>
<span class="name">courgette</span>
</a>
- <a href="/product.php?id=123" class="product">
+ <a href="/product.php?id=123" class="product nolinkstyle">
<img src="img/placeholder.png" alt="">
<span class="price">3,45</span>
<span class="name">courgette</span>
</a>
- <a href="/product.php?id=123" class="product">
+ <a href="/product.php?id=123" class="product nolinkstyle">
<img src="img/placeholder.png" alt="">
<span class="price">3,45</span>
<span class="name">courgette</span>
</a>
- <a href="/product.php?id=123" class="product">
+ <a href="/product.php?id=123" class="product nolinkstyle">
<img src="img/placeholder.png" alt="">
<span class="price">3,45</span>
<span class="name">courgette</span>