started re-organizing css, added js beautify file

.jsbeautifyrc

@@ -0,0 +1,14 @@
+{
+	"css": {
+			"allowed_file_extensions": ["css", "scss", "sass", "less"],
+			"end_with_newline": true,
+			"indent_char": " ",
+			"indent_size": 2,
+			"indent_with_tabs": true,
+			"newline_between_rules": true,
+			"selector_separator": " ",
+			"selector_separator_newline": true,
+			"preserve_newlines": true,
+			"max_preserve_newlines": 10
+	}
+}

public/css/darkMode.css

@@ -1,3 +1,4 @@
+/* imho not necessary */
 :root {
 	--main-background: #141414;
 	--secondary-background: #242424;

public/css/modules/base.css

@@ -0,0 +1,46 @@
+:root {
+	--main-background: #ffffff;
+	--secondary-background: #eeeeee;
+	--main-text: #333333;
+	--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;
+	--toast-secondary: #ffffff22;
+	--toast-text: #ffffffde;
+}
+
+/* A little JS needed, not difficult */
+.dark-theme {
+	--main-background: #141414;
+	--secondary-background: #242424;
+	--main-text: #eeeeee;
+	--panels-background: #1a1a1a;
+	--panels-text: #ffffff;
+}
+
+html {
+	height: 100%;
+}
+
+body {
+	margin: 0px;
+	width: 100%;
+	height: 100%;
+	font-family: 'Open Sans';
+	overflow: hidden;
+	background-color: var(--main-background);
+	color: var(--main-text);
+}
+
+#main_content {
+	margin-left: 48px;
+	width: calc(100% - 48px);
+	height: 100%;
+	display: flex;
+}

public/css/modules/download-tab.css

@@ -0,0 +1,127 @@
+/* Download tab section */
+div#download_tab_container {
+	background-color: var(--panels-background);
+	color: var(--panels-text);
+	height: 100%;
+	width: auto;
+	display: flex;
+}
+
+div#download_tab_bar {
+	height: 100%;
+	width: 32px;
+}
+
+div#download_tab_bar>label {
+	writing-mode: vertical-rl;
+	line-height: 32px;
+	padding-top: 8px;
+}
+
+div#download_tab {
+	height: 100%;
+	width: 300px;
+	display: none;
+}
+
+.download_bar_icon {
+	font-size: 24px;
+	margin: 4px;
+}
+
+#download_list {
+	padding: 0px 8px;
+	height: calc(100% - 32px);
+	overflow-y: scroll;
+}
+
+#download_list::-webkit-scrollbar {
+	width: 10px;
+}
+
+#download_list::-webkit-scrollbar-track {
+	background: var(--panels-background);
+}
+
+#download_list::-webkit-scrollbar-thumb {
+	background: var(--panels-scroll);
+	border-radius: 4px;
+	width: 6px;
+	padding: 0px 2px;
+}
+
+#download_list>.download_object {
+	padding-bottom: 8px;
+}
+
+#download_list>.download_object .download_info {
+	display: flex;
+	align-items: center;
+}
+
+#download_list>.download_object .download_info img {
+	width: 75px;
+	height: 75px;
+	display: inline-block;
+	flex-shrink: 0;
+}
+
+#download_list>.download_object .download_info .download_line {
+	display: block;
+}
+
+#download_list>.download_object .download_info .download_slim_separator {
+	display: none;
+}
+
+#download_list>.download_object .download_info_data {
+	width: 100%;
+	margin-left: 8px;
+}
+
+#download_list>.download_object .download_info_status {
+	margin-left: 8px;
+	width: 80px;
+}
+
+#download_list.slim>.download_object .download_info img {
+	display: none;
+}
+
+#download_list.slim>.download_object .download_info .download_line {
+	display: inline-block;
+}
+
+#download_list.slim>.download_object .download_info .download_slim_separator {
+	display: inline-block;
+}
+
+#download_list.slim>.download_object .download_info_data {
+	width: calc(80% - 16px);
+	display: inline-block;
+	padding-left: 0px;
+}
+
+#download_list.slim>.download_object .download_info_status {
+	width: 20%;
+	display: inline-block;
+	float: right;
+}
+
+#download_list.slim>.download_object .download_info {
+	display: block;
+}
+
+.download_object>.download_bar>.queue_icon {
+	margin-left: 8px;
+}
+
+.download_object>.download_bar {
+	display: flex;
+	align-items: center;
+	height: 24px;
+}
+
+.download_object>.download_bar>.progress {
+	margin: 0px;
+}

