From b58a3bf2091be96763897f53fea6576ac0fb9474 Mon Sep 17 00:00:00 2001
From: Andras Bacsai <andras.bacsai@gmail.com>
Date: Thu, 18 May 2023 13:26:35 +0200
Subject: [PATCH] css and stuffs

---
 .../Livewire/Project/Application/Danger.php   |  9 ++
 .../Application/EnvironmentVariable/Show.php  |  3 -
 .../Livewire/Project/Application/Rollback.php |  1 +
 .../Project/Application/Storages/All.php      |  1 -
 app/Http/Livewire/Source/Github/Change.php    |  2 +
 package-lock.json                             | 11 ++-
 package.json                                  |  3 +-
 resources/css/app.css                         | 45 +++++----
 resources/views/auth/login.blade.php          |  2 +-
 resources/views/auth/register.blade.php       |  2 +-
 .../components/applications/navbar.blade.php  | 10 +-
 .../views/components/confirm-modal.blade.php  |  2 +-
 .../views/components/external-link.blade.php  |  1 +
 .../views/components/inputs/button.blade.php  | 29 ++++--
 .../components/inputs/checkbox.blade.php      | 11 +--
 .../views/components/inputs/input.blade.php   | 11 ++-
 .../views/components/inputs/select.blade.php  |  2 +-
 .../components/inputs/textarea.blade.php      |  5 +-
 resources/views/components/layout.blade.php   |  7 +-
 .../views/components/naked-modal.blade.php    | 19 ++--
 resources/views/components/navbar.blade.php   | 20 ++--
 .../views/livewire/destination/form.blade.php |  4 +-
 .../new/standalone-docker.blade.php           |  2 +-
 .../livewire/private-key/change.blade.php     |  6 +-
 .../livewire/private-key/create.blade.php     |  2 +-
 .../project/application/danger.blade.php      |  5 +
 .../project/application/deploy.blade.php      |  8 +-
 .../project/application/destination.blade.php |  2 +-
 .../environment-variable/add.blade.php        |  4 +-
 .../environment-variable/all.blade.php        |  2 +-
 .../environment-variable/show.blade.php       |  6 +-
 .../project/application/general.blade.php     | 75 +++++++-------
 .../application/resource-limits.blade.php     | 12 +--
 .../project/application/rollback.blade.php    |  6 +-
 .../project/application/source.blade.php      | 11 ++-
 .../application/storages/add.blade.php        |  2 +-
 .../application/storages/all.blade.php        |  2 +-
 .../application/storages/show.blade.php       |  4 +-
 .../views/livewire/project/delete.blade.php   |  4 +-
 .../views/livewire/run-command.blade.php      |  2 +-
 .../views/livewire/server/form.blade.php      | 16 +--
 .../views/livewire/server/new/by-ip.blade.php |  2 +-
 .../views/livewire/server/proxy.blade.php     | 15 +--
 .../livewire/source/github/change.blade.php   | 99 ++++++++++++++++---
 .../views/livewire/switch-team.blade.php      |  2 +-
 .../application/configuration.blade.php       | 14 ++-
 resources/views/server/show.blade.php         |  4 +-
 resources/views/source/github/show.blade.php  | 66 +------------
 tailwind.config.js                            |  6 +-
 49 files changed, 327 insertions(+), 252 deletions(-)
 create mode 100644 app/Http/Livewire/Project/Application/Danger.php
 create mode 100644 resources/views/components/external-link.blade.php
 create mode 100644 resources/views/livewire/project/application/danger.blade.php

diff --git a/app/Http/Livewire/Project/Application/Danger.php b/app/Http/Livewire/Project/Application/Danger.php
new file mode 100644
index 000000000..0a2f59d34
--- /dev/null
+++ b/app/Http/Livewire/Project/Application/Danger.php
@@ -0,0 +1,9 @@
+<?php
+
+namespace App\Http\Livewire\Project\Application;
+
+use Livewire\Component;
+
+class Danger extends Component
+{
+}
diff --git a/app/Http/Livewire/Project/Application/EnvironmentVariable/Show.php b/app/Http/Livewire/Project/Application/EnvironmentVariable/Show.php
index 67f2c1e77..f09df0e49 100644
--- a/app/Http/Livewire/Project/Application/EnvironmentVariable/Show.php
+++ b/app/Http/Livewire/Project/Application/EnvironmentVariable/Show.php
@@ -2,10 +2,7 @@
 
 namespace App\Http\Livewire\Project\Application\EnvironmentVariable;
 
-use App\Models\Application;
 use App\Models\EnvironmentVariable as ModelsEnvironmentVariable;
-use Illuminate\Support\Facades\Request;
-use Illuminate\Support\Facades\Route;
 use Livewire\Component;
 
 class Show extends Component
