UI overhaul, import fixes, fix user store

svelte/src/layout/IconBlock.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 let {
 	icon_href = "",
-	width = "750px",
+	width = "800px",
 	children
 }: {
 	icon_href?: string;
@@ -12,7 +12,7 @@ let {
 
 <div class="block" style="width: {width}; max-width: 100%">
 	<img src={icon_href} alt="File icon" class="icon">
-	<div class="description">
+	<div class="description bubble">
 		{@render children?.()}
 	</div>
 </div>
@@ -47,5 +47,6 @@ let {
 	background-color: var(--shaded_background);
 	backdrop-filter: blur(4px);
 	padding: 8px;
+	margin: 0;
 }
 </style>

svelte/src/layout/TextBlock.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 let {
-	width = "750px",
+	width = "800px",
 	center = false,
 	children
 }: {
@@ -10,17 +10,25 @@ let {
 } = $props();
 </script>
 
-<div class="block" class:center style="width: {width};">
-	{@render children?.()}
+<div class="width_container">
+	<div class="block bubble" class:center style="width: {width};">
+		{@render children?.()}
+	</div>
 </div>
 
 <style>
+.width_container {
+	display: flex;
+	justify-content: center;
+	width: 100%;
+	margin: auto;
+}
 .block {
 	display: block;
 	text-align: initial;
 	max-width: 100%;
 	overflow-wrap: anywhere;
-	margin: auto;
+	/* margin: auto; */
 
 	background-color: var(--shaded_background);
 	backdrop-filter: blur(4px);