diff --git a/.gitignore b/.gitignore index 280fb6b..005984e 100644 --- a/.gitignore +++ b/.gitignore @@ -1,7 +1,7 @@ /data/* /data/logs/* /data/tls/* -/data/django_static/* +/data/static/* /data/profilepictures/* /data/archive/* !/data/logs/ diff --git a/README.md b/README.md index 74a7248..f2a4bf6 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# Drinks Manager +# Drinks Manager (Season 3) Note: This software is tailored to my own needs. I probably won't accept feature requests, and don't recommend you diff --git a/app/locales/de/LC_MESSAGES/django.mo b/app/locales/de/LC_MESSAGES/django.mo index 5d60623..2e84d2f 100644 Binary files a/app/locales/de/LC_MESSAGES/django.mo and b/app/locales/de/LC_MESSAGES/django.mo differ diff --git a/app/locales/de/LC_MESSAGES/django.po b/app/locales/de/LC_MESSAGES/django.po index 278ff86..9900f3a 100644 --- a/app/locales/de/LC_MESSAGES/django.po +++ b/app/locales/de/LC_MESSAGES/django.po @@ -8,7 +8,7 @@ msgid "" msgstr "" "Project-Id-Version: PACKAGE VERSION\n" "Report-Msgid-Bugs-To: \n" -"POT-Creation-Date: 2023-11-01 19:29+0100\n" +"POT-Creation-Date: 2023-11-01 18:52+0100\n" "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n" "Last-Translator: Julian Müller (ChaoticByte)\n" "Language: DE\n" @@ -207,14 +207,6 @@ msgstr "Tag" msgid "order sum" msgstr "Bestellungen" -#: app/templates/statistics.html:72 app/templates/statistics.html:89 -msgid "user" -msgstr "Benutzer" - -#: app/templates/statistics.html:73 app/templates/statistics.html:90 -msgid "sum" -msgstr "Summe" - #: app/templates/statistics.html:86 msgid "deposit sum" msgstr "Einzahlungen" diff --git a/app/models.py b/app/models.py index 717a1cf..681a433 100644 --- a/app/models.py +++ b/app/models.py @@ -40,7 +40,6 @@ class Drink(models.Model): do_not_count = models.BooleanField(default=False) def delete(self, *args, **kwargs): - # we flag the field as deleted. self.deleted = True super().save() @@ -108,9 +107,10 @@ class Order(models.Model): price_sum = models.DecimalField(max_digits=6, decimal_places=2, default=0, editable=False) content_litres = models.DecimalField(max_digits=6, decimal_places=3, default=0, editable=False) + # TODO: Add more comments on how and why the save & delete functions are implemented + # address this in a refactoring issue. + def save(self, *args, **kwargs): - # saving this may affect other fields - # so we reimplement the save function drink = Drink.objects.get(pk=self.drink.pk) if self._state.adding and drink.available > 0: if not drink.do_not_count: @@ -126,7 +126,6 @@ class Order(models.Model): raise ValidationError("This entry can't be changed.") def delete(self, *args, **kwargs): - # when deleting, we affect other fields as well. self.user.balance += self.price_sum self.user.save() drink = Drink.objects.get(pk=self.drink.pk) diff --git a/static/css/main.css b/app/static/css/main.css similarity index 67% rename from static/css/main.css rename to app/static/css/main.css index ea44432..4ba0fc7 100644 --- a/static/css/main.css +++ b/app/static/css/main.css @@ -1,4 +1,4 @@ -/* Fonts */ +/* Font */ @font-face { font-family: "Inter"; @@ -18,39 +18,26 @@ :root { --font-family: "Inter"; --color: #fafafa; - --color-disabled: #ffffff50; - --color-error: #ff817c; - --bg-page: linear-gradient( - -10deg, - #071c29 10%, - #4a8897 - ); - --bg-color: #ffffff35; - --bg-color2: #ffffff25; - --bg-hover-color: #ffffff50; - --border-color: #ffffff50; + --color-error: #ff682c; + --bg-page-color: #222222; + --bg-color: #4e4e4e; + --bg-hover-color: #636363; + --bg-color2: #383838; + --bg-hover-color2: #4a4a4a; + --border-color: #808080; --bg-globalmessage: #161616; - --border-radius: .6rem; - --element-padding: .6rem .8rem; + --border-radius: .5rem; } /* General */ -body, -input, -select, -button, .button -{ - font-family: var(--font-family); -} - body { margin: 0; padding: 0; width: 100vw; min-height: 100vh; - font-size: 17px; - background: var(--bg-page); + font-family: var(--font-family); + background: var(--bg-page-color); color: var(--color); overflow-x: hidden; } @@ -60,7 +47,7 @@ a { } h1 { - font-size: 28px; + font-size: 1.8rem; } h1, h2, h3, h4 { @@ -78,36 +65,29 @@ input[type="number"]::-webkit-inner-spin-button { display: none; } -input[type="text"], -input[type="password"], -input[type="number"], -select { - padding: var(--element-padding); - text-align: center !important; - font-size: 16px; +input[type="text"], input[type="password"], input[type="number"], select { + padding: .6rem .8rem; + text-align: center; + font-size: 1rem; color: var(--color); border: none; outline: none; - border: 1px solid var(--border-color); + border-bottom: 1px solid var(--border-color); border-radius: var(--border-radius); background: var(--bg-color); -} - -input[type="text"]::placeholder, -input[type="password"]::placeholder, -input[type="number"]::placeholder, -select > option:disabled { - color: var(--color-disabled); + font-family: "Inter"; } select { appearance: none; -webkit-appearance: none; -moz-appearance: none; + height: 2.5rem; background-image: url("/static/material-icons/arrow-drop-down.svg"); background-repeat: no-repeat; background-position: right; background-size: 1.5rem; + padding-right: 1.8rem; } table { @@ -126,6 +106,12 @@ tr:nth-child(2n+2) > td { background: var(--bg-color2); } +/* +Rounded corners on table cells apparently don't work with +Firefox, so Firefox users won't have rounded corners +on tables. Can't fix that by myself. +*/ + table tr:first-child th:first-child { border-top-left-radius: var(--border-radius); } @@ -179,7 +165,11 @@ th { flex-direction: row; margin-top: 1rem; width: 94%; - gap: 2rem; + gap: 1rem; +} + +.userinfo { + font-size: 1.05rem; } .userinfo > span { @@ -234,7 +224,7 @@ main { } .footer > div { - font-size: 16px; + font-size: .95rem; margin-top: .15rem; margin-bottom: .15rem; } @@ -286,6 +276,15 @@ main { gap: 1rem; } +.fill { + height: 100%; + width: 100%; +} + +.fill-vertical { + height: 100%; +} + .buttons { display: flex; flex-direction: row; @@ -298,26 +297,24 @@ main { display: flex; align-items: center; justify-content: center; + font-family: var(--font-family); + text-decoration: none; + text-align: center !important; + background: var(--bg-color); + color: var(--color); + font-size: 1rem; + padding: .6rem .8rem; outline: none; - border: 1px solid var(--border-color); + border: none; + border-bottom: 1px solid var(--border-color); border-radius: var(--border-radius); + cursor: pointer; + user-select: none; + box-sizing: content-box; width: fit-content; } -.button, button, .dropdownchoice { - padding: var(--element-padding); - font-size: 16px; - text-align: center !important; - text-decoration: none; - color: var(--color); - box-sizing: content-box; - cursor: pointer; - user-select: none; - background: var(--bg-color); -} - -.button:hover, button:hover, -.button:active, button:active { +.button:hover, button:hover, .button:active, button:active { background: var(--bg-hover-color); } @@ -325,55 +322,30 @@ main { opacity: 40%; } -.formheading { - margin-bottom: 2rem; -} - -.forminfo { - width: fit-content; - min-width: 16rem; +.appform > .forminfo { + width: 100%; text-align: left; display: flex; flex-direction: row; justify-content: space-between; gap: 2rem; - padding-bottom: .15rem; - border-bottom: 1px solid #ffffff20; } .forminfo > span:last-child { float: right; } -.appform, .appform > * { - max-width: 90vw; -} - .appform > .forminput { width: 100%; flex-direction: row; - justify-content: space-between; + justify-content: space-evenly; align-items: center; flex-wrap: wrap; gap: 1rem; } -.forminput > input, .forminput > select { - width: 100% !important; -} - -.forminput > .keyboard-input, #transfer-recipient { - /* the keyboard has a 5px padding */ - margin-left: 5px !important; - margin-right: 5px !important; -} - -.appform > .buttons { - margin-top: 1rem; -} - -#statusinfo { - margin-top: 1rem; +.appform > .statusinfo { + margin-top: .5rem; } .dropdownmenu { @@ -384,16 +356,6 @@ main { border-radius: var(--border-radius); } -#dropdownnope { - position: fixed; - top: 0; - left: 0; - width: 100vw; - height: 100vh; - margin: 0; - padding: 0; -} - .dropdownbutton { z-index: 190; } @@ -404,69 +366,70 @@ main { } .dropdownlist { - margin-top: 3rem; position: absolute; display: flex; flex-direction: column; - border-radius: var(--border-radius); - box-shadow: 0 0 .5rem #00000025; -} - -.dropdownlist, #dropdownnope { - visibility: hidden; - opacity: 0%; pointer-events: none; -} - -.dropdownvisible .dropdownlist, -.dropdownvisible #dropdownnope { - opacity: 100%; - background: #00000020; - visibility: visible; - pointer-events: visible; - z-index: 100; + border-radius: var(--border-radius) !important; + z-index: 200; + margin-top: 3.2rem; + opacity: 0%; + transition: opacity 100ms; + box-shadow: 0 .25rem 1rem #00000090; } .dropdownchoice { - z-index: 200; + border-radius: 0 !important; margin: 0; - text-decoration: none; + text-align: center; + justify-content: center; + background: var(--bg-color2) !important; + backdrop-filter: none !important; width: initial; - min-width: max-content; - border-bottom: 1px solid var(--border-color); - border-left: 1px solid var(--border-color); - border-right: 1px solid var(--border-color); -} - -.dropdownchoice:first-child { - border-top: 1px solid var(--border-color); - border-top-left-radius: var(--border-radius); - border-top-right-radius: var(--border-radius); -} - -.dropdownchoice:last-child { - border-bottom: 1px solid var(--border-color); - border-bottom-left-radius: var(--border-radius); - border-bottom-right-radius: var(--border-radius); } .dropdownchoice:hover { - background: var(--bg-hover-color); + background: var(--bg-hover-color2) !important; +} + +.dropdownlist :first-child { + border-top-left-radius: var(--border-radius) !important; + border-top-right-radius: var(--border-radius) !important; +} + +.dropdownlist :last-child { + border-bottom-left-radius: var(--border-radius) !important; + border-bottom-right-radius: var(--border-radius) !important; +} + +.dropdownvisible .dropdownlist { + opacity: 100%; + visibility: visible; + pointer-events: visible; } .customnumberinput { - height: 2.2rem; - display: flex; - flex-direction: row; - align-items: center; - gap: .25rem; + height: 2.5rem; } .customnumberinput button { - width: 2.2rem !important; - height: 2.2rem !important; + min-width: 2.5rem !important; + width: 2.5rem !important; padding: 0; margin: 0; + height: 100%; +} + +.customnumberinput-minus { + border-bottom-right-radius: 0; + border-top-right-radius: 0; + z-index: 10; +} + +.customnumberinput-plus { + border-bottom-left-radius: 0; + border-top-left-radius: 0; + z-index: 10; } .customnumberinput input[type="number"] { @@ -475,13 +438,13 @@ main { padding: 0; margin: 0; background: var(--bg-color2); + border-radius: 0 !important; -webkit-appearance: textfield; -moz-appearance: textfield; appearance: textfield; } .errortext { - font-weight: bold; color: var(--color-error); } @@ -491,11 +454,6 @@ main { /* Login */ -.userlist-container { - flex-grow: 1; - padding-bottom: 10vh; -} - .userlist { width: 60%; list-style: none; @@ -505,7 +463,8 @@ main { } .userlist > li { - padding: .1rem .6rem; + margin-bottom: .5rem; + padding: 0 .5rem; } .userlist > li > img { @@ -518,7 +477,7 @@ main { .userlist > li > div { flex-grow: 1; text-align: center; - padding: .7rem 1.1rem; + padding: .8rem 1.1rem; } .loginform { @@ -530,18 +489,6 @@ main { margin-top: 0; } -#passwordoverlay-container { - position: fixed; - width: 100vw; - height: 100vh; - top: 0; - right: 0; - background: var(--bg-page); - align-items: center; - padding-top: 10vh; - z-index: 200; -} - /* Drinks List */ .drinks-list { @@ -558,7 +505,7 @@ main { .drinks-list > li > .button { width: 100%; justify-content: space-between; - padding: .7rem 1.1rem; + padding: .8rem 1.1rem; } /* Statistics */ @@ -578,19 +525,6 @@ main { width: 16rem; } -/* Blur */ - -@supports (backdrop-filter: blur()) { - .dropdownvisible #dropdownnope { - backdrop-filter: blur(16px); - } - #passwordoverlay-container { - background: #00000020; - backdrop-filter: blur(64px); /* fallback */ - backdrop-filter: blur(128px); - } -} - /* Responsive */ @media only screen and (max-width: 1200px) { @@ -611,10 +545,9 @@ main { } } -@media only screen and (max-width: 860px) { +@media only screen and (max-width: 700px) { .userpanel { flex-direction: column; - gap: 1rem; } .userlist { gap: 0.25rem; @@ -633,10 +566,7 @@ main { } .dropdownlist { width: 14rem; - right: calc(50vw - 7rem); /* regard width */ + right: calc(50vw - 7rem); left: auto; } - #keyboard { - display: none !important; - } } diff --git a/static/css/simple-keyboard.css b/app/static/css/simple-keyboard.css similarity index 100% rename from static/css/simple-keyboard.css rename to app/static/css/simple-keyboard.css diff --git a/static/css/simple-keyboard_custom.css b/app/static/css/simple-keyboard_dark.css similarity index 83% rename from static/css/simple-keyboard_custom.css rename to app/static/css/simple-keyboard_dark.css index 39da287..e380b77 100644 --- a/static/css/simple-keyboard_custom.css +++ b/app/static/css/simple-keyboard_dark.css @@ -6,7 +6,6 @@ max-width: 100%; background: transparent; font-family: "Inter"; - font-size: 16px; } .simple-keyboard.darkTheme .hg-button { height: 50px; @@ -15,8 +14,8 @@ align-items: center; background: var(--bg-color); color: white; - border: 1px solid var(--border-color); - border-radius: var(--border-radius); + border: none; + border-bottom: 1px solid var(--border-color); } .simple-keyboard.darkTheme .hg-button:active, .simple-keyboard.darkTheme .hg-button:hover { diff --git a/static/favicon.ico b/app/static/favicon.ico similarity index 100% rename from static/favicon.ico rename to app/static/favicon.ico diff --git a/static/favicon.png b/app/static/favicon.png similarity index 100% rename from static/favicon.png rename to app/static/favicon.png diff --git a/static/fonts/Inter-Bold.ttf b/app/static/fonts/Inter-Bold.ttf similarity index 100% rename from static/fonts/Inter-Bold.ttf rename to app/static/fonts/Inter-Bold.ttf diff --git a/static/fonts/Inter-Regular.ttf b/app/static/fonts/Inter-Regular.ttf similarity index 100% rename from static/fonts/Inter-Regular.ttf rename to app/static/fonts/Inter-Regular.ttf diff --git a/static/js/autoreload.js b/app/static/js/autoreload.js similarity index 100% rename from static/js/autoreload.js rename to app/static/js/autoreload.js diff --git a/static/js/custom_form.js b/app/static/js/custom_form.js similarity index 100% rename from static/js/custom_form.js rename to app/static/js/custom_form.js diff --git a/static/js/custom_number_input.js b/app/static/js/custom_number_input.js similarity index 100% rename from static/js/custom_number_input.js rename to app/static/js/custom_number_input.js diff --git a/static/js/logged_out.js b/app/static/js/logged_out.js similarity index 100% rename from static/js/logged_out.js rename to app/static/js/logged_out.js diff --git a/static/js/login.js b/app/static/js/login.js similarity index 98% rename from static/js/login.js rename to app/static/js/login.js index 6f62216..cc9274d 100644 --- a/static/js/login.js +++ b/app/static/js/login.js @@ -35,7 +35,6 @@ function show_password_overlay() { window.scrollTo(0, 0); passwordOverlayElement.classList.remove("nodisplay"); - passwordInputElement.focus() } function hide_password_overlay() { passwordOverlayElement.classList.add("nodisplay"); diff --git a/app/static/js/main.js b/app/static/js/main.js new file mode 100644 index 0000000..711aed8 --- /dev/null +++ b/app/static/js/main.js @@ -0,0 +1,14 @@ +document.addEventListener("DOMContentLoaded", () => { + let dropdownmenuElement = document.getElementById("dropdownmenu"); + let dropdownmenuButtonElement = document.getElementById("dropdownmenu-button"); + if (dropdownmenuButtonElement != null) { + dropdownmenuButtonElement.addEventListener("click", () => { + if (dropdownmenuElement.classList.contains("dropdownvisible")) { + dropdownmenuElement.classList.remove("dropdownvisible"); + } + else { + dropdownmenuElement.classList.add("dropdownvisible"); + } + }) + } +}); diff --git a/static/js/order.js b/app/static/js/order.js similarity index 100% rename from static/js/order.js rename to app/static/js/order.js diff --git a/static/js/simple-keyboard.js b/app/static/js/simple-keyboard.js similarity index 100% rename from static/js/simple-keyboard.js rename to app/static/js/simple-keyboard.js diff --git a/static/js/simple-keyboard_configure.js b/app/static/js/simple-keyboard_configure.js similarity index 100% rename from static/js/simple-keyboard_configure.js rename to app/static/js/simple-keyboard_configure.js diff --git a/static/material-icons/arrow-drop-down.svg b/app/static/material-icons/arrow-drop-down.svg similarity index 100% rename from static/material-icons/arrow-drop-down.svg rename to app/static/material-icons/arrow-drop-down.svg diff --git a/static/material-icons/menu.svg b/app/static/material-icons/menu.svg similarity index 100% rename from static/material-icons/menu.svg rename to app/static/material-icons/menu.svg diff --git a/app/templates/baselayout.html b/app/templates/baselayout.html index 97ac907..5783cf9 100644 --- a/app/templates/baselayout.html +++ b/app/templates/baselayout.html @@ -25,7 +25,7 @@
{% endif %} diff --git a/app/templates/deposit.html b/app/templates/deposit.html index cf3dbc1..bbce3e1 100644 --- a/app/templates/deposit.html +++ b/app/templates/deposit.html @@ -8,16 +8,20 @@ {% block headAdditional %} - + {% endblock %} {% block content %} -{% translate "Your balance is too low to order a drink." %}
- {% translate "back" %} + {% translate "back" %}