feat: small UI improvements

oplik0 · Oct 2, 2022 · fe5199f · fe5199f
1 parent a15a87e
commit fe5199f
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 7 deletions.
diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json
@@ -85,8 +85,8 @@
 		"windows": [
 			{
 				"title": "Solo2 Desktop",
-				"width": 800,
-				"height": 600,
+				"width": 1000,
+				"height": 800,
 				"resizable": true,
 				"fullscreen": false,
 				"label": "main",

diff --git a/src/app.css b/src/app.css
@@ -35,6 +35,7 @@ body {
 	box-sizing: border-box;
 	max-width: calc(100vw - 48px);
 	width: 100%;
+	gap: 12px;
 }
 
 a {

diff --git a/src/app.d.ts b/src/app.d.ts
@@ -8,7 +8,7 @@ declare namespace App {
 
 	// interface PageData {}
 
-	// interface PageError {}
+	// interface Error {}
 
 	// interface Platform {}
 }
diff --git a/src/lib/Breadcrumbs.svelte b/src/lib/Breadcrumbs.svelte
@@ -11,11 +11,11 @@
 </script>
 
 <header>
-	<TextBlock variant="title" class="breadcrumb-text"
+	<TextBlock variant="title" class="breadcrumb-text {$page.url?.pathname === "/" ? "current-link" : ""}"
 		><a href="/">Key List</a></TextBlock
 	>
 
-	{#each $page.url?.pathname?.split("/")?.slice(1) ?? [] as breadcrumb}
+	{#each Object.entries($page.url?.pathname?.split("/")?.slice(1) ?? []) as [i, breadcrumb]}
 		{#if breadcrumb.length > 0}
 			<svg
 				width="16"
@@ -28,7 +28,7 @@
 					d="M8.293 4.293a1 1 0 0 0 0 1.414L14.586 12l-6.293 6.293a1 1 0 1 0 1.414 1.414l7-7a1 1 0 0 0 0-1.414l-7-7a1 1 0 0 0-1.414 0Z"
 				/>
 			</svg>
-			<TextBlock variant="title" class="breadcrumb-text breadcrumb-text-next">
+			<TextBlock variant="title" class="breadcrumb-text breadcrumb-text-next {$page.url?.pathname?.split("/").length - 2 === parseInt(i, 10) ? "current-link" : ""}" >
 				<a href={extractRoute($page?.url?.pathname, breadcrumb)}>
 					{breadcrumb}
 				</a>
@@ -69,9 +69,15 @@
 		padding: 0 12px;
 	}
 	a {
-		color: var(--fds-text-primary);
+		color: var(--fds-text-secondary);
+		cursor: default;
 	}
 	a:hover {
 		text-decoration: none;
+		color: var(--fds-text-primary);
+		cursor: default;
+	}
+	:global(.current-link > a) {
+		color: var(--fds-text-primary);
 	}
 </style>
diff --git a/src/lib/Nav.svelte b/src/lib/Nav.svelte
@@ -38,5 +38,6 @@
 		grid-column-end: 2;
 		width: 100%;
 		grid-area: nav;
+		margin: 12px;
 	}
 </style>