diff --git a/public/css/modules/base/base.css b/public/css/modules/base/base.css
index c45b7cd..3e7dd4c 100644
--- a/public/css/modules/base/base.css
+++ b/public/css/modules/base/base.css
@@ -8,16 +8,9 @@
html {
height: 100vh;
- --main-background: #ffffff;
- --secondary-background: #eeeeee;
- --main-text: #333333;
- --main-text-inverted: #eeeeee;
--main-scroll: #555;
- --panels-background: #222324;
- --panels-text: #ffffff;
--panels-scroll: #2a2c2c;
--accent-color: #0a84ff;
- --accent-text: #ffffff;
--tag-background: #0062c4;
--tag-text: #ffffff;
--toast-background: #000000dd;
@@ -28,6 +21,16 @@ html {
--explicit-separator: 0.3125em;
}
+html[data-theme='light'] {
+ --main-background: #ffffff;
+ --secondary-background: #eeeeee;
+ --main-text: #333333;
+ --main-text-inverted: #eeeeee;
+ --panels-background: #222324;
+ --panels-text: #ffffff;
+ --accent-text: #ffffff;
+}
+
html[data-theme='dark'] {
--main-background: #141414;
--secondary-background: #242424;
diff --git a/public/css/modules/sidebar.css b/public/css/modules/sidebar.css
index 181069e..f5d36a2 100644
--- a/public/css/modules/sidebar.css
+++ b/public/css/modules/sidebar.css
@@ -47,11 +47,20 @@
padding: 9px;
}
+#sidebar .side_icon::selection {
+ background: none;
+}
+
+.side_icon--theme {
+ cursor: default;
+}
+
#sidebar .main_tablinks.active .side_icon {
color: var(--accent-color);
}
/* Theme selector */
+
#theme_selector {
margin-top: 20px;
display: flex;
@@ -74,27 +83,27 @@
visibility: visible;
}
-#theme_togglers .theme_toggler {
- width: 30px;
- height: 30px;
+.theme_toggler {
+ width: 25px;
+ height: 25px;
border-radius: 1000px;
- border: 1px solid var(--accent-color);
+ border: 1px solid var(--separator);
cursor: pointer;
transition: border 200ms ease-in-out;
}
-#theme_togglers .theme_toggler.active {
+.theme_toggler--active {
border-width: 3px;
}
-#theme_togglers .theme_toggler#light {
+.theme_toggler[data-theme-variant='light'] {
background: white;
}
-#theme_togglers .theme_toggler#dark {
+.theme_toggler[data-theme-variant='dark'] {
background: #141414;
}
-#sidebar .theme_selector_icon {
- transform: rotate(45deg);
+.theme_toggler[data-theme-variant='purple'] {
+ background: #460ead;
}
diff --git a/public/index.html b/public/index.html
index 17cdab4..15f4040 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1,5 +1,5 @@
-
+
@@ -9,8 +9,8 @@
@@ -57,10 +57,11 @@
Info
- brightness_3
+ palette
@@ -162,7 +163,8 @@ Start searching!
class="download_overlay">get_app
- explicit
+ explicit
{{release.ALB_TITLE}}
{{release.ART_NAME+' - '+release.NUMBER_TRACK+' tracks'}}
@@ -1150,4 +1152,4 @@ {{ metadata }}
-
+
\ No newline at end of file
diff --git a/public/js/bundle.js b/public/js/bundle.js
index 1afda90..46bc01a 100644
--- a/public/js/bundle.js
+++ b/public/js/bundle.js
@@ -1,10 +1,4 @@
-var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
-
-function createCommonjsModule(fn, module) {
- return module = { exports: {} }, fn(module, module.exports), module.exports;
-}
-
-var jquery = createCommonjsModule(function (module) {
+var t="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{};function e(t,e){return t(e={exports:{}},e.exports),e.exports}var n=e((function(e){
/*!
* jQuery JavaScript Library v3.5.1
* https://jquery.com/
@@ -18,502 +12,7 @@ var jquery = createCommonjsModule(function (module) {
*
* Date: 2020-05-04T22:49Z
*/
-( function( global, factory ) {
-
- {
-
- // For CommonJS and CommonJS-like environments where a proper `window`
- // is present, execute the factory and get jQuery.
- // For environments that do not have a `window` with a `document`
- // (such as Node.js), expose a factory as module.exports.
- // This accentuates the need for the creation of a real `window`.
- // e.g. var jQuery = require("jquery")(window);
- // See ticket #14549 for more info.
- module.exports = global.document ?
- factory( global, true ) :
- function( w ) {
- if ( !w.document ) {
- throw new Error( "jQuery requires a window with a document" );
- }
- return factory( w );
- };
- }
-
-// Pass this if window is not defined yet
-} )( typeof window !== "undefined" ? window : commonjsGlobal, function( window, noGlobal ) {
-
-var arr = [];
-
-var getProto = Object.getPrototypeOf;
-
-var slice = arr.slice;
-
-var flat = arr.flat ? function( array ) {
- return arr.flat.call( array );
-} : function( array ) {
- return arr.concat.apply( [], array );
-};
-
-
-var push = arr.push;
-
-var indexOf = arr.indexOf;
-
-var class2type = {};
-
-var toString = class2type.toString;
-
-var hasOwn = class2type.hasOwnProperty;
-
-var fnToString = hasOwn.toString;
-
-var ObjectFunctionString = fnToString.call( Object );
-
-var support = {};
-
-var isFunction = function isFunction( obj ) {
-
- // Support: Chrome <=57, Firefox <=52
- // In some browsers, typeof returns "function" for HTML