diff --git a/app/Http/Livewire/Project/Application/Rollback.php b/app/Http/Livewire/Project/Application/Rollback.php
index df166b25c..68658e0b3 100644
--- a/app/Http/Livewire/Project/Application/Rollback.php
+++ b/app/Http/Livewire/Project/Application/Rollback.php
@@ -17,6 +17,7 @@ public function revertImage($tag)
     }
     public function loadImages()
     {
+        sleep(2);
         try {
             $image = $this->application->uuid;
             $output = instantRemoteProcess([
diff --git a/app/Http/Livewire/Project/Application/Storages/All.php b/app/Http/Livewire/Project/Application/Storages/All.php
index e48111614..a8606c175 100644
--- a/app/Http/Livewire/Project/Application/Storages/All.php
+++ b/app/Http/Livewire/Project/Application/Storages/All.php
@@ -4,7 +4,6 @@
 
 use App\Models\Application;
 use App\Models\LocalPersistentVolume;
-use Illuminate\Database\QueryException;
 use Livewire\Component;
 
 class All extends Component
diff --git a/app/Http/Livewire/Source/Github/Change.php b/app/Http/Livewire/Source/Github/Change.php
index 0121d73db..a01a0a1a4 100644
--- a/app/Http/Livewire/Source/Github/Change.php
+++ b/app/Http/Livewire/Source/Github/Change.php
@@ -11,6 +11,8 @@ class Change extends Component
     public string $host;
     public $parameters;
     public GithubApp $github_app;
+    public string $installation_url;
+    public string $name;
     public bool $is_system_wide;
 
     protected $rules = [
diff --git a/package-lock.json b/package-lock.json
index d8f6ab89e..d588e33db 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7,7 +7,8 @@
             "dependencies": {
                 "@tailwindcss/typography": "^0.5.9",
                 "alpinejs": "3.12.0",
-                "daisyui": "^2.51.6"
+                "daisyui": "^2.51.6",
+                "tailwindcss-scrollbar": "^0.1.0"
             },
             "devDependencies": {
                 "@vitejs/plugin-vue": "^4.0.0",
@@ -1883,6 +1884,14 @@
                 "postcss": "^8.0.9"
             }
         },
+        "node_modules/tailwindcss-scrollbar": {
+            "version": "0.1.0",
+            "resolved": "https://registry.npmjs.org/tailwindcss-scrollbar/-/tailwindcss-scrollbar-0.1.0.tgz",
+            "integrity": "sha512-egipxw4ooQDh94x02XQpPck0P0sfwazwoUGfA9SedPATIuYDR+6qe8d31Gl7YsSMRiOKDkkqfI0kBvEw9lT/Hg==",
+            "peerDependencies": {
+                "tailwindcss": ">= 2.x.x"
+            }
+        },
         "node_modules/thenify": {
             "version": "3.3.1",
             "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz",
diff --git a/package.json b/package.json
index 21fb9c605..81441de95 100644
--- a/package.json
+++ b/package.json
@@ -17,6 +17,7 @@
     "dependencies": {
         "@tailwindcss/typography": "^0.5.9",
         "alpinejs": "3.12.0",
-        "daisyui": "^2.51.6"
+        "daisyui": "^2.51.6",
+        "tailwindcss-scrollbar": "^0.1.0"
     }
 }
diff --git a/resources/css/app.css b/resources/css/app.css
index 0be962822..a8de249c8 100644
--- a/resources/css/app.css
+++ b/resources/css/app.css
@@ -2,32 +2,43 @@
 @tailwind components;
 @tailwind utilities;
 
+* {
+@apply scrollbar-thumb-yellow-400 scrollbar-track-coolgray-200 scrollbar-w-1;
+}
+html {
+    @apply h-full min-h-full bg-coolgray-100 ;
+}
 body {
-    @apply bg-coolgray-100 text-white;
+    @apply bg-coolgray-100 text-white min-h-full antialiased;
+}
+input[type="checkbox"] {
+    @apply toggle toggle-warning toggle-sm;
 }
 input {
-    @apply input w-full max-w-xl input-bordered input-sm;
+    @apply input input-sm;
 }
-textarea {
-    @apply textarea textarea-sm;
+input[type="text"],[type="number"],[type="email"],[type="password"] {
+    @apply read-only:opacity-40;
 }
 
-/* input,
 textarea {
-    @apply border border-solid border-coolgray-500 bg-coolgray-200 rounded p-2 px-4 text-white outline-none transition-all;
+    @apply textarea;
 }
-input,
-textarea {
-    @apply disabled:text-neutral-600 read-only:text-neutral-600 read-only:select-none read-only:bg-coolgray-200/50;
-} */
 select {
-    @apply border border-solid border-coolgray-400 rounded p-2 px-4 bg-coolgray-200 text-white disabled:text-neutral-600 read-only:select-none outline-none;
+    @apply select select-sm disabled:opacity-40;
 }
-button {
-    @apply btn btn-xs btn-ghost no-animation normal-case;
+
+button[type="button"] {
+    @apply btn btn-xs btn-ghost no-animation normal-case text-white;
 }
 button[type="submit"] {
-    @apply btn-primary btn-sm;
+    @apply btn btn-xs no-animation normal-case text-white btn-primary;
+}
+button[isWarning] {
+    @apply btn-error text-white;
+}
+button[isHighlighted] {
+    @apply btn-primary text-white;
 }
 h1 {
     @apply text-3xl font-bold pb-4;
@@ -36,10 +47,10 @@ h2 {
     @apply text-2xl font-bold pb-4;
 }
 h3 {
-    @apply text-xl font-bold pb-4;
+    @apply text-xl font-bold py-4;
 }
-a{
-    @apply hover:text-white text-sm;
+a {
+    @apply text-neutral-400 hover:text-white text-sm link link-hover hover:bg-transparent;
 }
 
 .box {
diff --git a/resources/views/auth/login.blade.php b/resources/views/auth/login.blade.php
index cde952445..11a5bbe83 100644
--- a/resources/views/auth/login.blade.php
+++ b/resources/views/auth/login.blade.php
@@ -8,7 +8,7 @@
                         @env('local') value="test@example.com" @endenv autofocus />
                     <input type="password" name="password" placeholder="{{ __('input.password') }}"
                         @env('local') value="password" @endenv />
-                    <x-inputs.button isBold type="submit">{{ __('auth.login') }}</x-inputs.button>
+                    <x-inputs.button type="submit">{{ __('auth.login') }}</x-inputs.button>
                 </form>
                 @if ($errors->any())
                     <div class="alert alert-danger">
diff --git a/resources/views/auth/register.blade.php b/resources/views/auth/register.blade.php
index dba776362..884fbdc82 100644
--- a/resources/views/auth/register.blade.php
+++ b/resources/views/auth/register.blade.php
@@ -11,7 +11,7 @@
                     @env('local') value="password" @endenv />
                 <input type="password" name="password_confirmation" placeholder="{{ __('input.password.again') }}"
                     @env('local') value="password" @endenv />
-                <x-inputs.button isBold type="submit">{{ __('auth.register') }}</x-inputs.button>
+                <x-inputs.button type="submit">{{ __('auth.register') }}</x-inputs.button>
             </form>
             @if ($errors->any())
                 <div class="alert alert-danger">
diff --git a/resources/views/components/applications/navbar.blade.php b/resources/views/components/applications/navbar.blade.php
index 8b946b994..f5a3199a3 100644
--- a/resources/views/components/applications/navbar.blade.php
+++ b/resources/views/components/applications/navbar.blade.php
@@ -1,4 +1,4 @@
-<nav class="flex justify-center gap-4 py-2 border-b-2 border-solid border-coolgray-200 ">
+<nav class="flex justify-center gap-4 py-2 border-b-2 border-solid border-coolgray-200">
     <a
         href="{{ route('project.application.configuration', [
             'project_uuid' => Route::current()->parameters()['project_uuid'],
@@ -16,14 +16,16 @@
         Deployments
     </a>
     <a target="_blank" href="{{ $application->gitBranchLocation }}">
-        Open on Git <img class="inline-flex w-4 h-4" src="{{ asset('svgs/external-link.svg') }}">
+        Open on Git
+        <x-external-link />
     </a>
     @if (data_get($application, 'ports_mappings_array'))
         @foreach ($application->ports_mappings_array as $port)
             @if (config('app.env') === 'local')
                 <a target="_blank" href="http://localhost:{{ explode(':', $port)[0] }}">Open
-                    {{ explode(':', $port)[0] }} <img class="inline-flex w-4 h-4"
-                        src="{{ asset('svgs/external-link.svg') }}"></a>
+                    {{ explode(':', $port)[0] }}
+                    <x-external-link />
+                </a>
             @else
                 <a target="_blank"
                     href="http://{{ $application->destination->server->ip }}:{{ explode(':', $port)[0] }}">Open
diff --git a/resources/views/components/confirm-modal.blade.php b/resources/views/components/confirm-modal.blade.php
index 033800ab6..7d8ddd71a 100644
--- a/resources/views/components/confirm-modal.blade.php
+++ b/resources/views/components/confirm-modal.blade.php
@@ -22,7 +22,7 @@
         <div class="flex flex-col items-center justify-center h-full">
             <div class="pb-5 text-white" x-text="message"></div>
             <div>
-                <x-inputs.button isWarning x-on:click='confirmed()'>Confirm</x-inputs.button>
+                <x-inputs.button x-on:click='confirmed()'>Confirm</x-inputs.button>
                 <x-inputs.button x-on:click="open = false">Cancel</x-inputs.button>
             </div>
         </div>
diff --git a/resources/views/components/external-link.blade.php b/resources/views/components/external-link.blade.php
new file mode 100644
index 000000000..8c42de94a
--- /dev/null
+++ b/resources/views/components/external-link.blade.php
@@ -0,0 +1 @@
+<img class="inline-flex w-3 h-3 mb-1 ml-2" src="{{ asset('svgs/external-link.svg') }}">
diff --git a/resources/views/components/inputs/button.blade.php b/resources/views/components/inputs/button.blade.php
index bf6977fc3..44f738c13 100644
--- a/resources/views/components/inputs/button.blade.php
+++ b/resources/views/components/inputs/button.blade.php
@@ -1,17 +1,30 @@
 @props([
+    'type' => $attributes->get('type') ?? 'button',
     'disabled' => null,
     'confirm' => null,
     'confirmAction' => null,
 ])
-<button {{ $attributes }}
-    @if ($attributes->whereStartsWith('wire:click') && !$disabled) wire:target="{{ explode('(', $attributes->whereStartsWith('wire:click')->first())[0] }}"
-    wire:loading.delay.class='loading' wire:loading.delay.attr="disabled" @endif
-    @if ($disabled !== null) disabled title="{{ $disabled }}" @endif
-    @isset($confirm)
+@if ($type === 'submit')
+    <button type="submit" @if ($disabled !== null) disabled @endif wire:target="submit"
+        wire:loading.delay.shorter.class="loading"
+        @isset($confirm)
         x-on:click="toggleConfirmModal('{{ $confirm }}', '{{ explode('(', $confirmAction)[0] }}')"
     @endisset
-    @isset($confirmAction)
+        @isset($confirmAction)
         x-on:{{ explode('(', $confirmAction)[0] }}.window="$wire.{{ explode('(', $confirmAction)[0] }}"
     @endisset>
-    {{ $slot }}
-</button>
+        {{ $slot }}
+    </button>
+@elseif($type === 'button')
+    <button {{ $attributes }} @if ($disabled !== null) disabled @endif type="button"
+        wire:target="{{ explode('(', $attributes->whereStartsWith('wire:click')->first())[0] }}"
+        wire:loading.delay.shorter.class="loading"
+        @isset($confirm)
+        x-on:click="toggleConfirmModal('{{ $confirm }}', '{{ explode('(', $confirmAction)[0] }}')"
+    @endisset
+        @isset($confirmAction)
+        x-on:{{ explode('(', $confirmAction)[0] }}.window="$wire.{{ explode('(', $confirmAction)[0] }}"
+    @endisset>
+        {{ $slot }}
+    </button>
+@endif
diff --git a/resources/views/components/inputs/checkbox.blade.php b/resources/views/components/inputs/checkbox.blade.php
index 183bb0a2e..260b01df6 100644
--- a/resources/views/components/inputs/checkbox.blade.php
+++ b/resources/views/components/inputs/checkbox.blade.php
@@ -8,17 +8,16 @@
     'noDirty' => $attributes->has('noDirty'),
     'disabled' => null,
 ])
-
-<label {{ $attributes->merge(['class' => 'flex items-center gap-16 cursor-pointer']) }}>
-    <span class="label-text">
+<label {{ $attributes->merge(['class' => 'flex cursor-pointer w-64 label']) }}>
+    <div class="label-text">
         @if ($label)
             {{ $label }}
         @else
             {{ $id }}
         @endif
-    </span>
-    <input type="checkbox" @if ($disabled !== null) disabled @endif class="toggle" name={{ $id }}
+    </div>
+    <div class="flex-1"></div>
+    <input type="checkbox" @if ($disabled !== null) disabled @endif name={{ $id }}
         @if (!$noDirty) wire:dirty.class="input-warning" @endif
         @if ($instantSave) wire:click='instantSave' wire:model.defer={{ $id }} @else wire:model.defer={{ $value ?? $id }} @endif />
 </label>
-</div>
diff --git a/resources/views/components/inputs/input.blade.php b/resources/views/components/inputs/input.blade.php
index 69bf551b4..f6fdd77bf 100644
--- a/resources/views/components/inputs/input.blade.php
+++ b/resources/views/components/inputs/input.blade.php
@@ -1,14 +1,15 @@
 @props([
     'id' => $attributes->has('id') || $attributes->has('label'),
-    'required' => $attributes->has('required'),
+    'type' => $attributes->get('type') ?? 'text',
+    'required' => null,
     'label' => $attributes->has('label'),
     'helper' => $attributes->has('helper'),
-    'instantSave' => $attributes->has('instantSave'),
     'noLabel' => $attributes->has('noLabel'),
     'noDirty' => $attributes->has('noDirty'),
+    'disabled' => null,
 ])
 
-<div class="w-full max-w-xs form-control">
+<div {{ $attributes->merge(['class' => 'w-full form-control']) }}>
     @if (!$noLabel)
         <label class="label">
             <span class="label-text">
@@ -40,8 +41,8 @@ class="w-64 border-2 shadow border-coolgray-500 card compact dropdown-content bg
             </span>
         </label>
     @endif
-    <input {{ $attributes }} name={{ $id }}
-        @if ($instantSave) wire:click='instantSave' wire:model.defer={{ $id }} @else wire:model.defer={{ $value ?? $id }} @endif
+    <input {{ $attributes }} type={{ $type }} name={{ $id }} wire:model.defer={{ $id }}
+        @if ($disabled !== null) disabled @endif @if ($required !== null) required @endif
         @if (!$noDirty) wire:dirty.class="input-warning" @endif />
     @error($id)
         <label class="label">
diff --git a/resources/views/components/inputs/select.blade.php b/resources/views/components/inputs/select.blade.php
index 722039a77..8948fa9c5 100644
--- a/resources/views/components/inputs/select.blade.php
+++ b/resources/views/components/inputs/select.blade.php
@@ -4,7 +4,7 @@
     'required' => false,
 ])
 
-<span @class(['flex flex-col'])>
+<span {{ $attributes->merge(['class' => 'flex flex-col']) }}>
     <label for={{ $id }}>
         @if ($label)
             {{ $label }}
diff --git a/resources/views/components/inputs/textarea.blade.php b/resources/views/components/inputs/textarea.blade.php
index bd305441e..3514c8856 100644
--- a/resources/views/components/inputs/textarea.blade.php
+++ b/resources/views/components/inputs/textarea.blade.php
@@ -8,7 +8,7 @@
     'noDirty' => $attributes->has('noDirty'),
 ])
 
-<div class="w-full max-w-xs form-control">
+<div class=" form-control">
     @if (!$noLabel)
         <label class="label">
             <span class="label-text">
@@ -40,8 +40,7 @@ class="w-64 border-2 shadow border-coolgray-500 card compact dropdown-content bg
             </span>
         </label>
     @endif
-    <textarea {{ $attributes }} name={{ $id }}
-        @if ($instantSave) wire:click='instantSave' wire:model.defer={{ $id }} @else wire:model.defer={{ $value ?? $id }} @endif
+    <textarea {{ $attributes }} name={{ $id }} wire:model.defer={{ $value ?? $id }}
         @if (!$noDirty) wire:dirty.class="input-warning" @endif></textarea>
     @error($id)
         <label class="label">
diff --git a/resources/views/components/layout.blade.php b/resources/views/components/layout.blade.php
index b9eeaf015..7b494df43 100644
--- a/resources/views/components/layout.blade.php
+++ b/resources/views/components/layout.blade.php
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html data-theme="coollabs" lang="{{ str_replace('_', '-', app()->getLocale()) }}" class="h-full bg-coolgray-100">
+<html data-theme="coollabs" lang="{{ str_replace('_', '-', app()->getLocale()) }}">
 
 <head>
     <meta charset="utf-8">
@@ -24,14 +24,13 @@
     @livewireStyles
 </head>
 
-<body class="antialiased">
+<body>
 
     @livewireScripts
-
     @auth
         <x-navbar />
     @endauth
-    <main class="max-w-6xl px-8 pt-10 mx-auto">
+    <main class="min-h-full px-8 pt-10 mx-auto max-w-7xl">
         {{ $slot }}
     </main>
     <a
diff --git a/resources/views/components/naked-modal.blade.php b/resources/views/components/naked-modal.blade.php
index f2e965c3f..515127f0b 100644
--- a/resources/views/components/naked-modal.blade.php
+++ b/resources/views/components/naked-modal.blade.php
@@ -3,17 +3,14 @@
     'message' => 'Are you sure you want to delete this?',
     'action' => 'delete',
 ])
-<div x-cloak x-show="{{ $show }}" x-transition.opacity class="fixed inset-0 bg-coolgray-100/75"></div>
-<div x-cloak x-show="{{ $show }}" x-transition class="fixed inset-0 z-50 top-20">
-    <div @click.away="{{ $show }} = false" class="w-screen max-w-xl mx-auto rounded-lg shadow-xl bg-coolgray-200">
-        <div class="flex flex-col items-center justify-center h-full p-4">
-            <div class="pb-5 text-xs text-white">{{ $message }}</div>
-            <div class="text-xs">
-                <x-inputs.button isWarning wire:click='{{ $action }}' x-on:click="{{ $show }} = false">
-                    Yes
-                </x-inputs.button>
-                <x-inputs.button x-on:click="{{ $show }} = false">No</x-inputs.button>
-            </div>
+<div x-cloak x-show="{{ $show }}" x-transition class="modal modal-open">
+    <div class="relative modal-box">
+        <div class="pb-8 text-base font-bold">{{ $message }}</div>
+        <div class="flex justify-end gap-4 text-xs">
+            <x-inputs.button isWarning wire:click='{{ $action }}' x-on:click="{{ $show }} = false">
+                Yes
+            </x-inputs.button>
+            <x-inputs.button x-on:click="{{ $show }} = false">No</x-inputs.button>
         </div>
     </div>
 </div>
diff --git a/resources/views/components/navbar.blade.php b/resources/views/components/navbar.blade.php
index 92f704fbe..be6128fc0 100644
--- a/resources/views/components/navbar.blade.php
+++ b/resources/views/components/navbar.blade.php
@@ -10,29 +10,29 @@
                 </label>
                 <ul tabindex="0" class="p-2 mt-3 shadow menu menu-compact dropdown-content bg-base-100 rounded-box w-52">
                     <li>
-                        <a href="/" class="justify-between">
+                        <a href="/">
                             Home
                         </a>
                     </li>
                     @if (auth()->user()->isRoot())
                         <li>
-                            <a href="/settings" class="justify-between">
+                            <a href="/settings">
                                 Settings
                             </a>
                         </li>
                     @endif
                     <li>
-                        <a href="/profile" class="justify-between">
+                        <a href="/profile">
                             Profile
                         </a>
                     </li>
                     <li>
-                        <a href="/profile/team" class="justify-between">
+                        <a href="/profile/team">
                             Team
                         </a>
                     </li>
                     <li>
-                        <a href="/command-center" class="justify-between">
+                        <a href="/command-center">
                             Command Center
                         </a>
                     </li>
@@ -49,7 +49,7 @@
                     </li>
                 </ul>
             </div>
-            <a href="/" class="text-xl normal-case btn btn-ghost">Coolify</a>
+            <a href="/" class="text-xl no-underline normal-case btn btn-ghost">Coolify</a>
             <div class="form-control">
                 <x-magic-bar />
             </div>
@@ -58,23 +58,23 @@
             <ul class="px-1 menu menu-horizontal text-neutral-400">
                 @if (auth()->user()->isRoot())
                     <li>
-                        <a href="/settings" class="justify-between link link-hover hover:bg-transparent">
+                        <a href="/settings">
                             Settings
                         </a>
                     </li>
                 @endif
                 <li>
-                    <a href="/profile" class="justify-between link link-hover hover:bg-transparent">
+                    <a href="/profile">
                         Profile
                     </a>
                 </li>
                 <li>
-                    <a href="/profile/team" class="justify-between link link-hover hover:bg-transparent">
+                    <a href="/profile/team">
                         Team
                     </a>
                 </li>
                 <li>
-                    <a class="justify-between link link-hover hover:bg-transparent" href="/command-center">
+                    <a href="/command-center">
                         Command Center
                     </a>
                 </li>
diff --git a/resources/views/livewire/destination/form.blade.php b/resources/views/livewire/destination/form.blade.php
index 3996885a8..1c4316b1b 100644
--- a/resources/views/livewire/destination/form.blade.php
+++ b/resources/views/livewire/destination/form.blade.php
@@ -7,10 +7,10 @@
             <x-inputs.input id="destination.network" label="Docker Network" readonly />
         @endif
         <div>
-            <x-inputs.button isBold type="submit">
+            <x-inputs.button type="submit">
                 Save
             </x-inputs.button>
-            <x-inputs.button isWarning x-on:click.prevent="deleteDestination = true">
+            <x-inputs.button x-on:click.prevent="deleteDestination = true">
                 Delete
             </x-inputs.button>
         </div>
diff --git a/resources/views/livewire/destination/new/standalone-docker.blade.php b/resources/views/livewire/destination/new/standalone-docker.blade.php
index 13877a265..afeaf6453 100644
--- a/resources/views/livewire/destination/new/standalone-docker.blade.php
+++ b/resources/views/livewire/destination/new/standalone-docker.blade.php
@@ -8,7 +8,7 @@
                 <option value="{{ $server->id }}">{{ $server->name }}</option>
             @endforeach
         </x-inputs.select>
-        <x-inputs.button isBold type="submit">
+        <x-inputs.button type="submit">
             Submit
         </x-inputs.button>
     </form>
diff --git a/resources/views/livewire/private-key/change.blade.php b/resources/views/livewire/private-key/change.blade.php
index 031be1c24..7b345068f 100644
--- a/resources/views/livewire/private-key/change.blade.php
+++ b/resources/views/livewire/private-key/change.blade.php
@@ -3,12 +3,12 @@
     <form class="flex flex-col gap-2" wire:submit.prevent='changePrivateKey'>
         <x-inputs.input id="private_key.name" label="Name" required />
         <x-inputs.input id="private_key.description" label="Description" />
-        <x-inputs.input type="textarea" rows="10" id="private_key.private_key" label="Private Key" required />
+        <x-inputs.textarea rows="10" id="private_key.private_key" label="Private Key" required />
         <div>
-            <x-inputs.button isBold type="submit">
+            <x-inputs.button type="submit">
                 Save
             </x-inputs.button>
-            <x-inputs.button isWarning x-on:click.prevent="deletePrivateKey = true">
+            <x-inputs.button x-on:click.prevent="deletePrivateKey = true">
                 Delete
             </x-inputs.button>
         </div>
diff --git a/resources/views/livewire/private-key/create.blade.php b/resources/views/livewire/private-key/create.blade.php
index 233c24100..6478b8842 100644
--- a/resources/views/livewire/private-key/create.blade.php
+++ b/resources/views/livewire/private-key/create.blade.php
@@ -3,7 +3,7 @@
         <x-inputs.input id="name" label="Name" required />
         <x-inputs.input id="description" label="Description" />
         <x-inputs.input type="textarea" id="value" label="Private Key" required />
-        <x-inputs.button isBold type="submit" wire.click.prevent>
+        <x-inputs.button type="submit" wire.click.prevent>
             Save
         </x-inputs.button>
     </form>
diff --git a/resources/views/livewire/project/application/danger.blade.php b/resources/views/livewire/project/application/danger.blade.php
new file mode 100644
index 000000000..66afc3b73
--- /dev/null
+++ b/resources/views/livewire/project/application/danger.blade.php
@@ -0,0 +1,5 @@
+<div x-data="{ deleteApplication: false }">
+    <h2>Danger Zone</h2>
+    <x-naked-modal show="deleteApplication" />
+    <x-inputs.button isWarning x-on:click.prevent="deleteApplication = true">Delete this application</x-inputs.button>
+</div>
diff --git a/resources/views/livewire/project/application/deploy.blade.php b/resources/views/livewire/project/application/deploy.blade.php
index d19ead088..f78108704 100644
--- a/resources/views/livewire/project/application/deploy.blade.php
+++ b/resources/views/livewire/project/application/deploy.blade.php
@@ -1,15 +1,13 @@
-<div x-data="{ deleteApplication: false }" class="flex items-center gap-2">
-    <x-naked-modal show="deleteApplication" />
+<div class="flex items-center gap-2">
     @if ($application->status === 'running')
         <x-inputs.button wire:click='start'>Rebuild</x-inputs.button>
         <x-inputs.button wire:click='forceRebuild'>Force Rebuild</x-inputs.button>
-        <x-inputs.button isWarning wire:click='stop'>Stop</x-inputs.button>
+        <x-inputs.button wire:click='stop'>Stop</x-inputs.button>
     @else
         <x-inputs.button wire:click='start'>Start</x-inputs.button>
         <x-inputs.button wire:click='forceRebuild'>Start (no cache)</x-inputs.button>
     @endif
-    <x-inputs.button x-on:click.prevent="deleteApplication = true">
-        Delete</x-inputs.button>
+
     <span wire:poll.5000ms='pollingStatus'>
         @if ($application->status === 'running')
             <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
diff --git a/resources/views/livewire/project/application/destination.blade.php b/resources/views/livewire/project/application/destination.blade.php
index bfdbddb35..7cd6dc826 100644
--- a/resources/views/livewire/project/application/destination.blade.php
+++ b/resources/views/livewire/project/application/destination.blade.php
@@ -1,5 +1,5 @@
 <div>
-    <h3>Destination</h3>
+    <h2>Destination</h2>
     <p>Server Name: {{ data_get($destination, 'server.name') }}</p>
     @if (data_get($destination, 'server.description'))
         <p>Description: {{ data_get($destination, 'server.description') }}</p>
diff --git a/resources/views/livewire/project/application/environment-variable/add.blade.php b/resources/views/livewire/project/application/environment-variable/add.blade.php
index a2e2bfc05..b83ca2fcc 100644
--- a/resources/views/livewire/project/application/environment-variable/add.blade.php
+++ b/resources/views/livewire/project/application/environment-variable/add.blade.php
@@ -2,10 +2,10 @@
     <div class="flex gap-2">
         <x-inputs.input noDirty id="key" label="Name" required />
         <x-inputs.input noDirty id="value" label="Value" required />
-        <x-inputs.input noDirty type="checkbox" id="is_build_time" label="Build Variable?" />
+        <x-inputs.checkbox noDirty class="flex-col items-center" id="is_build_time" label="Build Variable?" />
     </div>
     <div class="pt-2">
-        <x-inputs.button isBold type="submit">
+        <x-inputs.button type="submit">
             Add
         </x-inputs.button>
     </div>
diff --git a/resources/views/livewire/project/application/environment-variable/all.blade.php b/resources/views/livewire/project/application/environment-variable/all.blade.php
index aaae4b361..27deddb95 100644
--- a/resources/views/livewire/project/application/environment-variable/all.blade.php
+++ b/resources/views/livewire/project/application/environment-variable/all.blade.php
@@ -1,5 +1,5 @@
 <div class="flex flex-col gap-2">
-    <h3>Environment Variables</h3>
+    <h2>Environment Variables</h2>
     @forelse ($application->environment_variables as $env)
         <livewire:project.application.environment-variable.show wire:key="environment-{{ $env->id }}"
             :env="$env" />
diff --git a/resources/views/livewire/project/application/environment-variable/show.blade.php b/resources/views/livewire/project/application/environment-variable/show.blade.php
index 0c0a23c63..4b1a2ff75 100644
--- a/resources/views/livewire/project/application/environment-variable/show.blade.php
+++ b/resources/views/livewire/project/application/environment-variable/show.blade.php
@@ -3,13 +3,13 @@
         <div class="flex gap-2">
             <x-inputs.input label="Name" id="env.key" />
             <x-inputs.input label="Value" id="env.value" />
-            <x-inputs.input type="checkbox" id="env.is_build_time" label="Build Variable?" />
+            <x-inputs.checkbox disabled class="flex-col items-center" id="env.is_build_time" label="Build Variable?" />
         </div>
         <div class="pt-2">
-            <x-inputs.button isBold type="submit">
+            <x-inputs.button type="submit">
                 Update
             </x-inputs.button>
-            <x-inputs.button x-on:click.prevent="deleteEnvironment = true" isWarning>
+            <x-inputs.button x-on:click.prevent="deleteEnvironment = true">
                 Delete
             </x-inputs.button>
         </div>
diff --git a/resources/views/livewire/project/application/general.blade.php b/resources/views/livewire/project/application/general.blade.php
index 3a9593365..e24b58c04 100644
--- a/resources/views/livewire/project/application/general.blade.php
+++ b/resources/views/livewire/project/application/general.blade.php
@@ -1,12 +1,16 @@
 <div>
-    <h3>General</h3>
     <form wire:submit.prevent='submit' class="flex flex-col">
+        <div class="flex gap-2">
+            <h2>General</h2>
+            <x-inputs.button type="submit">
+                Save
+            </x-inputs.button>
+        </div>
         <div class="flex flex-col gap-2 pb-4">
-            <x-inputs.input id="application.name" label="Name" required />
-            <x-inputs.input id="application.fqdn" label="Domains" />
-            <x-inputs.input id="application.install_command" label="Install Command" />
-            <x-inputs.input id="application.build_command" label="Build Command" />
-            <x-inputs.input id="application.start_command" label="Start Command" />
+            <div class="flex gap-2">
+                <x-inputs.input class="w-full" id="application.name" label="Name" required />
+                <x-inputs.input class="w-full" id="application.fqdn" label="Domains" />
+            </div>
             <x-inputs.select id="application.build_pack" label="Build Pack" required>
                 <option value="nixpacks">Nixpacks</option>
                 <option disabled value="docker">Docker</option>
@@ -18,33 +22,38 @@
                     <option disabled value="apache:alpine">apache:alpine</option>
                 </x-inputs.select>
             @endif
-            <x-inputs.input id="application.base_directory" label="Base Directory" />
-            @if ($application->settings->is_static)
-                <x-inputs.input id="application.publish_directory" label="Publish Directory" required />
-            @else
-                <x-inputs.input id="application.publish_directory" label="Publish Directory" />
-            @endif
-            @if ($application->settings->is_static)
-                <x-inputs.input id="application.ports_exposes" label="Ports Exposes" readonly />
-            @else
-                <x-inputs.input id="application.ports_exposes" label="Ports Exposes" required />
-            @endif
-            <x-inputs.input id="application.ports_mappings" label="Ports Mappings" />
+            <div class="flex gap-2">
+                <x-inputs.input id="application.install_command" label="Install Command" />
+                <x-inputs.input id="application.build_command" label="Build Command" />
+                <x-inputs.input id="application.start_command" label="Start Command" />
+            </div>
+            <div class="flex gap-2">
+                <x-inputs.input id="application.base_directory" label="Base Directory" />
+                @if ($application->settings->is_static)
+                    <x-inputs.input id="application.publish_directory" label="Publish Directory" required />
+                @else
+                    <x-inputs.input id="application.publish_directory" label="Publish Directory" />
+                @endif
+            </div>
+            <div class="flex gap-2">
+                @if ($application->settings->is_static)
+                    <x-inputs.input id="application.ports_exposes" label="Ports Exposes" readonly />
+                @else
+                    <x-inputs.input id="application.ports_exposes" label="Ports Exposes" required />
+                @endif
+                <x-inputs.input id="application.ports_mappings" label="Ports Mappings" />
+            </div>
+        </div>
+        <div class="flex flex-col">
+            <x-inputs.checkbox instantSave id="is_debug" label="Debug" />
+            <x-inputs.checkbox instantSave id="is_static" label="Static website?" />
+            <x-inputs.checkbox instantSave id="is_git_submodules_allowed" label="Git Submodules Allowed?" />
+            <x-inputs.checkbox instantSave id="is_git_lfs_allowed" label="Git LFS Allowed?" />
+            <x-inputs.checkbox instantSave id="is_auto_deploy" label="Auto Deploy?" />
+            <x-inputs.checkbox instantSave id="is_previews" label="Previews?" />
+            <x-inputs.checkbox disabled instantSave id="is_dual_cert" label="Dual Certs?" />
+            <x-inputs.checkbox disabled instantSave id="is_custom_ssl" label="Is Custom SSL?" />
+            <x-inputs.checkbox disabled instantSave id="is_http2" label="Is Http2?" />
         </div>
-        <x-inputs.button isBold type="submit">
-            Submit
-        </x-inputs.button>
     </form>
-    <div class="flex flex-col pt-4">
-        <x-inputs.input noDirty instantSave type="checkbox" id="is_static" label="Static website?" />
-        <x-inputs.input noDirty instantSave type="checkbox" id="is_git_submodules_allowed"
-            label="Git Submodules Allowed?" />
-        <x-inputs.input noDirty instantSave type="checkbox" id="is_git_lfs_allowed" label="Git LFS Allowed?" />
-        <x-inputs.input noDirty instantSave type="checkbox" id="is_debug" label="Debug" />
-        <x-inputs.input noDirty instantSave type="checkbox" id="is_auto_deploy" label="Auto Deploy?" />
-        <x-inputs.input noDirty instantSave type="checkbox" id="is_previews" label="Previews?" />
-        <x-inputs.input disabled instantSave type="checkbox" id="is_dual_cert" label="Dual Certs?" />
-        <x-inputs.input disabled instantSave type="checkbox" id="is_custom_ssl" label="Is Custom SSL?" />
-        <x-inputs.input disabled instantSave type="checkbox" id="is_http2" label="Is Http2?" />
-    </div>
 </div>
diff --git a/resources/views/livewire/project/application/resource-limits.blade.php b/resources/views/livewire/project/application/resource-limits.blade.php
index 6b5f1339b..5e19204d0 100644
--- a/resources/views/livewire/project/application/resource-limits.blade.php
+++ b/resources/views/livewire/project/application/resource-limits.blade.php
@@ -1,6 +1,9 @@
 <div>
-    <h2>Resource Limits</h2>
-    <form wire:submit.prevent='submit'>
+    <form wire:submit.prevent='submit' class="flex flex-col">
+        <div class="flex gap-2">
+            <h2>Resource Limits</h2>
+            <x-inputs.button type='submit'>Save</x-inputs.button>
+        </div>
         <h3>Memory</h3>
         <x-inputs.input placeholder="69b or 420k or 1337m or 1g" label="Limit" id="application.limits_memory" />
         <x-inputs.input placeholder="69b or 420k or 1337m or 1g" label="Swap" id="application.limits_memory_swap" />
@@ -8,13 +11,10 @@
             id="application.limits_memory_swappiness" />
         <x-inputs.input placeholder="69b or 420k or 1337m or 1g" label="Soft Limit"
             id="application.limits_memory_reservation" />
-        <x-inputs.input type="checkbox" label="Is OOM Kill disabled?" id="application.limits_memory_oom_kill" />
+        <x-inputs.checkbox label="Disable OOM kill" id="application.limits_memory_oom_kill" />
         <h3>CPU</h3>
         <x-inputs.input placeholder="1.5" label="Number of CPUs" id="application.limits_cpus" />
         <x-inputs.input placeholder="0-2" label="CPU set to use" id="application.limits_cpuset" />
         <x-inputs.input placeholder="1024" label="CPU Weight" id="application.limits_cpu_shares" />
-        <div class="pt-4">
-            <x-inputs.button isBold>Save</x-inputs.button>
-        </div>
     </form>
 </div>
diff --git a/resources/views/livewire/project/application/rollback.blade.php b/resources/views/livewire/project/application/rollback.blade.php
index 7b59dea9c..869bd97ac 100644
--- a/resources/views/livewire/project/application/rollback.blade.php
+++ b/resources/views/livewire/project/application/rollback.blade.php
@@ -1,7 +1,7 @@
 <div x-init="$wire.loadImages">
-    <h2>Revert</h2>
-    <div>
-        <x-inputs.button isBold wire:click='loadImages'>Refresh Images</x-inputs.button>
+    <div class="flex gap-2">
+        <h2>Rollback</h2>
+        <x-inputs.button isHighlighted wire:click='loadImages'>Refresh Images</x-inputs.button>
     </div>
     <div wire:loading wire:target='loadImages'>
         <x-loading />
diff --git a/resources/views/livewire/project/application/source.blade.php b/resources/views/livewire/project/application/source.blade.php
index ca0058426..50a843d4d 100644
--- a/resources/views/livewire/project/application/source.blade.php
+++ b/resources/views/livewire/project/application/source.blade.php
@@ -1,18 +1,19 @@
 <div>
-    <h3>Source</h3>
+    <h2>Source</h2>
     <div class="pb-8">{{ data_get($application, 'source.name') }}
         @if (data_get($application, 'source.is_public'))
             <span class="text-xs">public</span>
         @endif
     </div>
     <form wire:submit.prevent='submit' class="flex flex-col gap-2 w-max-fit">
-        <x-inputs.input id="application.git_repository" label="Repository" readonly />
-        <x-inputs.input id="application.git_branch" label=" Branch" readonly />
+        <x-inputs.input id="application.git_repository" label="Repository" />
+        <x-inputs.input id="application.git_branch" label=" Branch" />
         <x-inputs.input id="application.git_commit_sha" placeholder="HEAD" label="Commit SHA" />
         <div>
-            <x-inputs.button isBold type="submit">Save</x-inputs.button>
+            <x-inputs.button type="submit">Save</x-inputs.button>
             <a target="_blank" href="{{ $application->gitCommits }}">
-                Commits <img class="inline-flex w-4 h-4" src="{{ asset('svgs/external-link.svg') }}">
+                Commits
+                <x-external-link />
             </a>
         </div>
     </form>
diff --git a/resources/views/livewire/project/application/storages/add.blade.php b/resources/views/livewire/project/application/storages/add.blade.php
index e41f265b7..05e154f6f 100644
--- a/resources/views/livewire/project/application/storages/add.blade.php
+++ b/resources/views/livewire/project/application/storages/add.blade.php
@@ -5,7 +5,7 @@
         <x-inputs.input noDirty id="mount_path" label="Destination Path" required />
     </div>
     <div class="pt-2">
-        <x-inputs.button isBold type="submit">
+        <x-inputs.button type="submit">
             Add
         </x-inputs.button>
     </div>
diff --git a/resources/views/livewire/project/application/storages/all.blade.php b/resources/views/livewire/project/application/storages/all.blade.php
index fef790b0b..a5b7e4e36 100644
--- a/resources/views/livewire/project/application/storages/all.blade.php
+++ b/resources/views/livewire/project/application/storages/all.blade.php
@@ -1,5 +1,5 @@
 <div class="flex flex-col gap-2">
-    <h3>Storages</h3>
+    <h2>Storages</h2>
     @forelse ($application->persistentStorages as $storage)
         <livewire:project.application.storages.show wire:key="storage-{{ $storage->id }}" :storage="$storage" />
     @empty
diff --git a/resources/views/livewire/project/application/storages/show.blade.php b/resources/views/livewire/project/application/storages/show.blade.php
index a64b0ce2f..be90c7143 100644
--- a/resources/views/livewire/project/application/storages/show.blade.php
+++ b/resources/views/livewire/project/application/storages/show.blade.php
@@ -6,10 +6,10 @@
             <x-inputs.input id="storage.mount_path" label="Destination Path" required />
         </div>
         <div class="pt-2">
-            <x-inputs.button isBold type="submit">
+            <x-inputs.button type="submit">
                 Update
             </x-inputs.button>
-            <x-inputs.button x-on:click.prevent="deleteStorage = true" isWarning>
+            <x-inputs.button x-on:click.prevent="deleteStorage = true">
                 Delete
             </x-inputs.button>
         </div>
diff --git a/resources/views/livewire/project/delete.blade.php b/resources/views/livewire/project/delete.blade.php
index 3c07ee77e..659c31c0a 100644
--- a/resources/views/livewire/project/delete.blade.php
+++ b/resources/views/livewire/project/delete.blade.php
@@ -1,11 +1,11 @@
 <div x-data="{ deleteProject: false }">
     <x-naked-modal show="deleteProject" message='Are you sure you would like to delete this project?' />
     @if ($resource_count > 0)
-        <x-inputs.button isWarning disabled="First delete all resources.">
+        <x-inputs.button disabled="First delete all resources.">
             Delete
         </x-inputs.button>
     @else
-        <x-inputs.button isWarning x-on:click.prevent="deleteProject = true">
+        <x-inputs.button x-on:click.prevent="deleteProject = true">
             Delete
         </x-inputs.button>
     @endif
diff --git a/resources/views/livewire/run-command.blade.php b/resources/views/livewire/run-command.blade.php
index dfd877272..611477527 100755
--- a/resources/views/livewire/run-command.blade.php
+++ b/resources/views/livewire/run-command.blade.php
@@ -10,7 +10,7 @@
                 @endif
             @endforeach
         </select>
-        <x-inputs.button isBold type="submit">Run</x-inputs.button>
+        <x-inputs.button type="submit">Run</x-inputs.button>
     </form>
     <div class="container w-full pt-10 mx-auto">
         <livewire:activity-monitor />
diff --git a/resources/views/livewire/server/form.blade.php b/resources/views/livewire/server/form.blade.php
index f7301568e..fb76db294 100644
--- a/resources/views/livewire/server/form.blade.php
+++ b/resources/views/livewire/server/form.blade.php
@@ -1,12 +1,12 @@
 <div x-data="{ deleteServer: false }">
-    <h3>General</h3>
+    <h2>General</h2>
     <x-naked-modal show="deleteServer" message='Are you sure you would like to delete this server?' />
     <form wire:submit.prevent='submit' class="flex flex-col">
         <div class="flex flex-col gap-2 xl:flex-row">
             <div class="flex flex-col w-96">
                 <x-inputs.input id="server.name" label="Name" required />
                 <x-inputs.input id="server.description" label="Description" />
-                <x-inputs.input disabled type="checkbox" id="server.settings.is_part_of_swarm"
+                <x-inputs.checkbox disabled type="checkbox" id="server.settings.is_part_of_swarm"
                     label="Is it part of a Swarm cluster?" />
             </div>
             <div class="flex flex-col w-96">
@@ -23,9 +23,9 @@
         </div>
 
         <div class="flex items-center gap-2">
-            <x-inputs.button isBold type="submit">Save</x-inputs.button>
+            <x-inputs.button type="submit">Save</x-inputs.button>
 
-            <x-inputs.button isBold wire:click.prevent='validateServer'>
+            <x-inputs.button wire:click.prevent='validateServer'>
                 @if ($server->settings->is_validated)
                     Check Connection
                 @else
@@ -33,8 +33,8 @@
                 @endif
             </x-inputs.button>
 
-            {{-- <x-inputs.button isBold wire:click.prevent='installDocker'>Install Docker</x-inputs.button> --}}
-            <x-inputs.button isWarning x-on:click.prevent="deleteServer = true">
+            {{-- <x-inputs.button  wire:click.prevent='installDocker'>Install Docker</x-inputs.button> --}}
+            <x-inputs.button x-on:click.prevent="deleteServer = true">
                 Delete
             </x-inputs.button>
         </div>
@@ -57,7 +57,7 @@
             {{ data_get($server, 'privateKey.uuid') }}
         </a>
         <a href="{{ route('server.private-key', ['server_uuid' => $server->uuid]) }}">
-            <x-inputs.button isBold>Change</x-inputs.button>
+            <x-inputs.button>Change</x-inputs.button>
         </a>
     </div>
     <div class="flex items-center gap-2 py-4">
@@ -71,7 +71,7 @@
             @endforeach
         </div>
         <a href="{{ route('destination.new', ['server_id' => $server->id]) }}">
-            <x-inputs.button isBold>Add</x-inputs.button>
+            <x-inputs.button>Add</x-inputs.button>
         </a>
     </div>
 </div>
diff --git a/resources/views/livewire/server/new/by-ip.blade.php b/resources/views/livewire/server/new/by-ip.blade.php
index ecb5dea2a..3e879dc62 100644
--- a/resources/views/livewire/server/new/by-ip.blade.php
+++ b/resources/views/livewire/server/new/by-ip.blade.php
@@ -19,7 +19,7 @@
         </x-inputs.select>
         <x-inputs.input instantSave noDirty type="checkbox" id="is_part_of_swarm"
             label="Is it part of a Swarm cluster?" />
-        <x-inputs.button isBold type="submit">
+        <x-inputs.button type="submit">
             Save
         </x-inputs.button>
     </form>
diff --git a/resources/views/livewire/server/proxy.blade.php b/resources/views/livewire/server/proxy.blade.php
index 713662566..57653eb9e 100644
--- a/resources/views/livewire/server/proxy.blade.php
+++ b/resources/views/livewire/server/proxy.blade.php
@@ -3,7 +3,7 @@
         message='Are you sure you would like to stop the proxy? All resources will be unavailable.' />
     @if ($server->settings->is_validated)
         <div class="flex items-center gap-2 mb-4">
-            <h3 class="pb-0">Proxy</h3>
+            <h2>Proxy</h2>
             <div>{{ $server->extra_attributes->proxy_status }}</div>
         </div>
 
@@ -13,16 +13,16 @@
                     $server->extra_attributes->last_applied_proxy_settings &&
                         $server->extra_attributes->last_saved_proxy_settings !== $server->extra_attributes->last_applied_proxy_settings)
                     <div class="text-red-500">Configuration out of sync.</div>
