src/frontend/partials/controls.eta.html

@@ -126,7 +126,7 @@
 							data-bs-target="#collapseSettingsStorages"
 							aria-expanded="<%= it.active == 'SETT_STORE' ? 'true' : 'false'%>"
 							aria-controls="collapseSettingsStorages">
-							<i class="bi bi-caret-left-fill dropdownIndicator" data-ref-target="#collapseSettingsStorages"></i>
+							<i class="bi bi-caret-left-fill dropdownIndicator"></i>
 						</span>
 					</a>
 
@@ -159,18 +159,20 @@
 						<a class="nav-link ms-4 <%= it.active == 'SETT_IMPORT_JSON' ? 'active' : ''%>" href="/manage/import/json"> <i class="bi bi-filetype-json"></i> JSON Import</a>
 					</div>
 				</ul>
+				
 			</div>
 			<!-- Align the mode picker at the bottom of the navbar -->
 
 			<ul class="nav flex-column mb-2 position-absolute bottom-0 align-items-center w-100">
 				<div class="input-group mb-3 justify-content-center w-100">
-					<label class="btn btn-secondary" for="mode_light"><i class="bi bi-brightness-high"></i></label>
-					<input type="radio" class="btn-check" name="options" id="mode_light" autocomplete="off" />
 					
-					<input type="radio" class="btn-check" name="options" id="mode_auto" autocomplete="off" checked />
+					<label class="btn btn-secondary" for="mode_light"><i class="bi bi-brightness-high"></i></label>
+					<input type="radio" class="btn-check" name="options" id="mode_light" autocomplete="off" >
+	
+					<input type="radio" class="btn-check" name="options" id="mode_auto" autocomplete="off" checked>
 					<label class="btn btn-secondary" for="mode_auto"><i class="bi bi-magic"></i></label>
 	
-					<input type="radio" class="btn-check" name="options" id="mode_dark" autocomplete="off" />
+					<input type="radio" class="btn-check" name="options" id="mode_dark" autocomplete="off">
 					<label class="btn btn-secondary" for="mode_dark"><i class="bi bi-moon"></i></label>
 				</div>
 				<script>
@@ -187,21 +189,20 @@
 					}
 					modeLight.addEventListener('click', () => {
 						localStorage.setItem('bs.theme', 'light');
-						updateColorMode()
-						//document.documentElement.setAttribute('data-bs-theme', 'light');
+						document.documentElement.setAttribute('data-bs-theme', 'light');
 					});
 					modeAuto.addEventListener('click', () => {
 						localStorage.setItem('bs.theme', 'auto');
-						updateColorMode()
-						//document.documentElement.setAttribute('data-bs-theme', 'auto');
+						document.documentElement.setAttribute('data-bs-theme', 'auto');
 					});
 					modeDark.addEventListener('click', () => {
 						localStorage.setItem('bs.theme', 'dark');
-						updateColorMode()
-						//document.documentElement.setAttribute('data-bs-theme', 'dark');
+						document.documentElement.setAttribute('data-bs-theme', 'dark');
 					});
 				</script>
-			</ul>
+		</ul>
+			
+			      
 		</nav>
 
 		<main class="col-md-9 ms-sm-auto col-lg-10 px-md-4" style="min-height: 100%">

static/css/dashboard.css

@@ -108,16 +108,9 @@ body {
 	transform: rotate(-90deg) !important;
 	transition: 0.5s;
 }
-.derotate {
-	transform: rotate(0deg) !important;
-	transition: 0.5s;
-}
-.derotate::before {
-	transform: rotate(0deg) !important;
-	transition: 0.5s;
-}
+
 .dropdownIndicator {
-	transition: all 0.5s;
+	transition: 0.5s;
 }
 
 

static/js/handleSidebarTriangles.js

@@ -1,22 +1,18 @@
 const trinagles = $('.dropdownIndicator');
-console.log(`Found ${trinagles.length} triangles`)
-
+//const containers = $('');
 
 trinagles.each(function () {
 	var target = $(this.dataset.refTarget);
-	var triTar = $(this);
-	// Apply rotate if target is open
-	if (target.hasClass('show')) {
-		$(this).addClass('rotate');
-	}
-
-	console.log('target', target);
 	target.on('show.bs.collapse', function () {
-		$(triTar).addClass('rotate');
-		$(triTar).removeClass('derotate');
+		//$(this).parent.addClass('rotate');
+		 $(this).parent().find('.dropdownIndicator').addClass('rotate');
+		 console.log($(this).parent().find('.dropdownIndicator'));
+		console.log('show');
 	});
 	target.on('hide.bs.collapse', function () {
-		$(triTar).removeClass('rotate');
-		$(triTar).addClass('derotate');
+		//$(this).parent.removeClass('rotate');
+		 $(this).parent().find('.dropdownIndicator').removeClass('rotate');
+		console.log('hide');
 	});
+	// bootstrap.Collapse.getOrCreateInstance(document.querySelector(this.dataset.refTarget))
 });

static/js/normalizeToast.js

@@ -0,0 +1,8 @@
+function normalizeToast(){
+	console.warn("Something is using the deprecated function normalizeToast(). Please use createNewToast() instead.")
+	$('#generalToast').removeClass('text-bg-primary');
+	$('#generalToast').removeClass('text-bg-success');
+	$('#generalToast').removeClass('text-bg-danger');
+	$('#generalToast').removeClass('text-bg-warning');
+	$('#generalToast').removeClass('text-bg-info');
+}

static/js/toastHandler.js

@@ -1,13 +1,5 @@
 const currentToasts = [];
 
-/**
- * Generic function to create a new toast
- * @param {String} message The message to be displayed
- * @param {String} colorSelector The bootstrap color selector class, can be one of the following: text-bg-primary, text-bg-success, text-bg-danger, text-bg-warning, text-bg-info
- * @param {Number} autoHideTime  The time in milliseconds to auto hide the toast, default is 3000
- * @param {Boolean} autoReload Should the page reload after the toast is hidden, default is true (for compatibility with old code)
- * @returns {String} The id of the created toast, format: toast-<number>
- */
 function createNewToast(message, colorSelector, autoHideTime = 3000, autoReload = true){
 	const targetContainer = document.getElementById('toastMainController');
 	const masterToast = document.getElementById('masterToast');
@@ -25,26 +17,11 @@ function createNewToast(message, colorSelector, autoHideTime = 3000, autoReload
 			location.reload();
 		}
 	}, autoHideTime);
-	return newToast.id;
 }
 
-/**
- * Generic function to destroy a toast
- * @param {String} id The id of the toast to destroy
- */
 function destroyToast(id){
 	const targetContainer = document.getElementById('toastMainController');
 	const targetToast = document.getElementById(id);
 	targetContainer.removeChild(targetToast);
 	currentToasts.splice(currentToasts.indexOf(targetToast), 1);
 }
-
-// Moved here
-function normalizeToast(){
-	console.warn("Something is using the deprecated function normalizeToast(). Please use createNewToast() instead.")
-	$('#generalToast').removeClass('text-bg-primary');
-	$('#generalToast').removeClass('text-bg-success');
-	$('#generalToast').removeClass('text-bg-danger');
-	$('#generalToast').removeClass('text-bg-warning');
-	$('#generalToast').removeClass('text-bg-info');
-}