navbar changed in order top move as first element the button for start/redeploy

resources/css/app.css

@@ -157,7 +157,7 @@ tr td:first-child {
 }
 
 .menu-item {
-    @apply flex items-center w-full gap-3 py-1 px-2 sm:pr-0 dark:hover:bg-coolgray-100 dark:hover:text-white hover:bg-neutral-300;
+    @apply flex items-center text-sm w-full gap-3 py-1 px-2 sm:pr-0 dark:hover:bg-coolgray-100 dark:hover:text-white hover:bg-neutral-300;
 }
 
 .menu-item-active {
@@ -185,7 +185,7 @@ tr td:first-child {
 }
 
 .navbar-main {
-    @apply flex items-center h-fit gap-6 pb-2 border-b-2 border-solid dark:border-coolgray-200 overflow-x-scroll min-h-10;
+    @apply flex h-fit flex-col sm:flex-row justify-items-start sm:justify-between gap-4 pb-2 border-b-2 border-solid dark:border-coolgray-200 sm:items-center;
 }
 
 .loading {

resources/views/components/notification/navbar.blade.php

@@ -1,7 +1,8 @@
 <div class="pb-6">
     <h1>Notifications</h1>
     <div class="subtitle">Get notified about your infrastructure.</div>
-    <nav class="navbar-main">
+    <div class="navbar-main">
+        <nav class="flex gap-4 overflow-x-scroll items-center">
             <a class="{{ request()->routeIs('notifications.email') ? 'dark:text-white' : '' }}"
                 href="{{ route('notifications.email') }}">
                 <button>Email</button>
@@ -16,3 +17,4 @@
             </a>
         </nav>
     </div>
+</div>

resources/views/components/security/navbar.blade.php

@@ -1,7 +1,8 @@
 <div class="pb-6">
     <h1>Security</h1>
     <div class="subtitle">Security related settings.</div>
-    <nav class="navbar-main">
+    <div class="navbar-main">
+        <nav class="flex gap-4 overflow-x-scroll items-center">
             <a href="{{ route('security.private-key.index') }}">
                 <button>Private Keys</button>
             </a>
@@ -10,3 +11,4 @@
             </a>
         </nav>
     </div>
+</div>

resources/views/components/server/navbar.blade.php

@@ -5,7 +5,8 @@
         <livewire:server.proxy.status :server="$server" />
     </div>
     <div class="subtitle">{{ data_get($server, 'name') }}.</div>
-    <nav class="navbar-main">
+    <div class="navbar-main">
+        <nav class="flex gap-4 overflow-x-scroll items-center">
             <a class="{{ request()->routeIs('server.show') ? 'dark:text-white' : '' }}"
                 href="{{ route('server.show', [
                     'server_uuid' => data_get($parameters, 'server_uuid'),
@@ -44,8 +45,9 @@
                     <button>Log Drains</button>
                 </a>
             @endif
-
-        <div class="flex-1"></div>
-        <livewire:server.proxy.deploy :server="$server" />
         </nav>
+        <div class="order-first sm:order-last">
+            <livewire:server.proxy.deploy :server="$server" />
+        </div>
+    </div>
 </div>

resources/views/components/settings/navbar.blade.php

@@ -1,7 +1,8 @@
 <div class="pb-5">
     <h1>Settings</h1>
     <div class="subtitle">Instance wide settings for Coolify.</div>
-    <nav class="navbar-main">
+    <div class="navbar-main">
+        <nav class="flex gap-4 overflow-x-scroll items-center">
             <a class="{{ request()->routeIs('settings.index') ? 'dark:text-white' : '' }}"
                 href="{{ route('settings.index') }}">
                 <button>Configuration</button>
@@ -15,3 +16,4 @@
             <div class="flex-1"></div>
         </nav>
     </div>
+</div>

resources/views/components/team/navbar.blade.php

@@ -6,7 +6,8 @@
         </x-modal-input>
     </div>
     <div class="subtitle">Team wide configurations.</div>
-    <nav class="navbar-main">
+    <div class="navbar-main">
+        <nav class="flex gap-4 overflow-x-scroll items-center">
             <a class="{{ request()->routeIs('team.index') ? 'dark:text-white' : '' }}" href="{{ route('team.index') }}">
                 <button>General</button>
             </a>
@@ -17,3 +18,4 @@
             <div class="flex-1"></div>
         </nav>
     </div>
+</div>

resources/views/livewire/project/application/general.blade.php

@@ -116,7 +116,7 @@
             @if ($application->build_pack !== 'dockerimage')
                 <h3 class="pt-8">Build</h3>
                 @if ($application->build_pack !== 'dockercompose')
-                    <div class="w-96">
+                    <div class="max-w-96">
                         <x-forms.checkbox
                             helper="Use a build server to build your application. You can configure your build server in the Server settings. This is experimental. For more info, check the <a href='https://coolify.io/docs/knowledge-base/server/build-server' class='underline' target='_blank'>documentation</a>."
                             instantSave id="application.settings.is_build_server_enabled"

resources/views/livewire/project/application/heading.blade.php

@@ -1,6 +1,7 @@
 <nav wire:poll.5000ms="check_status">
     <x-resources.breadcrumbs :resource="$application" :parameters="$parameters" />
     <div class="navbar-main">
+        <nav class="flex gap-4 overflow-x-scroll items-center">
             <a href="{{ route('project.application.configuration', $parameters) }}">
                 Configuration
             </a>
@@ -16,8 +17,8 @@
                 </a>
             @endif
             <x-applications.links :application="$application" />
-        <div class="flex-1"></div>
-        <div class="flex items-center gap-2">
+        </nav>
+        <div class="flex items-center gap-2 order-first sm:order-last">
             @if ($application->build_pack === 'dockercompose' && is_null($application->docker_compose_raw))
                 <div>Please load a Compose file.</div>
             @else
@@ -100,6 +101,7 @@
                 </div>
             @endif
         </div>
+
     </div>
     @script
         <script>

resources/views/livewire/project/database/heading.blade.php

@@ -7,6 +7,7 @@
         </x-slot:content>
     </x-slide-over>
     <div class="navbar-main">
+        <nav class="flex gap-4 overflow-x-scroll items-center">
             <a class="{{ request()->routeIs('project.database.configuration') ? 'dark:text-white' : '' }}"
                 href="{{ route('project.database.configuration', $parameters) }}">
                 <button>Configuration</button>
@@ -29,7 +30,8 @@
                     <button>Backups</button>
                 </a>
             @endif
-        <div class="flex-1"></div>
+        </nav>
+        <div class="flex items-center gap-2 order-first sm:order-last">
             @if (!str($database->status)->startsWith('exited'))
                 <x-modal-confirmation @click="$wire.dispatch('stopEvent')">
                     <x-slot:button-title>
@@ -70,4 +72,5 @@
                 </script>
             @endscript
         </div>
+    </div>
 </nav>

resources/views/livewire/project/service/navbar.blade.php

@@ -9,13 +9,14 @@
     <h1>Configuration</h1>
     <x-resources.breadcrumbs :resource="$service" :parameters="$parameters" />
     <div class="navbar-main" x-data>
+        <nav class="flex gap-4 overflow-x-scroll items-center">
             <a class="{{ request()->routeIs('project.service.configuration') ? 'dark:text-white' : '' }}"
                 href="{{ route('project.service.configuration', $parameters) }}">
                 <button>Configuration</button>
             </a>
             <x-services.links :service="$service" />
-        <div class="flex-1"></div>
-        <div class="flex gap-2">
+        </nav>
+        <div class="flex gap-2 order-first sm:order-last">
             @if (str($service->status())->contains('running'))
                 <button @click="$wire.dispatch('restartEvent')" class="gap-2 button">
                     <svg class="w-5 h-5 dark:text-warning" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">