From f073d01a5f819ad209f6d78ee3ccd7c5fa436113 Mon Sep 17 00:00:00 2001
From: Tim Koch <me@timkoch.dev>
Date: Sun, 27 Oct 2024 12:24:34 +0100
Subject: [PATCH] Give more space to navbar

Especially in full width and mobile view, the navbar looked cramped
because there was very little padding to the left end of the screen.
This commit adds horizontal padding to the navbar
and increases its width from 48 to 56 tailwind units.
---
 resources/views/components/navbar.blade.php | 2 +-
 resources/views/layouts/app.blade.php       | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/resources/views/components/navbar.blade.php b/resources/views/components/navbar.blade.php
index 460b9350b..2f908fc81 100644
--- a/resources/views/components/navbar.blade.php
+++ b/resources/views/components/navbar.blade.php
@@ -1,4 +1,4 @@
-<nav class="flex flex-col flex-1 bg-white border-r dark:border-coolgray-200 dark:bg-base" x-data="{
+<nav class="flex flex-col flex-1 px-2 bg-white border-r dark:border-coolgray-200 dark:bg-base" x-data="{
     switchWidth() {
             if (this.full === 'full') {
                 localStorage.setItem('pageWidth', 'center');
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index e0f044353..47ea71ecc 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -18,7 +18,7 @@
             <div class="relative z-50 lg:hidden" :class="open ? 'block' : 'hidden'" role="dialog" aria-modal="true">
                 <div class="fixed inset-0 bg-black/80"></div>
                 <div class="fixed inset-0 flex">
-                    <div class="relative flex flex-1 w-full mr-16 max-w-48 ">
+                    <div class="relative flex flex-1 w-full mr-16 max-w-56 ">
                         <div class="absolute top-0 flex justify-center w-16 pt-5 left-full">
                             <button type="button" class="-m-2.5 p-2.5" x-on:click="open = !open">
                                 <span class="sr-only">Close sidebar</span>
@@ -29,14 +29,14 @@
                             </button>
                         </div>
 
-                        <div class="flex flex-col pb-2 overflow-y-auto min-w-48 dark:bg-coolgray-100 gap-y-5 scrollbar">
+                        <div class="flex flex-col pb-2 overflow-y-auto min-w-56 dark:bg-coolgray-100 gap-y-5 scrollbar">
                             <x-navbar />
                         </div>
                     </div>
                 </div>
             </div>
 
-            <div class="hidden lg:fixed lg:inset-y-0 lg:z-50 lg:flex lg:w-48 lg:flex-col">
+            <div class="hidden lg:fixed lg:inset-y-0 lg:z-50 lg:flex lg:w-56 lg:flex-col">
                 <div class="flex flex-col overflow-y-auto grow gap-y-5 scrollbar">
                     <x-navbar />
                 </div>
@@ -52,7 +52,7 @@
                 </button>
             </div>
 
-            <main class="lg:pl-48">
+            <main class="lg:pl-56">
                 <div class="p-4 sm:px-6 lg:px-8 lg:py-6">
                     {{ $slot }}
                 </div>