From 4b1efa3a304b4660a2e882d6006ecd9aca04f999 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bianca=20F=C3=BCrstenau?= Date: Sat, 15 Feb 2025 12:36:39 +0100 Subject: [PATCH] More UI --- src/assets/angel.svg | 160 ++++++++++++++++++++++++++++ src/assets/cafe.svg | 196 ++++++++++++++++++++++++++++++++++ src/assets/cash.svg | 108 +++++++++++++++++++ src/index.html | 245 ++++++++++++++++++++++++++++++------------- src/main.js | 4 + src/styles.css | 69 ++++++------ 6 files changed, 676 insertions(+), 106 deletions(-) create mode 100644 src/assets/angel.svg create mode 100644 src/assets/cafe.svg create mode 100644 src/assets/cash.svg diff --git a/src/assets/angel.svg b/src/assets/angel.svg new file mode 100644 index 0000000..c504c9d --- /dev/null +++ b/src/assets/angel.svg @@ -0,0 +1,160 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/cafe.svg b/src/assets/cafe.svg new file mode 100644 index 0000000..6c55701 --- /dev/null +++ b/src/assets/cafe.svg @@ -0,0 +1,196 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/cash.svg b/src/assets/cash.svg new file mode 100644 index 0000000..27b9647 --- /dev/null +++ b/src/assets/cash.svg @@ -0,0 +1,108 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/index.html b/src/index.html index 55e6d2f..a617e74 100644 --- a/src/index.html +++ b/src/index.html @@ -1,97 +1,196 @@ - + - Tauri App + Darmstadt sagt Nein zur Bezahlkartei! -
-
-
+
+
+

+ Sumpf +

+
+ + + +
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+
+
+
+ + +
+ + +
+
+ + +
+ + +
+ + +
+ + +
+ + +
+ + +
+
+
+ + +
+
+
+
+ +
+
+
+
+
+
+
+ -
-
- -
-
- -
-
-

-
-
- -
-
- -
-
-
-

diff --git a/src/main.js b/src/main.js index 6f69bc4..365d449 100644 --- a/src/main.js +++ b/src/main.js @@ -1,5 +1,9 @@ const { invoke } = window.__TAURI__.core; +let cafe; +let cafeVoucher; +let cafeInventory; + let cntMsgEl; let pullMsgEl; diff --git a/src/styles.css b/src/styles.css index 5f44d56..de40503 100644 --- a/src/styles.css +++ b/src/styles.css @@ -5,9 +5,8 @@ :root { font-family: Noto Sans, sans-serif; - font-size: 16px; - line-height: 24px; - font-weight: 400; + font-size: 20px; + line-height: 30px; color: #0f0f0f; background-color: #f6f6f6; @@ -17,26 +16,44 @@ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-text-size-adjust: 100%; + + --b: #98d0c3; + --v: #5c2483; + --y: #f9b000; } .h-container { margin: auto; display: flex; - flex-direction: row; - flex-wrap: wrap; + flex-flow: row wrap; justify-content: space-around; - text-align: center; gap: 3mm; } .v-container { margin: auto; display: flex; - flex-direction: column; - flex-wrap: wrap; - justify-content: space-around; - text-align: center; - gap: 3mm; + flex-flow: column wrap; + justify-content: space-between; + flex: 1; + min-height: fill; +} + +label .logo { + height: 30px; +} + +body { + min-height: 98vh; + display: flex; + flex-flow: column nowrap; + justify-content: space-between; +} + +.nav { + flex: 0; + margin: 3mm; + padding: 3mm; } .logo { @@ -46,7 +63,7 @@ transition: 0.75s; max-height: 100%; max-width: 100%; - width: 100%; + height: 100%; } .column { @@ -56,20 +73,15 @@ margin: auto; } -a { - font-weight: 500; - color: #646cff; - text-decoration: inherit; -} - -a:hover { - color: #535bf2; -} - h1 { text-align: center; } +.shout { + font-size: 1.2cm; + font-family: hessenSagtNein; +} + button { margin: auto; flex: 1; @@ -85,15 +97,11 @@ button { background-color: #ffffff; transition: border-color 0.25s; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2); -} - -button { cursor: pointer; } -.shout { - font-size: 1.2cm; - font-family: hessenSagtNein; +input[type=number] { + border: 1px solid #eee; } button:hover { @@ -104,11 +112,6 @@ button:active { background-color: #e8e8e8; } -input, -button { - outline: none; -} - @media (prefers-color-scheme: dark) { :root { color: #f6f6f6;