get back styles

Author: Kvarkas

src/routes/+layout.svelte

@@ -64,8 +64,28 @@
 		href="{assets}/favicon/site.webmanifest" 
 	/>
 
+	<!-- Bootstrap CSS -->
+	<link
+		rel="stylesheet"
+		href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/css/bootstrap.min.css"
+		integrity="sha384-LN+7fdVzj6u52u30Kp6M/trliBMCMKTyK833zpbD+pXdCLuTusPj697FH4R/5mcr"
+		crossorigin="anonymous" />
 
+	<!-- Bootstrap Icons -->
+	<link
+		rel="stylesheet"
+		href="https://bootswatch.com/_vendor/bootstrap-icons/font/bootstrap-icons.min.css"
+		integrity="sha384-CK2SzKma4jA5H/MXDUU7i1TqZlCFaD4T01vtyDFvPlD97JQyS+IsSh1nI2EFbpyk"
+		crossorigin="anonymous" 
+	/>	
 
+	<!-- Bootswatch: Darkly theme -->
+	<link
+		rel="stylesheet"
+		href="https://bootswatch.com/5/darkly/bootstrap.css"
+		integrity="sha384-mXM+8P9BUwTXMBS6pzZaBva0g/sZsdn7ZdBimWWpF/1K2kVhkyjQrBznOTf31ui7"
+		crossorigin="anonymous" />
+
 	<!-- Preload for faster execution -->
   	<link 
 		rel="preload" 
@@ -78,6 +98,13 @@
 		src="{base}/js/theme-loader.js" 
 		async>
 	</script>
+
+	<!-- Bootstrap JS -->
+	<script 
+		src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/js/bootstrap.min.js" 
+		integrity="sha384-7qAoOXltbVP82dhxHAUje59V5r2YsVfBafyUDxEdApLPmcdhBPg1DKg1ERo0BZlK" 
+		crossorigin="anonymous">
+	</script>
 
 </svelte:head>
 

src/routes/+page.svelte

@@ -2,7 +2,7 @@
 	import { base } from '$app/paths';
 </script>
 
-<section class="" id="home">
+<section class="d-flex flex-column align-items-center" id="home">
 	<p>mRemoteNG (Multi-Remote Next Generation), abbreviated as mR, is an open-source, tabbed remote connections manager for Windows.</p>
 	<p>It allows you to view all of your remote connections in a simple yet powerful interface and supports multiple protocols including RDP, VNC, SSH, HTTP/S and more.</p>
 	<p>

static/js/theme-loader.js

@@ -5,13 +5,13 @@
     document.documentElement.setAttribute('data-bs-theme', theme);
 
     if (theme === 'dark') {
-      const darkThemeLink = document.createElement('link');
-      darkThemeLink.rel = 'stylesheet';
-      darkThemeLink.href = '/css/darkly.css';
-      darkThemeLink.integrity = 'sha384-mXM+8P9BUwTXMBS6pzZaBva0g/sZsdn7ZdBimWWpF/1K2kVhkyjQrBznOTf31ui7';
-      darkThemeLink.crossOrigin = 'anonymous';
-      darkThemeLink.setAttribute('data-theme', 'dark');
-      document.head.appendChild(darkThemeLink);
+      //const darkThemeLink = document.createElement('link');
+      //darkThemeLink.rel = 'stylesheet';
+      //darkThemeLink.href = '/css/darkly.css';
+      //darkThemeLink.integrity = 'sha384-mXM+8P9BUwTXMBS6pzZaBva0g/sZsdn7ZdBimWWpF/1K2kVhkyjQrBznOTf31ui7';
+      //darkThemeLink.crossOrigin = 'anonymous';
+      //darkThemeLink.setAttribute('data-theme', 'dark');
+      //document.head.appendChild(darkThemeLink);
     }
   } catch (e) {
     console.error('Theme error:', e);