-                    <x-inputs.button isBold wire:click="installProxy">
+                    <x-inputs.button wire:click="installProxy">
                         Reconfigure
                     </x-inputs.button>
                 @endif
                 @if ($server->extra_attributes->proxy_status !== 'running')
-                    <x-inputs.button isBold wire:click="installProxy">
+                    <x-inputs.button wire:click="installProxy">
                         Start
                     </x-inputs.button>
                 @else
-                    <x-inputs.button isWarning x-on:click.prevent="stopProxy = true">Stop
+                    <x-inputs.button x-on:click.prevent="stopProxy = true">Stop
                     </x-inputs.button>
                 @endif
                 <div class="py-4">
@@ -37,13 +37,14 @@
                         @if ($selectedProxy->value === 'TRAEFIK_V2')
                             <form wire:submit.prevent='saveConfiguration'>
                                 <div class="py-2 pb-8">
-                                    <x-inputs.button isBold>Save</x-inputs.button>
+                                    <x-inputs.button type="submit">Save</x-inputs.button>
                                     <x-inputs.button wire:click.prevent="resetProxy">
                                         Reset Configuration
                                     </x-inputs.button>
                                 </div>
                                 <h4>traefik.conf</h4>
-                                <x-inputs.input noDirty type="textarea" wire:model.defer="proxy_settings" rows="30" />
+                                <x-inputs.textarea noDirty name="proxy_settings" wire:model.defer="proxy_settings"
+                                    rows="30" />
                             </form>
                         @endif
                     @endisset
