From 3136c5cd984c18e202428b89c2b01d08aa959593 Mon Sep 17 00:00:00 2001
From: copyleftie <leftie@eerie.garden>
Date: Fri, 24 May 2019 20:45:19 -0400
Subject: [PATCH] feat: add rio-like theme

---
 src/routes/_static/themes.js |  6 +++++
 src/scss/themes/rio.scss     | 51 ++++++++++++++++++++++++++++++++++++
 2 files changed, 57 insertions(+)
 create mode 100644 src/scss/themes/rio.scss

diff --git a/src/routes/_static/themes.js b/src/routes/_static/themes.js
index f52dd9c..bfc02f4 100644
--- a/src/routes/_static/themes.js
+++ b/src/routes/_static/themes.js
@@ -41,6 +41,12 @@ const themes = [
     dark: false,
     color: '#4ab92f'
   },
+  {
+    name: 'rio',
+    label: 'rio',
+    dark: false,
+    color: '#55aaaa'
+  },
   {
     name: 'ozark',
     label: 'Ozark',
diff --git a/src/scss/themes/rio.scss b/src/scss/themes/rio.scss
new file mode 100644
index 0000000..37615de
--- /dev/null
+++ b/src/scss/themes/rio.scss
@@ -0,0 +1,51 @@
+$main-theme-color: #999999;
+$body-bg-color: #4D4D4D;
+$anchor-color: #2A5858;
+$main-text-color: #000000;
+$border-color: #9EEEEE;
+$main-bg-color: #FFFFFF;
+$secondary-text-color: #444444;
+$toast-border: #9EEEEE;
+$toast-bg: #999999;
+$focus-outline: #55AAAA;
+$compose-background: lighten($main-theme-color, 32%);
+
+@import "_base.scss";
+
+$scrollbar-face: #FFFFFF !default;
+$scrollbar-face-hover: #FFFFFF !default;
+$scrollbar-face-active: #FFFFFF !default;
+$scrollbar-track: #999999 !default;
+@import "_scrollbars.scss";
+
+:root {
+
+	/* idea is navbar as rio's right-click menu */
+	--nav-bg: #E9FFE9;
+	--nav-border: #88CC88;
+	--nav-active-bg: #448844;
+	--nav-a-selected-bg: #448844;
+	--nav-a-selected-active-bg: #448844;
+	--nav-text-color: #000000;
+	--nav-text-color-hover: #FFFFFF;
+	--nav-a-bg-hover: #448844;
+	--nav-a-selected-border: #88CCCC;
+	--nav-a-border-hover: #88CCCC;
+
+	--settings-list-item-text: #{$anchor-color};
+}
+
+a, a.main-nav-link.svelte-my25xk, .settings-list-item {
+	text-decoration: underline;
+}
+a.mention.u-url, a:hover, a:active, ::selection {
+	background: #CCCCCC;
+}
+a.mention.u-url:hover, a.mention.u-url:active {
+	background: #2A5858;
+	color: #CCCCCC;
+}
+a.status-author-name, a.status-header-author {
+	text-decoration: none;
+	border-bottom: solid 1px #000000;
+}