From 775900e27fcd2641e9ea59be600e5a1c6b50e107 Mon Sep 17 00:00:00 2001
From: fr34k <fr34k@zom.bi>
Date: Sun, 1 Nov 2020 00:13:03 +0100
Subject: [PATCH] width adaption, jewellery site construction

---
 header.tpl    |  2 +-
 jewellery.php | 53 +++++++++++++++++++++------------------------------
 tmp           | 23 ++++++++++++++++++++++
 3 files changed, 46 insertions(+), 32 deletions(-)
 create mode 100644 tmp

diff --git a/header.tpl b/header.tpl
index 6b91bec..1731613 100644
--- a/header.tpl
+++ b/header.tpl
@@ -25,7 +25,7 @@
     </header>
     <?php
     if ($show_sep == true) {
-        print('<img style="filter: brightness(110%) contrast(80%); position:relative; top: 90px; width: 100%; height: auto" src="/images/background_img/dev_con.jpg"/>');
+        print('<img style="filter: brightness(110%) contrast(80%); position:relative; width: 100%; height: auto" src="/images/background_img/dev_con.jpg"/>');
     }
     ?>
     
\ No newline at end of file
diff --git a/jewellery.php b/jewellery.php
index 42baadc..e2963d1 100644
--- a/jewellery.php
+++ b/jewellery.php
@@ -7,43 +7,34 @@ include('header.tpl');
 <div class="jew_container">
     <div class="flexbox-jew-btn">
         <div class="jew-btn-container">
-           Button1
+           <a href="#">Rings</a>
         </div>
         <div class="jew-btn-container">
-            Button2
+            <a href="#">Cufflinks</a>
         </div>
           <div class="jew-btn-container">
-            Button3
+            <a href="#">Amulets</a>
+        </div>
+        <div class="jew-btn-container">
+            <a href="#">Necklace</a>
+        </div>
+        <div class="jew-btn-container">
+            <a href="#">Pins</a>
+        </div>
+        <div class="jew-btn-container">
+            <a href="#">Earrings</a>
+        </div>
+        <div class="jew-btn-container">
+            <a href="#">Objects</a>
+        </div>
+        <div class="jew-btn-container">
+            <a href="#">Oak</a>
+        </div>
+        <div class="jew-btn-container">
+            <a href="#">Other</a>
         </div>
     </div>
 </div>
+</div>
 
-<div class="jew_container">
-    <div class="flexbox-jew-btn">
-        <div class="jew-btn-container">
-            Button4
-        </div>
-        <div class="jew-btn-container">
-            Button5
-        </div>
-        <div class="jew-btn-container">
-            Button6
-        </div>
-    </div>
-</div>
-
-<div class="jew_container">
-    <div class="flexbox-jew-btn">
-        <div class="jew-btn-container">
-            Button7
-        </div>
-        <div class="jew-btn-container">
-            Button8
-        </div>
-        <div class="jew-btn-container">
-            Button9
-        </div>
-    </div>
-</div>
-</div>
 <?php include('footer.tpl'); ?>
diff --git a/tmp b/tmp
new file mode 100644
index 0000000..9c7e356
--- /dev/null
+++ b/tmp
@@ -0,0 +1,23 @@
+@media only screen and (min-width: 1000px) {
+    header {
+       z-index: 1;
+	   position: absolute;
+	   top: 0px;
+	   width: 100%;
+    }
+}
+
+@media only screen and (max-width: 500px) {
+    .nav li {
+        margin-left: 2px !important;
+        margin-right: 2px !important;
+        width: 20vw;
+    }
+}
+@media only screen and (min-width: 501px) and (max-width: 999px) {
+    .nav li {
+        margin-left: 2px !important;
+        margin-right: 2px !important;
+        width: 100px;
+    }
+}