public/css/modules/globals.css

@@ -0,0 +1,160 @@
+/* Global stuff */
+img.rounded {
+	border-radius: 5px;
+}
+
+img.circle {
+	border-radius: 50%;
+}
+
+.coverart {
+	background-color: var(--secondary-background);
+}
+
+.cover_container {
+	position: relative;
+}
+
+.cover_container .coverart {
+	opacity: 1;
+	display: block;
+	width: 100%;
+	height: auto;
+	transition: .5s ease;
+	backface-visibility: hidden;
+}
+
+.cover_container .download_overlay {
+	transition: .5s ease;
+	opacity: 0;
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	transform: translate(-50%, -50%);
+	-ms-transform: translate(-50%, -50%);
+	text-align: center;
+}
+
+.cover_container .download_overlay i {
+	background-color: #000000;
+	color: white;
+	border-radius: 50%;
+	padding: 10px;
+	cursor: pointer;
+}
+
+.cover_container:hover .coverart {
+	opacity: 0.75
+}
+
+.cover_container:hover .download_overlay {
+	opacity: 1;
+}
+
+span.tag {
+	background-color: var(--tag-background);
+	border-radius: 2px;
+	color: var(--tag-text);
+	display: inline-block;
+	font-size: 10px;
+	padding: 3px 6px;
+}
+
+.tracks_table {
+	width: 100%;
+	-webkit-border-horizontal-spacing: 0px;
+	-webkit-border-vertical-spacing: 0px;
+}
+
+.tracks_table td {
+	padding: 4px 12px 4px 5px;
+	vertical-align: middle;
+	border: 0px black solid;
+}
+
+td img {
+	vertical-align: middle;
+}
+
+.tracks_table tr:nth-child(even) {
+	background-color: var(--secondary-background);
+	border: 0px black solid;
+}
+
+p,
+.tracks_table td.breakline {
+	word-break: break-word;
+}
+
+.clickable {
+	cursor: pointer;
+}
+
+.toastify {
+	display: flex;
+	align-items: center;
+	box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(0, 0, 0, 0.3);
+	background: var(--toast-background);
+	color: var(--toast-text);
+}
+
+.inline-flex {
+	display: flex;
+	align-items: center;
+}
+
+.secondary-text .material-icons {
+	font-size: 17px !important;
+	margin-left: 4px;
+}
+
+button {
+	font-family: inherit;
+	font-weight: 600;
+	font-size: 14px;
+	padding: 0px 8px;
+	margin-right: 8px;
+	height: 36px;
+	background-color: var(--accent-color);
+	border: 0px solid black;
+	border-radius: 4px;
+	min-width: 64px;
+	text-transform: uppercase;
+	color: var(--accent-text);
+}
+
+button[disabled] {
+	background-color: var(--secondary-background);
+	color: var(--main-text);
+	opacity: 0.75;
+}
+
+input[type="text"],
+input[type="password"],
+input[type="number"] {
+	width: calc(100% - 16px);
+	border: 0px solid black;
+	line-height: 36px;
+	padding: 0px 8px;
+	border-radius: 4px;
+	background-color: var(--secondary-background);
+	color: var(--primary-text);
+	margin-bottom: 8px;
+}
+
+.right {
+	float: right;
+}
+
+.fixed_footer footer {
+	position: sticky;
+	display: flex;
+	align-items: center;
+	flex-direction: row;
+	justify-content: flex-end;
+	background-color: var(--main-background);
+	bottom: 0px;
+	height: 64px;
+	width: 100%;
+	margin-top: 24px;
+}

public/css/modules/main-search.css

