From e85bbf1bddd4b31a86f58d6111e2e92a41fd0180 Mon Sep 17 00:00:00 2001
From: Alexandar Mechev <apmechev@gmail.com>
Date: Mon, 5 Oct 2020 17:46:51 +0200
Subject: [PATCH] adds nord-light theme

based on polar:
https://github.com/mtyn/polar
---
 app/static/css/themes/nord-light.css        | 42 +++++++++++++++++++++
 app/static/css/themes/nord-search-light.css | 35 +++++++++++++++++
 app/templates/display.html                  |  6 +--
 app/templates/index.html                    |  4 +-
 4 files changed, 82 insertions(+), 5 deletions(-)
 create mode 100644 app/static/css/themes/nord-light.css
 create mode 100644 app/static/css/themes/nord-search-light.css

diff --git a/app/static/css/themes/nord-light.css b/app/static/css/themes/nord-light.css
new file mode 100644
index 0000000..7137db0
--- /dev/null
+++ b/app/static/css/themes/nord-light.css
@@ -0,0 +1,42 @@
+html {
+    background-color: #D8DEE9b3 !important;
+}
+
+body {
+    background-color: #f9fafb !important;
+}
+
+div {
+    /*background-color: #111 !important;*/
+    color: #3B4252 !important;
+}
+
+a:visited h3 div {
+    color: #A3BE8C !important;
+}
+
+a:link h3 div {
+    color: #4C566A !important;
+}
+
+a:link div {
+    color: #81a1c1 !important;
+}
+
+div span {
+    color: #5E81AC !important;
+}
+
+input {
+    background-color: #f9fafb !important;
+    color: #3B4252 !important;
+}
+
+#search-bar {
+    color: #4C566A !important;
+    background-color: #ffffff !important;
+}
+
+.search-container {
+    background-color: #f9fafb !important;
+}
diff --git a/app/static/css/themes/nord-search-light.css b/app/static/css/themes/nord-search-light.css
new file mode 100644
index 0000000..08917fa
--- /dev/null
+++ b/app/static/css/themes/nord-search-light.css
@@ -0,0 +1,35 @@
+.autocomplete {
+    position: relative;
+    display: inline-block;
+    width: 100%;
+}
+
+.autocomplete-items {
+    position: absolute;
+    border: 1px solid #685e79;
+    border-bottom: none;
+    border-top: none;
+    z-index: 99;
+
+    /*position the autocomplete items to be the same width as the container:*/
+    top: 100%;
+    left: 0;
+    right: 0;
+}
+
+.autocomplete-items div {
+    padding: 10px;
+    cursor: pointer;
+    color: #3B4252;
+    background-color: #D8DEE9b3;
+    border-bottom: 1px solid #242424;
+}
+
+.autocomplete-items div:hover {
+    background-color: #404040;
+}
+
+.autocomplete-active {
+    background-color: #685e79 !important;
+    color: #f9fafb;
+}
\ No newline at end of file
diff --git a/app/templates/display.html b/app/templates/display.html
index ed879de..2153346 100644
--- a/app/templates/display.html
+++ b/app/templates/display.html
@@ -7,14 +7,14 @@
     <meta name="referrer" content="no-referrer">
     <script type="text/javascript" src="/static/js/autocomplete.js"></script>
     {% if theme %}
-        <link rel="stylesheet" href="/static/css/{{'theme/' if theme else ''}}{{ 'search-dark' if dark_mode else 'search' }}.css" />
+        <link rel="stylesheet" href="/static/css/{{'theme/' if theme else ''}}{{ 'search-dark' if dark_mode else 'search-light' }}.css" />
     {% else %}
         <link rel="stylesheet" href="/static/css/{{ 'dark-' if dark_mode else '' }}theme.css" />
+        <link rel="stylesheet" href="/static/css/{{ 'search-dark' if dark_mode else 'search-light' }}.css">
     {% endif %}
-    <link rel="stylesheet" href="/static/css/{{ 'search-dark' if dark_mode else 'search' }}.css">
     <link rel="stylesheet" href="/static/css/header.css">
     {% if theme %}
-        <link rel="stylesheet" href="/static/css/themes/{{theme}}{{ '-dark' if dark_mode else '' }}.css" />
+        <link rel="stylesheet" href="/static/css/themes/{{theme}}{{ '-dark' if dark_mode else '-light' }}.css" />
     {% else %}
         <link rel="stylesheet" href="/static/css/{{ 'dark-' if dark_mode else '' }}theme.css" />
     {% endif %}
diff --git a/app/templates/index.html b/app/templates/index.html
index 54a8a1c..4ce2b58 100644
--- a/app/templates/index.html
+++ b/app/templates/index.html
@@ -25,12 +25,12 @@
     <link rel="stylesheet" href="/static/css/main.css">
     {% if config['theme'] %}
     <link rel="stylesheet"
-        href="/static/css/themes/{{config['theme']}}{{ '-search-dark' if config['dark'] else '-search' }}.css" />
+        href="/static/css/themes/{{config['theme']}}{{ '-search-dark' if config['dark'] else '-search-light' }}.css" />
     {% else %}
     <link rel="stylesheet" href="/static/css/{{ 'dark-' if config['dark'] else '' }}theme.css" />
     {% endif %}
     {% if config['theme'] %}
-    <link rel="stylesheet" href="/static/css/themes/{{config['theme']}}{{ '-dark' if config['dark'] else '' }}.css" />
+    <link rel="stylesheet" href="/static/css/themes/{{config['theme']}}{{ '-dark' if config['dark'] else '-light' }}.css" />
     {% else %}
     <link rel="stylesheet" href="/static/css/{{ 'dark-' if config['dark'] else '' }}theme.css" />
     {% endif %}