diff --git a/shopping_app/static/css/style.css b/shopping_app/static/css/style.css
index 6b6f747..67d7787 100644
--- a/shopping_app/static/css/style.css
+++ b/shopping_app/static/css/style.css
@@ -1149,16 +1149,36 @@ td select.tom-dark {
html, body {
min-height: 100%;
- background:
+ background-color: var(--app-bg);
+ background-image:
radial-gradient(circle at top left, rgba(39, 208, 125, 0.18), transparent 24%),
radial-gradient(circle at top right, rgba(74, 144, 226, 0.16), transparent 22%),
linear-gradient(180deg, #09111d 0%, #08121f 38%, #060d18 100%);
+ background-repeat: no-repeat;
color: var(--app-text);
}
+html {
+ color-scheme: dark;
+}
+
body.app-body {
position: relative;
+ min-height: 100vh;
+ min-height: 100dvh;
+ min-height: 100svh;
+ display: flex;
+ flex-direction: column;
+ margin: 0;
font-feature-settings: "ss01" on, "cv02" on;
+ overflow-x: hidden;
+}
+
+
+@supports (padding: env(safe-area-inset-top)) {
+ html, body {
+ min-height: calc(100% + env(safe-area-inset-top, 0px) + env(safe-area-inset-bottom, 0px));
+ }
}
.app-backdrop {
@@ -1170,7 +1190,7 @@ body.app-body {
.app-header {
z-index: 1035;
- padding: 0.75rem 0 0;
+ padding: calc(0.75rem + env(safe-area-inset-top, 0px)) 0 0;
backdrop-filter: blur(12px);
}
@@ -1234,6 +1254,7 @@ body.app-body {
}
.app-main {
+ flex: 1 0 auto;
padding: 1rem 0 2.5rem;
}
@@ -1242,7 +1263,8 @@ body.app-body {
}
.app-footer {
- padding: 1rem 0 2rem;
+ margin-top: auto;
+ padding: 1rem 0 calc(1.35rem + env(safe-area-inset-bottom, 0px));
}
.app-footer__inner {
@@ -1659,7 +1681,8 @@ body.app-body {
}
.app-footer {
- padding: 0.5rem 0 1rem;
+ margin-top: auto;
+ padding: 0.5rem 0 calc(0.85rem + env(safe-area-inset-bottom, 0px));
}
.app-footer__inner {
@@ -1916,7 +1939,7 @@ input[type="checkbox"].form-check-input {
}
.app-footer {
- padding-bottom: 0.8rem;
+ padding-bottom: calc(0.8rem + env(safe-area-inset-bottom, 0px));
}
}
diff --git a/shopping_app/templates/base.html b/shopping_app/templates/base.html
index f721010..9585856 100644
--- a/shopping_app/templates/base.html
+++ b/shopping_app/templates/base.html
@@ -2,7 +2,10 @@
-
+
+
+
+
{% block title %}Live Lista Zakupów{% endblock %}