@@ -0,0 +1,73 @@
+/* Main Search Tab */
+
+.search_tablinks {
+	background-color: var(--main-background);
+	color: var(--main-text);
+}
+
+.search_tablinks.active {
+	background-color: var(--accent-color);
+	color: var(--accent-text);
+}
+
+#main_search>.search_section {
+	float: none;
+}
+
+#search_tab .tab {
+	margin-bottom: 24px;
+}
+
+.top_result {
+	display: flex;
+	align-items: center;
+}
+
+.top_result>.cover_container {
+	width: 156px;
+	height: 156px;
+}
+
+.top_result>.info_box {
+	display: inline-block;
+	padding-left: 24px;
+}
+
+.top_result>.info_box>p,
+.release>p {
+	margin: 0px;
+	margin-bottom: 4px;
+}
+
+.secondary-text {
+	opacity: 0.75;
+	font-size: 14px;
+}
+
+.release_grid {
+	display: grid;
+	grid-template-columns: repeat(auto-fill, minmax(156px, 1fr));
+	grid-gap: 1rem;
+}
+
+.release_grid.firstrow_only {
+	grid-template-rows: 1fr;
+	grid-auto-rows: 0;
+	grid-row-gap: 0px;
+	overflow-y: hidden;
+}
+
+.release {
+	display: inline-block;
+	width: 156px;
+}
+
+.release>.cover_container {
+	width: 156px;
+	height: 156px;
+}
+
+.track_row>td>img {
+	width: 32px;
+	height: 32px;
+}

public/css/modules/middle-section.css

@@ -0,0 +1,67 @@
+/* Middle section */
+#middle_section {
+	background-color: var(--main-background);
+	width: 100%;
+	height: 100%;
+	min-width: 10px;
+}
+
+/* Center section */
+#search>#searchbar {
+	width: calc(100% - 32px);
+	height: 32px;
+	padding: 0px 8px;
+	margin: 8px;
+	border: 0px;
+	border-radius: 6px;
+	background-color: var(--secondary-background);
+	color: var(--primary-text)
+}
+
+#content {
+	background-color: var(--main-background);
+	width: calc(100% - 10px);
+	height: calc(100% - 48px);
+	overflow-y: scroll;
+	overflow-x: hidden;
+	padding-left: 10px
+}
+
+#content::-webkit-scrollbar {
+	width: 10px;
+}
+
+#content::-webkit-scrollbar-track {
+	background: var(--main-background);
+}
+
+#content::-webkit-scrollbar-thumb {
+	background: var(--main-scroll);
+	border-radius: 4px;
+	width: 6px;
+	padding: 0px 2px;
+}
+
+#container {
+	margin: 0 auto;
+	max-width: 1280px;
+	width: 90%;
+}
+
+@media only screen and (min-width: 601px) {
+	#container {
+		width: 85%;
+	}
+}
+
+@media only screen and (min-width: 993px) {
+	#container {
+		width: 70%;
+	}
+}
+
+@media only screen and (max-width: 600px) {
+	#container {
+		width: 100%;
+	}
+}

public/css/modules/settings.css

@@ -0,0 +1,24 @@
+/* Settings */
+#open_login_prompt {
+	margin: 8px 0px;
+}
+
+#login_input_arl {
+	margin-bottom: 0px;
+}
+
+#settings_btn_copyArl {
+	min-width: 24px;
+	width: 48px;
+	margin: 0px 0px 0px 8px;
+	padding: 0px 4px;
+}
+
+#settings_btn_copyArl i {
+	padding: 6px 0px;
+}
+
+#logged_in_info {
+	display: none;
+	margin-bottom: 12px;
+}

public/css/modules/sidebar.css

@@ -0,0 +1,17 @@
+/* Sidebar section selector */
+#sidebar {
+	background-color: var(--panels-background);
+	width: 48px;
+	height: 100%;
+	position: absolute;
+	color: var(--panels-text);
+}
+
+#sidebar > .side_icon {
+	font-size: 24px;
+	padding: 12px;
+}
+
+.side_icon.active {
+	color: var(--accent-color);
+}

public/css/modules/tabs.css

@@ -0,0 +1,5 @@
+/* Tabs */
+.search_tabcontent,
+.main_tabcontent {
+	display: none;
+}

public/css/style.css

