feat: enhance window dimensions and layout in the application

2 files changed, 20 insertions, 14 deletions

diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json
index 2192fab..fc96188 100644
--- a/src-tauri/tauri.conf.json
+++ b/src-tauri/tauri.conf.json
@@ -12,9 +12,11 @@
         "windows": [
             {
                 "title": "Minecraft DropOut Launcher",
-                "width": 375,
-                "height": 300,
-                "resizable": false
+                "width": 1024,
+                "height": 768,
+                "minWidth": 800,
+                "minHeight": 600,
+                "resizable": true
             }
         ],
         "security": {
diff --git a/ui/src/App.svelte b/ui/src/App.svelte
index a648f98..292c719 100644
--- a/ui/src/App.svelte
+++ b/ui/src/App.svelte
@@ -20,28 +20,32 @@
 
 <div class="flex h-screen bg-zinc-900 text-white font-sans overflow-hidden select-none">
   <!-- Sidebar -->
-  <aside class="w-16 lg:w-64 bg-zinc-950 flex flex-col items-center lg:items-start transition-all duration-300 border-r border-zinc-800">
-    <div class="p-6 w-full flex justify-center lg:justify-start">
-        <div class="font-bold text-xl tracking-wider text-indigo-400">DROP<span class="text-white">OUT</span></div>
+  <aside class="w-20 lg:w-64 bg-zinc-950 flex flex-col items-center lg:items-start transition-all duration-300 border-r border-zinc-800 shrink-0">
+    <div class="h-20 w-full flex items-center justify-center lg:justify-start lg:px-6 border-b border-zinc-800/50">
+        <!-- Icon Logo (Visible on small) -->
+        <div class="lg:hidden text-2xl font-black bg-clip-text text-transparent bg-gradient-to-tr from-indigo-400 to-purple-400">D</div>
+        <!-- Full Logo (Visible on large) -->
+        <div class="hidden lg:block font-bold text-xl tracking-wider text-indigo-400">DROP<span class="text-white">OUT</span></div>
     </div>
     
-    <nav class="flex-1 w-full flex flex-col gap-2 p-2">
-      <button class="flex items-center gap-4 w-full text-left px-4 py-3 rounded-lg hover:bg-zinc-800 bg-zinc-800/50 text-zinc-100 transition-colors">
-        <span class="text-xl">🏠</span>
-        <span class="hidden lg:block font-medium">Home</span>
+    <nav class="flex-1 w-full flex flex-col gap-2 p-3">
+      <button class="group flex items-center lg:gap-4 justify-center lg:justify-start w-full px-0 lg:px-4 py-3 rounded-lg hover:bg-zinc-800 bg-zinc-800/50 text-zinc-100 transition-all relative">
+        <span class="text-xl relative z-10">🏠</span>
+        <span class="hidden lg:block font-medium relative z-10 transition-opacity">Home</span>
+        <!-- Tooltip for small screen (optional, simple css approach) -->
       </button>
-      <button class="flex items-center gap-4 w-full text-left px-4 py-3 rounded-lg hover:bg-zinc-800 text-zinc-400 hover:text-zinc-100 transition-colors">
+      <button class="group flex items-center lg:gap-4 justify-center lg:justify-start w-full px-0 lg:px-4 py-3 rounded-lg hover:bg-zinc-800 text-zinc-400 hover:text-zinc-100 transition-all">
         <span class="text-xl">📦</span>
         <span class="hidden lg:block font-medium">Versions</span>
       </button>
-      <button class="flex items-center gap-4 w-full text-left px-4 py-3 rounded-lg hover:bg-zinc-800 text-zinc-400 hover:text-zinc-100 transition-colors">
+      <button class="group flex items-center lg:gap-4 justify-center lg:justify-start w-full px-0 lg:px-4 py-3 rounded-lg hover:bg-zinc-800 text-zinc-400 hover:text-zinc-100 transition-all">
         <span class="text-xl">⚙️</span>
         <span class="hidden lg:block font-medium">Settings</span>
       </button>
     </nav>
     
-    <div class="p-4 w-full border-t border-zinc-800">
-      <div class="text-xs text-center lg:text-left text-zinc-600 font-mono">v0.1.3</div>
+    <div class="p-4 w-full border-t border-zinc-800 flex justify-center lg:justify-start">
+      <div class="text-xs text-zinc-600 font-mono">v0.1.3</div>
     </div>
   </aside>