@@ -55,7 +56,7 @@
                     {{ \App\Enums\ProxyTypes::TRAEFIK_V2 }}
                 </option>
             </select>
-            <x-inputs.button isBold wire:click="setProxy">Set Proxy</x-inputs.button>
+            <x-inputs.button wire:click="setProxy">Set Proxy</x-inputs.button>
         @endif
     @else
         <p>Server is not validated. Validate first.</p>
diff --git a/resources/views/livewire/source/github/change.blade.php b/resources/views/livewire/source/github/change.blade.php
index 46e31c850..4811ef59a 100644
--- a/resources/views/livewire/source/github/change.blade.php
+++ b/resources/views/livewire/source/github/change.blade.php
@@ -1,6 +1,38 @@
 <div x-data="{ deleteSource: false }">
     <x-naked-modal show="deleteSource" message='Are you sure you would like to delete this source?' />
     <form wire:submit.prevent='submit'>
+        <div class="flex items-center gap-2">
+            <h1>GitHub App</h1>
+            <div class="flex gap-2 ">
+                @if ($github_app->app_id)
+                    <x-inputs.button type="submit">Save</x-inputs.button>
+                    <x-inputs.button x-on:click.prevent="deleteSource = true">
+                        Delete
+                    </x-inputs.button>
+                    <a href="{{ $installation_url }}">
+                        <x-inputs.button>
+                            @if ($github_app->installation_id)
+                                Update Repositories
+                                <x-external-link />
+                            @else
+                                Install Repositories
+                                <x-external-link />
+                            @endif
+                        </x-inputs.button>
+                    </a>
+                @else
+                    <x-inputs.button disabled type="submit">Save</x-inputs.button>
+                    <x-inputs.button x-on:click.prevent="deleteSource = true">
+                        Delete
+                    </x-inputs.button>
+                    <form x-data>
+                        <x-inputs.button isHighlighted x-on:click.prevent="createGithubApp">Create GitHub Application
+                        </x-inputs.button>
+                    </form>
+                @endif
+            </div>
+        </div>
+
         <x-inputs.input id="github_app.name" label="App Name" required />
 
         @if ($github_app->app_id)