@@ -1,444 +1,8 @@
-:root {
+@import 'modules/base.css';
-	--main-background: #ffffff;
+@import 'modules/globals.css';
-  --secondary-background: #eeeeee;
+@import 'modules/sidebar.css';
-	--main-text: #333333;
+@import 'modules/middle-section.css';
-	--main-scroll: #555;
+@import 'modules/tabs.css';
-	--panels-background: #222324;
+@import 'modules/settings.css';
-	--panels-text: #ffffff;
+@import 'modules/main-search.css';
-	--panels-scroll: #2a2c2c;
+@import 'modules/download-tab.css';
-	--accent-color: #0A84FF;
-	--accent-text: #ffffff;
-	--tag-background: #0062c4;
-	--tag-text: #ffffff;
-	--toast-background: #000000dd;
-	--toast-secondary: #ffffff22;
-	--toast-text: #ffffffde;
-}
-
-html{height: 100%;}
-body{margin: 0px;width: 100%;height: 100%;font-family: 'Open Sans'; overflow: hidden; background-color: var(--main-background); color: var(--main-text);}
-
-/* Sidebar section selector */
-aside#sidebar{
-	background-color: var(--panels-background);
-	width: 48px;
-	height: 100%;
-	position: absolute;
-	color: var(--panels-text);
-}
-aside#sidebar > .side_icon{
-	font-size: 24px;
-	padding: 12px;
-}
-.side_icon.active{
-	color: var(--accent-color);
-}
-
-/* Rest of the app */
-main#main_content{
-	margin-left: 48px;
-	width: calc(100% - 48px);
-	height: 100%;
-	display: flex;
-}
-
-/* Middle section */
-div#middle_section {
-  background-color: var(--main-background);
-  width: 100%;
-  height: 100%;
-  min-width: 10px;
-}
-
-/* Center section */
-#search > input#searchbar{
-	width: calc(100% - 32px);
-	height: 32px;
-	padding: 0px 8px;
-	margin: 8px;
-	border: 0px;
-	border-radius: 6px;
-	background-color: var(--secondary-background);
-	color: var(--primary-text)
-}
-#content{
-	background-color: var(--main-background);
-	width: calc(100% - 10px);
-	height: calc(100% - 48px);
-	overflow-y: scroll;
-	overflow-x: hidden;
-	padding-left: 10px
-}
-#content::-webkit-scrollbar {
-  width: 10px;
-}
-
-#content::-webkit-scrollbar-track {
-  background: var(--main-background);
-}
-
-#content::-webkit-scrollbar-thumb {
-  background: var(--main-scroll);
-	border-radius: 4px;
-	width: 6px;
-	padding: 0px 2px;
-}
-
-#container {
-  margin: 0 auto;
-  max-width: 1280px;
-  width: 90%;
-}
-
-@media only screen and (min-width: 601px) {
-  #container {
-    width: 85%;
-  }
-}
-
-@media only screen and (min-width: 993px) {
-  #container {
-    width: 70%;
-  }
-}
-@media only screen and (max-width: 600px){
-	#container {
-	    width: 100%;
-	}
-}
-
-/* Tabs */
-.search_tabcontent, .main_tabcontent {
-  display: none;
-}
-
-/* Settings */
-#open_login_prompt{
-	margin: 8px 0px;
-}
-#login_input_arl{
-	margin-bottom: 0px;
-}
-#settings_btn_copyArl{
-	min-width: 24px;
-	width: 48px;
-	margin: 0px 0px 0px 8px;
-	padding: 0px 4px;
-}
-#settings_btn_copyArl i{
-	padding: 6px 0px;
-}
-#logged_in_info{
-	display: none;
-	margin-bottom: 12px;
-}
-
-/* Main Search Tab */
-
-.search_tablinks{
-	background-color: var(--main-background);
-	color: var(--main-text);
-}
-
-.search_tablinks.active{
-	background-color: var(--accent-color);
-	color: var(--accent-text);
-}
-
-#main_search > .search_section{
-	float: none;
-}
-#search_tab .tab{
-	margin-bottom: 24px;
-}
-
-.top_result {
-	display: flex;
-	align-items:center;
-}
-.top_result > .cover_container {
-	width: 156px;
-	height: 156px;
-}
-.top_result > .info_box {
-	display: inline-block;
-	padding-left: 24px;
-}
-.top_result > .info_box > p, .release > p {
-	margin: 0px;
-	margin-bottom: 4px;
-}
-.secondary-text {
-	opacity: 0.75;
-	font-size: 14px;
-}
-
-.release_grid{
-	display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(156px, 1fr));
-  grid-gap: 1rem;
-}
-
-.release_grid.firstrow_only{
-	grid-template-rows: 1fr;
-	grid-auto-rows: 0;
-	grid-row-gap: 0px;
-	overflow-y: hidden;
-}
-
-.release{
-	display: inline-block;
-	width: 156px;
-}
-.release > .cover_container{
-	width: 156px;
-	height: 156px;
-}
-.track_row > td > img{
-	width: 32px;
-	height: 32px;
-}
-
-/* Download tab section */
-div#download_tab_container{
-  background-color: var(--panels-background);
-	color: var(--panels-text);
-  height: 100%;
-	width: auto;
-	display: flex;
-}
-div#download_tab_bar{
-  height: 100%;
-	width: 32px;
-}
-div#download_tab_bar > label{
-	writing-mode: vertical-rl;
-	line-height: 32px;
-	padding-top: 8px;
-}
-div#download_tab{
-  height: 100%;
-	width: 300px;
-	display: none;
-}
-.download_bar_icon{
-	font-size: 24px;
-	margin: 4px;
-}
-
-#download_list{
-	padding: 0px 8px;
-	height: calc(100% - 32px);
-  overflow-y: scroll;
-}
-#download_list::-webkit-scrollbar {
-  width: 10px;
-}
-#download_list::-webkit-scrollbar-track {
-  background: var(--panels-background);
-}
-#download_list::-webkit-scrollbar-thumb {
-  background: var(--panels-scroll);
-	border-radius: 4px;
-	width: 6px;
-	padding: 0px 2px;
-}
-
-#download_list > .download_object{
-	padding-bottom: 8px;
-}
-
-#download_list > .download_object .download_info{
-	display: flex;
-	align-items: center;
-}
-#download_list > .download_object .download_info img{
-	width: 75px;
-	height: 75px;
-	display: inline-block;
-	flex-shrink: 0;
-}
-#download_list > .download_object .download_info .download_line{
-	display: block;
-}
-#download_list > .download_object .download_info .download_slim_separator{
-	display: none;
-}
-#download_list > .download_object .download_info_data{
-	width: 100%;
-	margin-left: 8px;
-}
-#download_list > .download_object .download_info_status{
-	margin-left: 8px;
-	width: 80px;
-}
-#download_list.slim > .download_object .download_info img{
-	display: none;
-}
-#download_list.slim > .download_object .download_info .download_line{
-	display: inline-block;
-}
-#download_list.slim > .download_object .download_info .download_slim_separator{
-	display: inline-block;
-}
-#download_list.slim > .download_object .download_info_data{
-	width: calc(80% - 16px);
-	display: inline-block;
-	padding-left: 0px;
-}
-#download_list.slim > .download_object .download_info_status{
-	width: 20%;
-	display: inline-block;
-	float: right;
-}
-#download_list.slim > .download_object .download_info{
-	display: block;
-}
-
-.download_object > .download_bar > .queue_icon{
-	margin-left: 8px;
-}
-
-.download_object > .download_bar{
-	display: flex;
-	align-items: center;
-	height: 24px;
-}
-.download_object > .download_bar > .progress{
-	margin: 0px;
-}
-
-/* Global stuff */
-img.rounded {
-	border-radius: 5px;
-}
-img.circle {
-	border-radius: 50%;
-}
-.coverart{
-	background-color: var(--secondary-background);
-}
-.cover_container{
-	position: relative;
-}
-.cover_container .coverart {
-  opacity: 1;
-  display: block;
-  width: 100%;
-  height: auto;
-  transition: .5s ease;
-  backface-visibility: hidden;
-}
-.cover_container .download_overlay {
-  transition: .5s ease;
-  opacity: 0;
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  -ms-transform: translate(-50%, -50%);
-  text-align: center;
-}
-.cover_container .download_overlay i{
-	background-color: #000000;
-	color: white;
-	border-radius: 50%;
-	padding: 10px;
-	cursor: pointer;
-}
-.cover_container:hover .coverart {
-  opacity: 0.75
-}
-.cover_container:hover .download_overlay {
-  opacity: 1;
-}
-span.tag {
-	background-color: var(--tag-background);
-  border-radius: 2px;
-  color: var(--tag-text);
-  display: inline-block;
-  font-size: 10px;
-  padding: 3px 6px;
-}
-.tracks_table{
-	width: 100%;
-	-webkit-border-horizontal-spacing: 0px;
-	-webkit-border-vertical-spacing: 0px;
-}
-.tracks_table td{
-	padding: 4px 12px 4px 5px;
-	vertical-align: middle;
-	border: 0px black solid;
-}
-td img {
-  vertical-align: middle;
-}
-.tracks_table tr:nth-child(even){
-	background-color: var(--secondary-background);
-	border: 0px black solid;
-}
-p, .tracks_table td.breakline{
-  word-break: break-word;
-}
-.clickable{
-	cursor: pointer;
-}
-.toastify{
-	display: flex;
-	align-items:center;
-	box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(0, 0, 0, 0.3);
-	background: var(--toast-background);
-	color: var(--toast-text);
-}
-.inline-flex{
-	display: flex;
-	align-items:center;
-}
-.secondary-text .material-icons{
-	font-size: 17px !important;
-	margin-left: 4px;
-}
-button{
-	font-family : inherit;
-	font-weight: 600;
-	font-size: 14px;
-	padding: 0px 8px;
-	margin-right: 8px;
-	height: 36px;
-	background-color: var(--accent-color);
-	border: 0px solid black;
-	border-radius: 4px;
-	min-width: 64px;
-	text-transform: uppercase;
-	color: var(--accent-text);
-}
-button[disabled]{
-	background-color: var(--secondary-background);
-	color: var(--main-text);
-	opacity: 0.75;
-}
-input[type="text"], input[type="password"], input[type="number"]{
-	width: calc(100% - 16px);
-  border: 0px solid black;
-  line-height: 36px;
-  padding: 0px 8px;
-  border-radius: 4px;
-	background-color: var(--secondary-background);
-	color: var(--primary-text);
-	margin-bottom: 8px;
-}
-.right{
-	float: right;
-}
-.fixed_footer footer{
-	position: sticky;
-	display: flex;
-	align-items: center;
-	flex-direction: row;
-	justify-content: flex-end;
-	background-color: var(--main-background);
-	bottom: 0px;
-	height: 64px;
-	width: 100%;
-	margin-top: 24px;
-}

