diff --git a/src/static/base.css b/src/static/base.css
new file mode 100644
index 0000000..20cac9e
--- /dev/null
+++ b/src/static/base.css
@@ -0,0 +1,3 @@
+:root {
+ --board-color: #61518f;
+}
diff --git a/src/static/js/products.js b/src/static/js/products.js
index 2b2fdb2..636469c 100644
--- a/src/static/js/products.js
+++ b/src/static/js/products.js
@@ -37,22 +37,25 @@ ipcRenderer.on('getProducts', (event, arg) => {
// Create category HTML
let category = categories[i];
let parser = new DOMParser();
+ // A body gets inserted which does something weird with the buttons
document.getElementById("categoryList").firstElementChild.append(parser.parseFromString(
- `${category.name}`
- , 'text/html').body);
+ `${category.name}`
+ , 'text/html').body.firstChild);
document.getElementById("productList").append(parser.parseFromString(
`
-
-
-
+
+
+
+
+
`
- , 'text/html').body);
-
- let products = categories[i].products.sort((a, b) => (a.name > b.name) ? 1 : -1)
+ , 'text/html').body.firstChild);
+
+ let products = category.products.sort((a, b) => (a.name > b.name) ? 1 : -1)
for (let j = 0; j < products.length; j++) {
- renderProduct(products[j], categories[i]);
+ renderProduct(products[j], category);
}
}
}
diff --git a/src/views/base/base.css b/src/views/base/base.css
index 3c4e350..8294087 100644
--- a/src/views/base/base.css
+++ b/src/views/base/base.css
@@ -8,7 +8,7 @@ body {
.menu {
height: 100px;
margin-bottom: 0 !important;
- background-color: #61518f !important;
+ background-color: var(--board-color) !important;
}
.menu > span {
@@ -38,7 +38,6 @@ body {
}
/* Default components */
-
main {
height: calc(100% - 100px);
position: relative;
diff --git a/src/views/base/base.html b/src/views/base/base.html
index 631951f..d00df14 100644
--- a/src/views/base/base.html
+++ b/src/views/base/base.html
@@ -10,6 +10,7 @@
+
diff --git a/src/views/idle/idle.css b/src/views/idle/idle.css
index f24ebc2..5e28687 100644
--- a/src/views/idle/idle.css
+++ b/src/views/idle/idle.css
@@ -1,10 +1,11 @@
body {
- background-color: #61518f;
+ background-color: var(--board-color);
}
#logo {
display: block;
}
+
#description{
text-align: center;
color: #ffffff;
diff --git a/src/views/idle/idle.html b/src/views/idle/idle.html
index 8644abd..15fabdb 100644
--- a/src/views/idle/idle.html
+++ b/src/views/idle/idle.html
@@ -10,6 +10,7 @@
+
diff --git a/src/views/products/products.css b/src/views/products/products.css
index 20fb795..36f629b 100644
--- a/src/views/products/products.css
+++ b/src/views/products/products.css
@@ -4,10 +4,17 @@
padding: 20px;
z-index: 1;
background-color: #f8f8f4;
+ text-align: center;
+}
+
+#categoryList > section {
+ width: 100%;
}
.category_button {
font-size: 20px !important;
+ color: var(--board-color) !important;
+ box-shadow: 0 0 0 1px var(--board-color) inset !important;
}
#productList {
@@ -28,6 +35,7 @@
#purchase {
width: 100%;
+ background-color: var(--board-color);
}
#cartTitle {
diff --git a/src/views/register/register.css b/src/views/register/register.css
index aa2310f..7a901ea 100644
--- a/src/views/register/register.css
+++ b/src/views/register/register.css
@@ -1,5 +1,5 @@
body {
- background-color: #61518f;
+ background-color: var(--board-color);
}
#title {
position: relative;