@@ -20,21 +52,64 @@
             <x-inputs.input id="github_app.client_id" label="Client Id" type="password" disabled />
             <x-inputs.input id="github_app.client_secret" label="Client Secret" type="password" disabled />
             <x-inputs.input id="github_app.webhook_secret" label="Webhook Secret" type="password" disabled />
-            <x-inputs.input noDirty type="checkbox" label="System Wide?" instantSave id="is_system_wide" />
-            <div class="py-2">
-                <x-inputs.button isBold type="submit">Save</x-inputs.button>
-                <x-inputs.button isWarning x-on:click.prevent="deleteSource = true">
-                    Delete
-                </x-inputs.button>
-            </div>
+            <x-inputs.checkbox noDirty label="System Wide?" instantSave id="is_system_wide" />
         @else
-            <x-inputs.input noDirty type="checkbox" label="System Wide?" instantSave id="is_system_wide" />
+            <x-inputs.checkbox noDirty label="System Wide?" instantSave id="is_system_wide" />
             <div class="py-2">
-                <x-inputs.button isBold type="submit">Save</x-inputs.button>
-                <x-inputs.button isWarning x-on:click.prevent="deleteSource = true">
-                    Delete
-                </x-inputs.button>
+
             </div>
         @endif
     </form>
+    @if (!$github_app->app_id)
+        <script>
+            function createGithubApp() {
+                const {
+                    organization,
+                    uuid,
+                    html_url
+                } = @json($github_app);
+                let baseUrl = @js($host);
+                const name = @js($name);
+                const isDev = @js(config('app.env')) === 'local';
+                const devWebhook = @js(config('coolify.dev_webhook'));
+                if (isDev && devWebhook) {
+                    baseUrl = devWebhook;
+                }
+                const webhookBaseUrl = `${baseUrl}/webhooks`;
+                const path = organization ? `organizations/${organization}/settings/apps/new` : 'settings/apps/new';
+                const data = {
+                    name,
+                    url: baseUrl,
+                    hook_attributes: {
+                        url: `${webhookBaseUrl}/source/github/events`,
+                        active: true,
+                    },
+                    redirect_url: `${webhookBaseUrl}/source/github/redirect`,
+                    callback_urls: [`${baseUrl}/login/github/app`],
+                    public: false,
+                    request_oauth_on_install: false,
+                    setup_url: `${webhookBaseUrl}/source/github/install?source=${uuid}`,
+                    setup_on_update: true,
+                    default_permissions: {
+                        contents: 'read',
+                        metadata: 'read',
+                        pull_requests: 'read',
+                        emails: 'read'
+                    },
+                    default_events: ['pull_request', 'push']
+                };
+                const form = document.createElement('form');
+                form.setAttribute('method', 'post');
+                form.setAttribute('action', `${html_url}/${path}?state=${uuid}`);
+                const input = document.createElement('input');
+                input.setAttribute('id', 'manifest');
+                input.setAttribute('name', 'manifest');
+                input.setAttribute('type', 'hidden');
+                input.setAttribute('value', JSON.stringify(data));
+                form.appendChild(input);
+                document.getElementsByTagName('body')[0].appendChild(form);
+                form.submit();
+            }
+        </script>
+    @endif
 </div>