public/css/vendor/material-icons.css

@@ -3,12 +3,12 @@
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
-   src: url(../fonts/icons/MaterialIcons-Regular.eot); /* For IE6-8 */
+   src: url(../../fonts/icons/MaterialIcons-Regular.eot); /* For IE6-8 */
    src: local('Material Icons'),
         local('MaterialIcons-Regular'),
-        url(../fonts/icons/MaterialIcons-Regular.woff2) format('woff2'),
+        url(../../fonts/icons/MaterialIcons-Regular.woff2) format('woff2'),
-        url(../fonts/icons/MaterialIcons-Regular.woff) format('woff'),
+        url(../../fonts/icons/MaterialIcons-Regular.woff) format('woff'),
-        url(../fonts/icons/MaterialIcons-Regular.ttf) format('truetype');
+        url(../../fonts/icons/MaterialIcons-Regular.ttf) format('truetype');
 }
 
 .material-icons {

public/index.html

@@ -4,18 +4,19 @@
 		<meta charset="utf-8">
 		<title>deemix</title>
 		<link rel="stylesheet" type="text/css" href="/public/css/progressbar.css">
-		<link rel="stylesheet" type="text/css" href="/public/css/animate.css">
+		<link rel="stylesheet" type="text/css" href="/public/css/vendor/animate.css">
-		<link rel="stylesheet" type="text/css" href="/public/css/toastify.css">
+		<link rel="stylesheet" type="text/css" href="/public/css/vendor/toastify.css">
-		<link rel="stylesheet" type="text/css" href="/public/css/material-icons.css"/>
+		<link rel="stylesheet" type="text/css" href="/public/css/vendor/material-icons.css"/>
-		<link rel="stylesheet" type="text/css" href="/public/css/OpenSans.css"/>
+		<link rel="stylesheet" type="text/css" href="/public/css/vendor/OpenSans.css"/>
 		<link rel="stylesheet" type="text/css" href="/public/css/style.css">
-		<link rel="stylesheet" type="text/css" href="/public/css/darkMode.css" name="darkMode" disabled/>
+		<!-- <link rel="stylesheet" type="text/css" href="/public/css/darkMode.css" name="darkMode" disabled/> -->
 		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=0">
-		<script type='text/javascript'>
+		<!-- imho not needed -->
+		<!-- <script type='text/javascript'>
 			if (eval(localStorage.darkMode)){
 				document.getElementsByName("darkMode")[0].removeAttribute("disabled");
 			}
-		</script>
+		</script> -->
 	</head>
 	<body>
 		<aside id="sidebar">