Fix sidebar layout (#204)

* fix: sidebar margins with more than one item incorrect

* fix: api url in sidebar shouldn't overflow the sidebar width

web/src/lib/components/shared/status-box.svelte

@@ -77,9 +77,7 @@
 		<div class="text-xs">
 			<p class="text-sm font-medium text-immich-primary">Server</p>
 
-			<div class="border p-2 rounded-md bg-gray-200 mt-2">
-				<p class="text-immich-primary font-medium">{endpoint}</p>
-			</div>
+			<input class="border p-2 rounded-md bg-gray-200 mt-2 text-immich-primary font-medium" value="{endpoint}" disabled="true">
 			<div class="flex justify-items-center justify-between mt-2">
 				<p>Status</p>
 

web/src/routes/admin/index.svelte

@@ -75,7 +75,7 @@
 {/if}
 
 <section class="grid grid-cols-[250px_auto] relative pt-[72px] h-screen">
-	<section id="admin-sidebar" class="pt-8 pr-6 flex flex-col justify-between">
+	<section id="admin-sidebar" class="pt-8 pr-6 flex flex-col">
 		<SideBarButton
 			title="User"
 			logo={AccountMultipleOutline}
@@ -84,7 +84,7 @@
 			on:selected={onButtonClicked}
 		/>
 
-		<div class="mb-6">
+		<div class="mb-6 mt-auto">
 			<StatusBox />
 		</div>
 	</section>

web/src/routes/photos/index.svelte

@@ -92,7 +92,7 @@
 
 <section class="grid grid-cols-[250px_auto] relative pt-[72px] h-screen">
 	<!-- Sidebar -->
-	<section id="admin-sidebar" class="flex flex-col justify-between gap-4 pt-8 pr-6">
+	<section id="sidebar" class="flex flex-col gap-4 pt-8 pr-6">
 		<SideBarButton
 			title="Photos"
 			logo={ImageOutline}
@@ -103,7 +103,7 @@
 
 		<!-- Status Box -->
 
-		<div class="mb-6">
+		<div class="mb-6 mt-auto">
 			<StatusBox />
 		</div>
 	</section>