From d896a377795a90dd1ad5df26fb657ea9b271e2ab Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Luk=C3=A1=C5=A1=20Kucharczyk?= Date: Tue, 3 Jan 2023 19:01:10 +0100 Subject: [PATCH] Fix dark mode issues --- src/input.css | 14 +++++++++- src/web/tracker/static/base.css | 43 +++++++++++++++++++++++++++-- src/web/tracker/templates/base.html | 4 ++- 3 files changed, 57 insertions(+), 4 deletions(-) diff --git a/src/input.css b/src/input.css index bd6213e..c5dd3d1 100644 --- a/src/input.css +++ b/src/input.css @@ -1,3 +1,15 @@ @tailwind base; @tailwind components; -@tailwind utilities; \ No newline at end of file +@tailwind utilities; + +form label { + @apply dark:text-slate-400; +} + +form input,select,textarea { + @apply dark:bg-slate-500 dark:border dark:border-slate-900 dark:text-slate-100; +} + +form input[type=submit] { + @apply p-2 bg-purple-900; +} \ No newline at end of file diff --git a/src/web/tracker/static/base.css b/src/web/tracker/static/base.css index 5a48041..d5c4eb8 100644 --- a/src/web/tracker/static/base.css +++ b/src/web/tracker/static/base.css @@ -742,6 +742,10 @@ select { display: grid; } +.h-screen { + height: 100vh; +} + .w-full { width: 100%; } @@ -825,6 +829,10 @@ select { padding-right: 1rem; } +.text-center { + text-align: center; +} + .text-4xl { font-size: 2.25rem; line-height: 2.5rem; @@ -855,6 +863,27 @@ select { box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } +.dark form label { + --tw-text-opacity: 1; + color: rgb(148 163 184 / var(--tw-text-opacity)); +} + +.dark form input,.dark select,.dark textarea { + border-width: 1px; + --tw-border-opacity: 1; + border-color: rgb(15 23 42 / var(--tw-border-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(100 116 139 / var(--tw-bg-opacity)); + --tw-text-opacity: 1; + color: rgb(241 245 249 / var(--tw-text-opacity)); +} + +form input[type=submit] { + --tw-bg-opacity: 1; + background-color: rgb(88 28 135 / var(--tw-bg-opacity)); + padding: 0.5rem; +} + .hover\:underline:hover { text-decoration-line: underline; } @@ -864,6 +893,11 @@ select { border-color: rgb(255 255 255 / var(--tw-border-opacity)); } +.dark .dark\:bg-gray-800 { + --tw-bg-opacity: 1; + background-color: rgb(31 41 55 / var(--tw-bg-opacity)); +} + .dark .dark\:bg-gray-900 { --tw-bg-opacity: 1; background-color: rgb(17 24 39 / var(--tw-bg-opacity)); @@ -874,9 +908,9 @@ select { background-color: rgb(51 65 85 / var(--tw-bg-opacity)); } -.dark .dark\:text-slate-300 { +.dark .dark\:text-white { --tw-text-opacity: 1; - color: rgb(203 213 225 / var(--tw-text-opacity)); + color: rgb(255 255 255 / var(--tw-text-opacity)); } .dark .dark\:text-slate-400 { @@ -884,6 +918,11 @@ select { color: rgb(148 163 184 / var(--tw-text-opacity)); } +.dark .dark\:text-slate-300 { + --tw-text-opacity: 1; + color: rgb(203 213 225 / var(--tw-text-opacity)); +} + @media (min-width: 768px) { .md\:block { display: block; diff --git a/src/web/tracker/templates/base.html b/src/web/tracker/templates/base.html index c466683..c591f5e 100644 --- a/src/web/tracker/templates/base.html +++ b/src/web/tracker/templates/base.html @@ -12,6 +12,7 @@ +
{% block content %}No content here.{% endblock %} +
\ No newline at end of file