- dark mode

resources/js/Oasis/Homepage/Components/OasisAboutUs.vue

@@ -282,4 +282,13 @@
             }
         }
     }
+
+    @media (prefers-color-scheme: dark) {
+        .info-list .info-list-item {
+
+            .description {
+                color: $dark-mode-text;
+            }
+        }
+    }
 </style>

resources/js/Oasis/Homepage/Components/OasisFeatures.vue

@@ -283,4 +283,10 @@
             }
         }
     }
+
+    @media (prefers-color-scheme: dark) {
+
+
+    }
+
 </style>

resources/js/Oasis/Homepage/Components/OasisFooter.vue

@@ -63,4 +63,14 @@
             }
         }
     }
+
+    @media (prefers-color-scheme: dark) {
+
+        .oasis-footer.container {
+
+            .links li a {
+                color: $dark-mode-text;
+            }
+        }
+    }
 </style>

resources/js/Oasis/Homepage/Components/OasisHeader.vue

@@ -296,4 +296,19 @@
             margin-bottom: 120px;
         }
     }
+
+    @media (prefers-color-scheme: dark) {
+
+        .oasis-header {
+            background: darken($theme-bg-dark, 10%);
+
+            .main-title {
+                color: white;
+            }
+        }
+
+        .cloud {
+            opacity: 0.03;
+        }
+    }
 </style>

resources/js/Oasis/Homepage/Components/OasisNavigation.vue

@@ -151,4 +151,19 @@
             display: none;
         }
     }
+
+
+    @media (prefers-color-scheme: dark) {
+        .navigation {
+
+            .links li a {
+                color: $dark-mode-text;
+            }
+
+            &.white {
+                background: rgba(darken($theme-bg-dark, 10%), 0.9);
+                backdrop-filter: blur(18px);
+            }
+        }
+    }
 </style>

resources/js/Oasis/Homepage/Components/OasisPricing.vue

@@ -460,4 +460,27 @@
             }
         }
     }
+
+    @media (prefers-color-scheme: dark) {
+
+        .oasis-pricing {
+            .main-title-sm {
+                color: white;
+            }
+        }
+
+        .pricing-box {
+
+            .box {
+                background: darken($theme-bg-dark, 5%);
+
+                .pricing-data,
+                .pricing-name,
+                .pricing-description,
+                .pricing-vat {
+                    color: white;
+                }
+            }
+        }
+    }
 </style>