diff --git a/resources/views/livewire/switch-team.blade.php b/resources/views/livewire/switch-team.blade.php
index 22830065b..29dcbd6db 100644
--- a/resources/views/livewire/switch-team.blade.php
+++ b/resources/views/livewire/switch-team.blade.php
@@ -2,7 +2,7 @@
     <h3>Other Teams</h3>
     <div class="flex flex-col gap-2">
         @foreach (auth()->user()->otherTeams() as $team)
-            <x-inputs.button isBold wire:key="{{ $team->id }}" wire:click="switch_to('{{ $team->id }}')">Switch
+            <x-inputs.button wire:key="{{ $team->id }}" wire:click="switch_to('{{ $team->id }}')">Switch
                 to:
                 {{ $team->name }}</x-inputs.button>
         @endforeach
diff --git a/resources/views/project/application/configuration.blade.php b/resources/views/project/application/configuration.blade.php
index 3c794d5a9..84d09dccb 100644
--- a/resources/views/project/application/configuration.blade.php
+++ b/resources/views/project/application/configuration.blade.php
@@ -1,8 +1,8 @@
 <x-layout>
     <x-applications.navbar :application="$application" />
     <h1 class="py-10">Configuration</h1>
-    <div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'general' }" class="flex pt-6">
-        <div class="flex flex-col min-w-fit">
+    <div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'general' }" class="flex h-full pt-6">
+        <div class="flex flex-col gap-4 min-w-fit">
             <a :class="activeTab === 'general' && 'text-white'"
                 @click.prevent="activeTab = 'general'; window.location.hash = 'general'" href="#">General</a>
             <a :class="activeTab === 'environment-variables' && 'text-white'"
