diff options
author | Andrew Dolgov <[email protected]> | 2019-03-14 12:17:59 +0300 |
---|---|---|
committer | Andrew Dolgov <[email protected]> | 2019-03-14 12:17:59 +0300 |
commit | 32157975ebd9a652155cc8b76ac3eaefa1589982 (patch) | |
tree | 446cbb666a6def64daaba3af1ad9f39909eafe19 | |
parent | 0b4987a72ceb6511ae9b0ee6e7d5b72d7c3404a0 (diff) |
add dark theme
-rw-r--r-- | reader.css | 4 | ||||
-rw-r--r-- | reader.css.map | 2 | ||||
-rwxr-xr-x | reader.html | 2 | ||||
-rwxr-xr-x | reader.js | 26 | ||||
-rw-r--r-- | reader.less | 8 |
5 files changed, 38 insertions, 4 deletions
@@ -88,4 +88,8 @@ ::-webkit-scrollbar-track { background-color: #eee; } +body.dark .splash, +body.dark #reader { + background: #333; +} /*# sourceMappingURL=reader.css.map */
\ No newline at end of file diff --git a/reader.css.map b/reader.css.map index 46e3cf0..4a2694c 100644 --- a/reader.css.map +++ b/reader.css.map @@ -1 +1 @@ -{"version":3,"sources":["reader.less"],"names":[],"mappings":"AAAA,QAAgC;EAC/B;IACC,aAAA;;;AAIF,QAA+B;EAC9B;IACC,aAAA;;;AAIF;EACC,YAAA;EACA,kBAAA;EACA,MAAA;EACA,OAAA;EACA,WAAA;EACA,YAAA;EACA,iBAAA;EACA,eAAA;EACA,aAAA;EACA,mBAAA;EACA,uBAAA;;AAGD;EACC,kBAAA;EACA,MAAA;EACA,SAAA;EACA,OAAA;EACA,QAAA;EACA,aAAA;EACA,uBAAA;EACA,gBAAA;;AAGD,OAAO;EACN,gBAAA;;AAGD,OAAO,UAAW;AAClB,OAAO,cAAe;EACrB,yBAAA;;AAGD,OAAO,aAAc;EACpB,SAAA;;AAGD,OAAO,cAAe;EACrB,YAAA;;AAGD,OAAO,UAAW;EACjB,eAAA;EACA,WAAA;EACA,YAAA;;AAGD,OAAO,SAAS,IAAI,gBAAiB,IAAG;EACvC,cAAA;;AAGD,OAAO,SAAU;EAChB,eAAA;EACA,gBAAA;EACA,gBAAA;EACA,mBAAA;EACA,WAAA;EACA,YAAA;;AAGD;AAAO;EACN,kBAAA;EACA,SAAA;EACA,YAAA;EACA,WAAA;EACA,WAAA;EACA,eAAA;EACA,aAAA;EACA,mBAAA;EACA,uBAAA;EACA,YAAA;;AAGD;EACC,OAAA;;AAGD;EACC,QAAA;;AAGD;EACC,UAAA;;AAGD;EACC,yBAAA;;AAGD;EACC,sBAAA","file":"reader.css"}
\ No newline at end of file +{"version":3,"sources":["reader.less"],"names":[],"mappings":"AAAA,QAAgC;EAC/B;IACC,aAAA;;;AAIF,QAA+B;EAC9B;IACC,aAAA;;;AAIF;EACC,YAAA;EACA,kBAAA;EACA,MAAA;EACA,OAAA;EACA,WAAA;EACA,YAAA;EACA,iBAAA;EACA,eAAA;EACA,aAAA;EACA,mBAAA;EACA,uBAAA;;AAGD;EACC,kBAAA;EACA,MAAA;EACA,SAAA;EACA,OAAA;EACA,QAAA;EACA,aAAA;EACA,uBAAA;EACA,gBAAA;;AAGD,OAAO;EACN,gBAAA;;AAGD,OAAO,UAAW;AAClB,OAAO,cAAe;EACrB,yBAAA;;AAGD,OAAO,aAAc;EACpB,SAAA;;AAGD,OAAO,cAAe;EACrB,YAAA;;AAGD,OAAO,UAAW;EACjB,eAAA;EACA,WAAA;EACA,YAAA;;AAGD,OAAO,SAAS,IAAI,gBAAiB,IAAG;EACvC,cAAA;;AAGD,OAAO,SAAU;EAChB,eAAA;EACA,gBAAA;EACA,gBAAA;EACA,mBAAA;EACA,WAAA;EACA,YAAA;;AAGD;AAAO;EACN,kBAAA;EACA,SAAA;EACA,YAAA;EACA,WAAA;EACA,WAAA;EACA,eAAA;EACA,aAAA;EACA,mBAAA;EACA,uBAAA;EACA,YAAA;;AAGD;EACC,OAAA;;AAGD;EACC,QAAA;;AAGD;EACC,UAAA;;AAGD;EACC,yBAAA;;AAGD;EACC,sBAAA;;AAGD,IAAI,KACH;AADD,IAAI,KACM;EACR,gBAAA","file":"reader.css"}
\ No newline at end of file diff --git a/reader.html b/reader.html index 1cca6bb..ffc6c5b 100755 --- a/reader.html +++ b/reader.html @@ -16,7 +16,7 @@ <link rel="stylesheet" type="text/css" href="reader.css"/> <script type="text/javascript" src="reader.js"></script> </head> -<body class="dark"> +<body data-bind="css: themeName"> <div class="modal fade" id="settings-modal" tabindex="-1" role="dialog"> <div class="modal-dialog" role="document"> @@ -8,6 +8,19 @@ function Model() { self._zipEntries = ko.observableArray(); self.syncAccount = ko.observable(""); + self._themeName = ko.observable(""); + + self.themeName = ko.computed({ + read: function() { + return self._themeName(); + }, + write: function(theme) { + localforage.setItem("THEME", theme).then(() => { + model._themeName(theme); + }); + } + }); + self.cacheKey = function(suffix) { const sha1 = require('js-sha1'); @@ -326,6 +339,10 @@ $(document).ready(function () { model.fitToWidth(ftw); }); + localforage.getItem("THEME").then((theme) => { + model.themeName(theme); + }); + ko.applyBindings(model, document.querySelector('html')); ipcRenderer.on("open-settings", () => { @@ -436,13 +453,18 @@ $(document).ready(function () { $(".sync-account").on("change", function() { const acct = $(this).val(); - console.log('sa', acct); - localforage.setItem("TTC:SYNC-ACCOUNT", acct).then(() => { model.syncAccount(acct); }); }); + $(".theme-select").on("change", function() { + const theme = $(this).val(); + + model.themeName(theme); + }); + + $(".fit-to-width-cb").on("click", (e) => { model.fitToWidth(e.target.checked); }); diff --git a/reader.less b/reader.less index bdfb8fa..7d73f31 100644 --- a/reader.less +++ b/reader.less @@ -103,3 +103,11 @@ ::-webkit-scrollbar-track { background-color: #eee; } + +body.dark { + .splash, #reader { + background : #333; + } + + +} |