From eb50ba94db3f42c12e6263850cc377afcca6128f Mon Sep 17 00:00:00 2001
From: Anand Chowdhary <mail@anandchowdhary.com>
Date: Fri, 22 Jan 2021 19:39:44 +0530
Subject: [PATCH] :lipstick: Add ocean theme

---
 src/routes/_layout.svelte |  2 +-
 static/themes/ocean.css   | 78 +++++++++++++++++++++++++++++++++++++++
 2 files changed, 79 insertions(+), 1 deletion(-)
 create mode 100644 static/themes/ocean.css

diff --git a/src/routes/_layout.svelte b/src/routes/_layout.svelte
index 8d7ee22..503674b 100644
--- a/src/routes/_layout.svelte
+++ b/src/routes/_layout.svelte
@@ -32,7 +32,7 @@
   {/if}
   <link
     rel="stylesheet"
-    href={`/themes/${(config["status-website"] || {}).theme || "dark"}.css`}
+    href={`/themes/${(config["status-website"] || {}).theme || "light"}.css`}
   />
   {#if config['status-website'].css}
     {@html `<style>${config['status-website'].css}</style>`}
diff --git a/static/themes/ocean.css b/static/themes/ocean.css
new file mode 100644
index 0000000..284ca91
--- /dev/null
+++ b/static/themes/ocean.css
@@ -0,0 +1,78 @@
+body {
+  background-color: #0c2461;
+  color: #f0ffff;
+}
+
+code {
+  color: #555;
+  background-color: #f0f0f0;
+}
+
+article {
+  background-color: #1e3799;
+  border-color: rgba(0, 0, 0, 0.1);
+}
+
+article.down {
+  border-left-color: #e74c3c;
+  background-color: #700000;
+}
+article.degraded {
+  border-left-color: #f39c12 !important;
+  background-color: #ffdfad;
+}
+article.up {
+  border-left-color: #2ecc71;
+}
+article.good {
+  background-color: #dcffeb;
+  color: #003300;
+}
+
+.tag {
+  color: #fff;
+}
+.tag.closed,
+.tag.up {
+  background-color: #16a085;
+}
+.tag.open,
+.tag.down {
+  background-color: #c0392b;
+}
+.tag.degraded {
+  background-color: #f39c12 !important;
+}
+
+.changed + section .data {
+  background-color: #fdcb6e;
+}
+
+.live-status article {
+  background-color: #1e3799;
+}
+
+nav {
+  border-bottom-color: rgba(0, 0, 0, 0.1);
+  background-color: #1e3799;
+}
+
+[aria-current] {
+  border-bottom-color: #3498db;
+}
+
+a.error-button {
+  border-color: rgba(0, 0, 0, 0.25);
+  background-color: #01a3a4;
+  color: #1e3799;
+}
+
+.submit-button {
+  background-color: #01a3a4;
+  color: #1e3799;
+  border-color: transparent;
+}
+
+article .graph {
+  opacity: 0.25;
+}