@@ -25,12 +25,15 @@
                 @click.prevent="activeTab = 'resource-limits'; window.location.hash = 'resource-limits'"
                 href="#">Resource Limits
             </a>
+            <a :class="activeTab === 'danger' && 'text-white'"
+                @click.prevent="activeTab = 'danger'; window.location.hash = 'danger'" href="#">Danger Zone
+            </a>
             {{-- <a :class="activeTab === 'previews' && 'text-white'"
                 @click.prevent="activeTab = 'previews'; window.location.hash = 'previews'" href="#">Previews
             </a> --}}
         </div>
-        <div class="w-full pt-2 pl-8">
-            <div x-cloak x-show="activeTab === 'general'">
+        <div class="w-full pl-8">
+            <div x-cloak x-show="activeTab === 'general'" class="h-full">
                 <livewire:project.application.general :application="$application" />
             </div>
             <div x-cloak x-show="activeTab === 'environment-variables'">
@@ -51,6 +54,9 @@
             <div x-cloak x-show="activeTab === 'resource-limits'">
                 <livewire:project.application.resource-limits :application="$application" />
             </div>
+            <div x-cloak x-show="activeTab === 'danger'">
+                <livewire:project.application.danger :application="$application" />
+            </div>
             {{-- <div x-cloak x-show="activeTab === 'previews'">
                 <livewire:project.application.previews :application="$application" />
             </div> --}}
