diff --git a/static/css/style.css b/static/css/style.css index 1ecf020..8eda330 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -22,6 +22,14 @@ html { padding: 2%; font-size: 160%; font-family: 'Courier New', Courier, monospace; + overflow-y: hidden; +} + +body { + display: flex; + height: 103vh; + flex-direction: column; + gap: 1rem; } nav { @@ -44,7 +52,7 @@ form { } #logo { - width: 12%; + width: 8rem; height: auto; } @@ -104,14 +112,13 @@ a:active { .categories { background-color: var(--bg); - padding-top: 3rem; display: flex; justify-content: center; } .category { margin: .5rem 0rem; - padding: 0rem 1rem; + padding: 0rem 1rem; border-left: .125rem solid var(--fg); } @@ -121,38 +128,35 @@ a:active { .container { display: flex; - justify-content: center; + justify-content: flex-start; align-items: center; width: 100%; flex-direction: column; -} - -fieldset { - font-size: 1rem; - border-radius: 1rem; - font-family: consolas; -} - -input, label, button { - font-size: inherit; - padding: .125rem .5rem; - /* the following ensures they're all using the same box-model for rendering */ - -moz-box-sizing: content-box; /* or `border-box` */ - -webkit-box-sizing: content-box; - box-sizing: content-box; + flex-grow: 1; + height: 90%; } .textbox { - font-size: inherit; + padding: .25rem; + margin-top: .25rem; + font-size: 1rem; + width: 15rem; + border: none; background-color: var(--fg); } -.button { +.search-button { + padding: .25rem .5rem; + margin-top: .25rem; + margin-right: .5rem; + background: #ddd; + font-size: 1rem; + border: none; background-color: orange; } .filter-pane { - width: 100%; + width: 70%; margin: .5rem 0rem; background-color: var(--bg-grad-3); border-radius: 1rem; @@ -160,16 +164,17 @@ input, label, button { } .product-container { - width: 90%; + width: 95%; margin: .5rem 0rem; background-color: var(--bg-grad-3); border-radius: 1rem; display: flex; flex-wrap: wrap; flex-direction: row; - gap: 3rem 1.5rem; - padding: 2rem 1rem 2rem 1rem; + gap: 2rem 1.5rem; + padding: 2rem 1rem; transition: all 0.2s; + overflow-y: scroll; } .product { diff --git a/static/index.html b/static/index.html index cd5f930..ada7c4a 100644 --- a/static/index.html +++ b/static/index.html @@ -13,32 +13,31 @@
- +
Login/Signup
-
- - -
-
-
-
-
-
-
-
+ + +
+
+
+
+
+
+
+
+
12" Brake Disks
@@ -70,6 +69,134 @@
+
+
12" Brake Disks
+
+
+ Brake Disks +
+
+
£64.50
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
+
+
+
+
+ +
+
12" Brake Disks
+
+
+ Brake Disks +
+
+
£64.50
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
+
+
+
+
+ +
+
12" Brake Disks
+
+
+ Brake Disks +
+
+
£64.50
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
+
+
+
+
+ +
+
12" Brake Disks
+
+
+ Brake Disks +
+
+
£64.50
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
+
+
+
+
+ +
+
12" Brake Disks
+
+
+ Brake Disks +
+
+
£64.50
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
+
+
+
+
+ + +
+
12" Brake Disks
+
+
+ Brake Disks +
+
+
£64.50
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
+
+
+
+
+ + +
+
12" Brake Disks
+
+
+ Brake Disks +
+
+
£64.50
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
+
+
+
+
+ +
+
12" Brake Disks
+
+
+ Brake Disks +
+
+
£64.50
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
+
+
+
+
+ +
+
12" Brake Disks
+
+
+ Brake Disks +
+
+
£64.50
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
+
+
+
+
+
12" Brake Disks
@@ -86,7 +213,7 @@
-
+ \ No newline at end of file