Added new colours

TreyWW · Dec 3, 2023 · 929ec13 · 929ec13
1 parent c1e2b19
commit 929ec13
Show file tree

Hide file tree

Showing 4 changed files with 149 additions and 95 deletions.
diff --git a/frontend/static/src/output.css b/frontend/static/src/output.css
@@ -497,17 +497,16 @@ html {
 }
 
 :root {
-  color-scheme: light;
+    color-scheme: dark;
   --in: 0.7206 0.191 231.6;
   --su: 64.8% 0.150 160;
   --wa: 0.8471 0.199 83.87;
-  --er: 0.7176 0.221 22.18;
-  --pc: 0.89824 0.06192 275.75;
-  --ac: 0.15352 0.0368 183.61;
+    --pc: 0.906397 0.036353 309.06903;
+    --ac: 0.91221 0.03797 276.024691;
   --inc: 0 0 0;
   --suc: 0 0 0;
   --wac: 0 0 0;
-  --erc: 0 0 0;
+    --erc: 0.15041 0.019918 11.781878;
   --rounded-box: 1rem;
   --rounded-btn: 0.5rem;
   --rounded-badge: 1.9rem;
@@ -517,32 +516,31 @@ html {
   --border-btn: 1px;
   --tab-border: 1px;
   --tab-radius: 0.5rem;
-  --p: 0.4912 0.3096 275.75;
-  --s: 0.6971 0.329 342.55;
-  --sc: 0.9871 0.0106 342.55;
-  --a: 0.7676 0.184 183.61;
+    --p: 0.531983 0.181767 309.06903;
+    --s: 0.611735 0.178257 276.191325;
+    --sc: 0.823442 0 0;
+    --er: 0.75205 0.099591 11.781878;
+    --a: 0.56105 0.189852 276.024691;
   --n: 0.321785 0.02476 255.701624;
   --nc: 0.894994 0.011585 252.096176;
   --b1: 1 0 0;
   --b2: 0.961151 0 0;
   --b3: 0.924169 0.00108 197.137559;
   --bc: 0.278078 0.029596 256.847952;
+    placeholder-color: #0051ff;
 }
 
 @media (prefers-color-scheme: dark) {
   :root {
     color-scheme: dark;
     --in: 0.7206 0.191 231.6;
-    --su: 64.8% 0.150 160;
     --wa: 0.8471 0.199 83.87;
-    --er: 0.7176 0.221 22.18;
-    --pc: 0.13138 0.0392 275.75;
-    --sc: 0.1496 0.052 342.55;
-    --ac: 0.14902 0.0334 183.61;
+      --pc: 0.128144 0.031342 294.012462;
+      --sc: 0.141495 0.022698 280.825753;
+      --ac: 0.91221 0.03797 276.024691;
     --inc: 0 0 0;
-    --suc: 0 0 0;
     --wac: 0 0 0;
-    --erc: 0 0 0;
+      --erc: 0.15041 0.019918 11.781878;
     --rounded-box: 1rem;
     --rounded-btn: 0.5rem;
     --rounded-badge: 1.9rem;
@@ -552,30 +550,33 @@ html {
     --border-btn: 1px;
     --tab-border: 1px;
     --tab-radius: 0.5rem;
-    --p: 0.6569 0.196 275.75;
-    --s: 0.748 0.26 342.55;
-    --a: 0.7451 0.167 183.61;
+      --p: 0.640721 0.156708 294.012462;
+      --s: 0.707476 0.113489 280.825753;
+      --er: 0.75205 0.099591 11.781878;
+      --su: 0.855214 0.121904 149.444756;
+      --suc: 0.313815 0.021108 254.139175;
+      --a: 0.56105 0.189852 276.024691;
     --n: 0.313815 0.021108 254.139175;
     --nc: 0.746477 0.0216 264.435964;
-    --b1: 0.253267 0.015896 252.417568;
-    --b2: 0.232607 0.013807 253.100675;
-    --b3: 0.211484 0.01165 254.087939;
-    --bc: 0.746477 0.0216 264.435964;
+      --b1: 0.320396 0.020258 248.459491;
+      --b2: 0.253267 0.015896 252.417568;
+      --b3: 0.230285 0.016667 264.170493;
+      --bc: 0.804658 0 0;
+      placeholder-color: #0051ff;
   }
 }
 
 [data-theme=light] {
-  color-scheme: light;
+    color-scheme: dark;
   --in: 0.7206 0.191 231.6;
   --su: 64.8% 0.150 160;
   --wa: 0.8471 0.199 83.87;
-  --er: 0.7176 0.221 22.18;
-  --pc: 0.89824 0.06192 275.75;
-  --ac: 0.15352 0.0368 183.61;
+    --pc: 0.906397 0.036353 309.06903;
+    --ac: 0.91221 0.03797 276.024691;
   --inc: 0 0 0;
   --suc: 0 0 0;
   --wac: 0 0 0;
-  --erc: 0 0 0;
+    --erc: 0.15041 0.019918 11.781878;
   --rounded-box: 1rem;
   --rounded-btn: 0.5rem;
   --rounded-badge: 1.9rem;
@@ -585,31 +586,30 @@ html {
   --border-btn: 1px;
   --tab-border: 1px;
   --tab-radius: 0.5rem;
-  --p: 0.4912 0.3096 275.75;
-  --s: 0.6971 0.329 342.55;
-  --sc: 0.9871 0.0106 342.55;
-  --a: 0.7676 0.184 183.61;
+    --p: 0.531983 0.181767 309.06903;
+    --s: 0.611735 0.178257 276.191325;
+    --sc: 0.823442 0 0;
+    --er: 0.75205 0.099591 11.781878;
+    --a: 0.56105 0.189852 276.024691;
   --n: 0.321785 0.02476 255.701624;
   --nc: 0.894994 0.011585 252.096176;
   --b1: 1 0 0;
   --b2: 0.961151 0 0;
   --b3: 0.924169 0.00108 197.137559;
   --bc: 0.278078 0.029596 256.847952;
+    placeholder-color: #0051ff;
 }
 
 [data-theme=dark] {
   color-scheme: dark;
   --in: 0.7206 0.191 231.6;
-  --su: 64.8% 0.150 160;
   --wa: 0.8471 0.199 83.87;
-  --er: 0.7176 0.221 22.18;
-  --pc: 0.13138 0.0392 275.75;
-  --sc: 0.1496 0.052 342.55;
-  --ac: 0.14902 0.0334 183.61;
+    --pc: 0.128144 0.031342 294.012462;
+    --sc: 0.141495 0.022698 280.825753;
+    --ac: 0.91221 0.03797 276.024691;
   --inc: 0 0 0;
-  --suc: 0 0 0;
   --wac: 0 0 0;
-  --erc: 0 0 0;
+    --erc: 0.15041 0.019918 11.781878;
   --rounded-box: 1rem;
   --rounded-btn: 0.5rem;
   --rounded-badge: 1.9rem;
@@ -619,15 +619,19 @@ html {
   --border-btn: 1px;
   --tab-border: 1px;
   --tab-radius: 0.5rem;
-  --p: 0.6569 0.196 275.75;
-  --s: 0.748 0.26 342.55;
-  --a: 0.7451 0.167 183.61;
+    --p: 0.640721 0.156708 294.012462;
+    --s: 0.707476 0.113489 280.825753;
+    --er: 0.75205 0.099591 11.781878;
+    --su: 0.855214 0.121904 149.444756;
+    --suc: 0.313815 0.021108 254.139175;
+    --a: 0.56105 0.189852 276.024691;
   --n: 0.313815 0.021108 254.139175;
   --nc: 0.746477 0.0216 264.435964;
-  --b1: 0.253267 0.015896 252.417568;
-  --b2: 0.232607 0.013807 253.100675;
-  --b3: 0.211484 0.01165 254.087939;
-  --bc: 0.746477 0.0216 264.435964;
+    --b1: 0.320396 0.020258 248.459491;
+    --b2: 0.253267 0.015896 252.417568;
+    --b3: 0.230285 0.016667 264.170493;
+    --bc: 0.804658 0 0;
+    placeholder-color: #0051ff;
 }
 
 *, ::before, ::after {
@@ -2164,6 +2168,10 @@ html {
     --btn-color: var(--fallback-s);
   }
 
+    .btn-neutral {
+        --btn-color: var(--fallback-n);
+    }
+
   .btn-success {
     --btn-color: var(--fallback-su);
   }
@@ -2231,6 +2239,10 @@ html {
     --btn-color: var(--s);
   }
 
+    .btn-neutral {
+        --btn-color: var(--n);
+    }
+
   .btn-success {
     --btn-color: var(--su);
   }
@@ -2246,6 +2258,12 @@ html {
   outline-color: var(--fallback-s,oklch(var(--s)/1));
 }
 
+.btn-neutral {
+    --tw-text-opacity: 1;
+    color: var(--fallback-nc, oklch(var(--nc)/var(--tw-text-opacity)));
+    outline-color: var(--fallback-n, oklch(var(--n)/1));
+}
+
 .btn-success {
   --tw-text-opacity: 1;
   color: var(--fallback-suc,oklch(var(--suc)/var(--tw-text-opacity)));
@@ -4676,11 +4694,6 @@ html {
   background-color: rgb(249 250 251 / var(--tw-bg-opacity));
 }
 
-.bg-green-800 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(22 101 52 / var(--tw-bg-opacity));
-}
-
 .bg-purple-600 {
   --tw-bg-opacity: 1;
   background-color: rgb(147 51 234 / var(--tw-bg-opacity));
@@ -4701,6 +4714,11 @@ html {
   background-color: var(--fallback-s,oklch(var(--s)/var(--tw-bg-opacity)));
 }
 
+.bg-success {
+    --tw-bg-opacity: 1;
+    background-color: var(--fallback-su, oklch(var(--su)/var(--tw-bg-opacity)));
+}
+
 .bg-white {
   --tw-bg-opacity: 1;
   background-color: rgb(255 255 255 / var(--tw-bg-opacity));
@@ -5039,6 +5057,11 @@ html {
   color: rgb(17 24 39 / var(--tw-text-opacity));
 }
 
+.text-neutral {
+    --tw-text-opacity: 1;
+    color: var(--fallback-n, oklch(var(--n)/var(--tw-text-opacity)));
+}
+
 .text-purple-600 {
   --tw-text-opacity: 1;
   color: rgb(147 51 234 / var(--tw-text-opacity));

diff --git a/frontend/templates/modals/receipts_upload.html b/frontend/templates/modals/receipts_upload.html
@@ -37,7 +37,7 @@
                     });
                 </script>
                 <button type="reset" class="btn btn-error">Reset</button>
-                <button type="button" onclick="document.getElementById('modal_receipts_upload').close();" class="btn">
+                <button type="button" onclick="document.getElementById('modal_receipts_upload').close();" class="btn btn-neutral">
                     Close
                 </button>
             </div>

diff --git a/frontend/templates/pages/invoices/view/invoice.html b/frontend/templates/pages/invoices/view/invoice.html
@@ -20,9 +20,8 @@
         </div>
         <div class="flex items-center mx-auto">
             <p class="flex items-center text-sm font-normal">
-            <span class="inline-flex p-1 mr-3 rounded-full w-6 h-6 items-center justify-center bg-green-800">
-                <i class="fa-solid fa-check"></i>
-                <span class="sr-only">Paid</span>
+            <span class="inline-flex p-1 mr-3 rounded-full w-6 h-6 items-center justify-center bg-success">
+                <i class="fa-solid fa-check text-neutral"></i>
             </span>
                 <span>
                 {% with ps=invoice.payment_status %}