From 9d8c4b2791aa1f4f13e1deb5a7e63a779e4b7aa3 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 6 Nov 2019 17:21:04 +0100 Subject: dark mode support --- public/assets/css/bucky.css | 36 +++++++++++++++++++++++++++++++++++- 1 file changed, 35 insertions(+), 1 deletion(-) (limited to 'public/assets/css') diff --git a/public/assets/css/bucky.css b/public/assets/css/bucky.css index 349c35c..96bdabc 100644 --- a/public/assets/css/bucky.css +++ b/public/assets/css/bucky.css @@ -7,6 +7,7 @@ html { min-height: 100%; margin: 0; padding: 0; + margin-bottom: 150px; } body { min-width: 100%; @@ -17,7 +18,7 @@ body { font-size: 10px; font-family: Trebuchet MS, Helvetica, Arial, sans-serif; margin: 0; - padding: 20px 30px 200px 30px; + padding: 20px 30px 30px 30px; transition: opacity 100ms; } body.loading { @@ -1244,3 +1245,36 @@ audio { padding-right: 2px; } } +@media (prefers-color-scheme: dark) { + body { + background: #180808; + color: #f8f8f8; + } + button, input[type=submit] { + color: #f8f8f8; + border: 2px #eee solid; + padding: 2px; + margin: 3px; + background-color: #18202c; + text-transform: uppercase; + cursor: pointer; + } + .desktop button:hover, + .desktop input[type=submit] { + color: #fff; + background-color: #28303c; + } + hr { + border-color: #fff; + } + a.headline:link, + a.headline:visited { color: #eee; text-decoration: none; } + .desktop a.headline:hover { color: #fff; text-decoration: none; } + .ledger .row td:nth-child(1) a { color: #ddd; } + #threads .keyword td a { color: #ddd; text-decoration: none; } + .desktop #threads .keyword td a:hover { color: #fff; text-decoration: underline; } + #threads .keyword td b a { color: #ddd; } + .desktop #threads .keyword td b a:hover { color: #fff; } + .subtitle a { color: #eee; text-decoration: none; } + .desktop.subtitle a:hover { color: #fff; text-decoration: underline; } +} \ No newline at end of file -- cgit v1.2.3-70-g09d2 From debd9489af50173bd314a3a9b0e5f14aa07543ea Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 7 Nov 2019 15:57:55 +0100 Subject: fonts --- public/assets/css/bucky.css | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'public/assets/css') diff --git a/public/assets/css/bucky.css b/public/assets/css/bucky.css index 96bdabc..5d6a34a 100644 --- a/public/assets/css/bucky.css +++ b/public/assets/css/bucky.css @@ -1277,4 +1277,10 @@ audio { .desktop #threads .keyword td b a:hover { color: #fff; } .subtitle a { color: #eee; text-decoration: none; } .desktop.subtitle a:hover { color: #fff; text-decoration: underline; } + .new { color: #ffffff; font-weight: bold; } + .recent { color: #e0f8f8; } + .med { color: #d0e8e8; } + .old { color: #c24040; } + .older { color: #bd8484; } + .quiet { color: #878787; } } \ No newline at end of file -- cgit v1.2.3-70-g09d2 From 5a09f91887d50edef65757f7d7a86b0120a9e00e Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 19 Nov 2019 18:19:31 +0100 Subject: more dark mode fixes --- .env-sample | 1 + bucky/app/site.js | 2 +- public/assets/css/bucky.css | 33 ++++++++++++++++++++++++++------- views/partials/hootbox.ejs | 2 +- 4 files changed, 29 insertions(+), 9 deletions(-) (limited to 'public/assets/css') diff --git a/.env-sample b/.env-sample index f9e6bbc..69a98b6 100644 --- a/.env-sample +++ b/.env-sample @@ -9,4 +9,5 @@ S3_BUCKET= S3_PATH=/bucky SESSIONS_IN_MEMORY=yes NODE_ENV=development +MONGODB_URL=mongodb://127.0.0.1:27107/buckySessionDb diff --git a/bucky/app/site.js b/bucky/app/site.js index e266716..4272b24 100644 --- a/bucky/app/site.js +++ b/bucky/app/site.js @@ -46,7 +46,7 @@ site.init = function(){ } if (!process.env.SESSIONS_IN_MEMORY) { sessionSettings.store = new MongoStore({ - url: 'mongodb://127.0.0.1:28108/buckySessionDb' + url: process.env.MONGODB_URL || 'mongodb://127.0.0.1:27107/buckySessionDb' // type: 'mongodb', // host: 'localhost', // port: 27017, diff --git a/public/assets/css/bucky.css b/public/assets/css/bucky.css index 5d6a34a..0ff7a8d 100644 --- a/public/assets/css/bucky.css +++ b/public/assets/css/bucky.css @@ -1250,7 +1250,7 @@ audio { background: #180808; color: #f8f8f8; } - button, input[type=submit] { + button:not(.hoot), input[type=submit] { color: #f8f8f8; border: 2px #eee solid; padding: 2px; @@ -1259,7 +1259,7 @@ audio { text-transform: uppercase; cursor: pointer; } - .desktop button:hover, + .desktop button:not(.hoot):hover, .desktop input[type=submit] { color: #fff; background-color: #28303c; @@ -1278,9 +1278,28 @@ audio { .subtitle a { color: #eee; text-decoration: none; } .desktop.subtitle a:hover { color: #fff; text-decoration: underline; } .new { color: #ffffff; font-weight: bold; } - .recent { color: #e0f8f8; } - .med { color: #d0e8e8; } - .old { color: #c24040; } - .older { color: #bd8484; } + .recent { color: #f8f0f0; } + .med { color: #e8e0e0; } + .old { color: #b8b0b0; } + .older { color: #a7a4a4; } .quiet { color: #878787; } -} \ No newline at end of file + .bluebox { box-shadow: 0 0px 1.5px rgba(238,238,255,1.0), 0 0px 1.5px rgba(238,238,255,1.0); } + .search_form input[type='text']:focus { + border-bottom-color: #888; + } + .search_form input[type='text']:invalid { + caret-color: #888; + } + #comment_form textarea.empty { + border-bottom-color: #fff; + } + #comment_form textarea.empty::placeholder { + color: #fff; + } + #search { + color: #eee; + } + #search b { + color: #fff; + } +} diff --git a/views/partials/hootbox.ejs b/views/partials/hootbox.ejs index fe0298b..826b89a 100644 --- a/views/partials/hootbox.ejs +++ b/views/partials/hootbox.ejs @@ -1,7 +1,7 @@
- +
-- cgit v1.2.3-70-g09d2 From 9855bb480c2f357989bddb05de44d76cb2438c6b Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 21 Nov 2019 17:18:23 +0100 Subject: ledger colors --- public/assets/css/bucky.css | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) (limited to 'public/assets/css') diff --git a/public/assets/css/bucky.css b/public/assets/css/bucky.css index 0ff7a8d..b2e8c97 100644 --- a/public/assets/css/bucky.css +++ b/public/assets/css/bucky.css @@ -1277,12 +1277,12 @@ audio { .desktop #threads .keyword td b a:hover { color: #fff; } .subtitle a { color: #eee; text-decoration: none; } .desktop.subtitle a:hover { color: #fff; text-decoration: underline; } - .new { color: #ffffff; font-weight: bold; } - .recent { color: #f8f0f0; } - .med { color: #e8e0e0; } - .old { color: #b8b0b0; } - .older { color: #a7a4a4; } - .quiet { color: #878787; } + .ledger .new { color: #ffffff; font-weight: bold; } + .ledger .recent { color: #f8f0f0; } + .ledger .med { color: #e8e0e0; } + .ledger .old { color: #b8b0b0; } + .ledger .older { color: #a7a4a4; } + .ledger .quiet { color: #878787; } .bluebox { box-shadow: 0 0px 1.5px rgba(238,238,255,1.0), 0 0px 1.5px rgba(238,238,255,1.0); } .search_form input[type='text']:focus { border-bottom-color: #888; -- cgit v1.2.3-70-g09d2