diff --git a/resources/views/server/show.blade.php b/resources/views/server/show.blade.php
index e7977d4b3..5000e745d 100644
--- a/resources/views/server/show.blade.php
+++ b/resources/views/server/show.blade.php
@@ -1,7 +1,7 @@
 <x-layout>
-    <div class="text-3xl font-bold">Server</div>
+    <h1>Server</h1>
     <div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'general' }" class="flex pt-6">
-        <div class="flex flex-col min-w-fit">
+        <div class="flex flex-col gap-4 min-w-fit">
             <a :class="activeTab === 'general' && 'text-white'"
                 @click.prevent="activeTab = 'general'; window.location.hash = 'general'" href="#">General</a>
             <a :class="activeTab === 'proxy' && 'text-white'"
diff --git a/resources/views/source/github/show.blade.php b/resources/views/source/github/show.blade.php
index dec78d335..d1da2979f 100644
--- a/resources/views/source/github/show.blade.php
+++ b/resources/views/source/github/show.blade.php
@@ -1,67 +1,3 @@
 <x-layout>
-    <h1>GitHub App</h1>
-    <livewire:source.github.change :github_app="$github_app" />
-    @if (!$github_app->app_id)
-        <form x-data>
-            <x-inputs.button x-on:click.prevent="createGithubApp">Create GitHub Application</x-inputs.button>
-        </form>
-        <script>
-            function createGithubApp() {
-                const {
-                    organization,
-                    uuid,
-                    html_url
-                } = @json($github_app);
-                let baseUrl = @js($host);
-                const name = @js($name);
-                const isDev = @js(config('app.env')) === 'local';
-                const devWebhook = @js(config('coolify.dev_webhook'));
-                if (isDev && devWebhook) {
-                    baseUrl = devWebhook;
-                }
-                const webhookBaseUrl = `${baseUrl}/webhooks`;
-                const path = organization ? `organizations/${organization}/settings/apps/new` : 'settings/apps/new';
-                const data = {
-                    name,
-                    url: baseUrl,
-                    hook_attributes: {
-                        url: `${webhookBaseUrl}/source/github/events`,
-                        active: true,
-                    },
-                    redirect_url: `${webhookBaseUrl}/source/github/redirect`,
-                    callback_urls: [`${baseUrl}/login/github/app`],
-                    public: false,
-                    request_oauth_on_install: false,
-                    setup_url: `${webhookBaseUrl}/source/github/install?source=${uuid}`,
-                    setup_on_update: true,
-                    default_permissions: {
-                        contents: 'read',
-                        metadata: 'read',
-                        pull_requests: 'read',
-                        emails: 'read'
-                    },
-                    default_events: ['pull_request', 'push']
-                };
-                const form = document.createElement('form');
-                form.setAttribute('method', 'post');
-                form.setAttribute('action', `${html_url}/${path}?state=${uuid}`);
-                const input = document.createElement('input');
-                input.setAttribute('id', 'manifest');
-                input.setAttribute('name', 'manifest');
-                input.setAttribute('type', 'hidden');
-                input.setAttribute('value', JSON.stringify(data));
-                form.appendChild(input);
-                document.getElementsByTagName('body')[0].appendChild(form);
-                form.submit();
-            }
-        </script>
-    @elseif($github_app->app_id && !$github_app->installation_id)
-        <a href="{{ $installation_url }}">
-            <x-inputs.button isBold>Install Repositories</x-inputs.button>
-        </a>
-    @elseif($github_app->app_id && $github_app->installation_id)
-        <a href="{{ $installation_url }}">
-            <x-inputs.button isBold>Update Repositories</x-inputs.button>
-        </a>
-    @endif
+    <livewire:source.github.change :github_app="$github_app" :installation_url="$installation_url" :host="$host" :name="$name" />
 </x-layout>
diff --git a/tailwind.config.js b/tailwind.config.js
index 2b3c26a2b..1d29f994a 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -30,6 +30,10 @@ module.exports = {
         }
     },
   },
+  variants: {
+		scrollbar: ['dark'],
+		extend: {}
+	},
   daisyui: {
     themes: [
       {
@@ -47,5 +51,5 @@ module.exports = {
       }
     ],
   },
-  plugins: [require("@tailwindcss/typography"),require("daisyui")],
+  plugins: [require('tailwindcss-scrollbar'),require("@tailwindcss/typography"),require("daisyui")],
 }