style(database): wrap public port inputs in flex-col gap-2 container

Add wrapper div around publicPort and publicPortTimeout inputs across
all database general settings views for consistent vertical spacing.

resources/views/livewire/project/database/clickhouse/general.blade.php

@@ -54,7 +54,6 @@
                     readonly value="Starting the database will generate this." canGate="update" :canResource="$database" />
             @endif
         </div>
-        <div>
             <div class="flex flex-col py-2 w-64">
                 <div class="flex items-center gap-2 pb-2">
                     <div class="flex items-center">
@@ -76,11 +75,12 @@
                 <x-forms.checkbox instantSave id="isPublic" label="Make it publicly available" canGate="update"
                     :canResource="$database" />
             </div>
+            <div class="flex flex-col gap-2">
             <x-forms.input type="number" placeholder="5432" disabled="{{ $isPublic }}" id="publicPort" label="Public Port"
                 canGate="update" :canResource="$database" />
             <x-forms.input type="number" placeholder="3600" disabled="{{ $isPublic }}" id="publicPortTimeout"
                 label="Proxy Timeout (seconds)" helper="Timeout for the public TCP proxy connection in seconds. Default: 3600 (1 hour)." canGate="update" :canResource="$database" />
-        </div>
+            </div>
     </form>
     <h3 class="pt-4">Advanced</h3>
     <div class="w-64">

resources/views/livewire/project/database/dragonfly/general.blade.php

@@ -113,14 +113,15 @@
                 <x-forms.checkbox instantSave id="isPublic" label="Make it publicly available" canGate="update"
                     :canResource="$database" />
             </div>
-            <x-forms.input type="number" placeholder="5432" disabled="{{ $isPublic }}" id="publicPort" label="Public Port"
-                canGate="update" :canResource="$database" />
-            <x-forms.input type="number" placeholder="3600" disabled="{{ $isPublic }}" id="publicPortTimeout"
-                label="Proxy Timeout (seconds)" helper="Timeout for the public TCP proxy connection in seconds. Default: 3600 (1 hour)." canGate="update" :canResource="$database" />
-        </div>
-    </form>
-    <h3 class="pt-4">Advanced</h3>
-    <div class="w-64">
+            <div class="flex flex-col gap-2">
+                <x-forms.input type="number" placeholder="5432" disabled="{{ $isPublic }}" id="publicPort" label="Public Port"
+                    canGate="update" :canResource="$database" />
+                <x-forms.input type="number" placeholder="3600" disabled="{{ $isPublic }}" id="publicPortTimeout"
+                    label="Proxy Timeout (seconds)" helper="Timeout for the public TCP proxy connection in seconds. Default: 3600 (1 hour)." canGate="update" :canResource="$database" />
+            </div>
+        </form>
+        <h3 class="pt-4">Advanced</h3>
+        <div class="w-64">
         <x-forms.checkbox helper="Drain logs to your configured log drain endpoint in your Server settings."
             instantSave="instantSaveAdvanced" id="isLogDrainEnabled" label="Drain Logs" canGate="update"
             :canResource="$database" />

resources/views/livewire/project/database/keydb/general.blade.php

@@ -113,14 +113,15 @@
                 <x-forms.checkbox instantSave id="isPublic" label="Make it publicly available" canGate="update"
                     :canResource="$database" />
             </div>
-            <x-forms.input type="number" placeholder="5432" disabled="{{ $isPublic }}" id="publicPort" label="Public Port"
-                canGate="update" :canResource="$database" />
-            <x-forms.input type="number" placeholder="3600" disabled="{{ $isPublic }}" id="publicPortTimeout"
-                label="Proxy Timeout (seconds)" helper="Timeout for the public TCP proxy connection in seconds. Default: 3600 (1 hour)." canGate="update" :canResource="$database" />
-        </div>
+            <div class="flex flex-col gap-2">
+                <x-forms.input type="number" placeholder="5432" disabled="{{ $isPublic }}" id="publicPort" label="Public Port"
+                    canGate="update" :canResource="$database" />
+                <x-forms.input type="number" placeholder="3600" disabled="{{ $isPublic }}" id="publicPortTimeout"
+                    label="Proxy Timeout (seconds)" helper="Timeout for the public TCP proxy connection in seconds. Default: 3600 (1 hour)." canGate="update" :canResource="$database" />
         <x-forms.textarea
             helper="<a target='_blank' class='underline dark:text-white' href='https://raw.githubusercontent.com/Snapchat/KeyDB/unstable/keydb.conf'>KeyDB Default Configuration</a>"
             label="Custom KeyDB Configuration" rows="10" id="keydbConf" canGate="update" :canResource="$database" />
+            </div>
     </form>
     <h3 class="pt-4">Advanced</h3>
     <div class="w-64">

resources/views/livewire/project/database/mariadb/general.blade.php

@@ -137,10 +137,12 @@
                 <x-forms.checkbox instantSave id="isPublic" label="Make it publicly available"
                     canGate="update" :canResource="$database" />
             </div>
+            <div class="flex flex-col gap-2">
             <x-forms.input type="number" placeholder="5432" disabled="{{ $isPublic }}"
                 id="publicPort" label="Public Port" canGate="update" :canResource="$database" />
             <x-forms.input type="number" placeholder="3600" disabled="{{ $isPublic }}" id="publicPortTimeout"
                 label="Proxy Timeout (seconds)" helper="Timeout for the public TCP proxy connection in seconds. Default: 3600 (1 hour)." canGate="update" :canResource="$database" />
+            </div>
         </div>
         <x-forms.textarea label="Custom MariaDB Configuration" rows="10" id="mariadbConf"
             canGate="update" :canResource="$database" />

resources/views/livewire/project/database/mongodb/general.blade.php

@@ -151,10 +151,12 @@
                     <x-forms.checkbox instantSave id="isPublic" label="Make it publicly available"
                         canGate="update" :canResource="$database" />
                 </div>
+                <div class="flex flex-col gap-2">
                 <x-forms.input type="number" placeholder="5432" disabled="{{ $isPublic }}"
                     id="publicPort" label="Public Port" canGate="update" :canResource="$database" />
                 <x-forms.input type="number" placeholder="3600" disabled="{{ $isPublic }}" id="publicPortTimeout"
                     label="Proxy Timeout (seconds)" helper="Timeout for the public TCP proxy connection in seconds. Default: 3600 (1 hour)." canGate="update" :canResource="$database" />
+                </div>
             </div>
             <x-forms.textarea label="Custom MongoDB Configuration" rows="10" id="mongoConf"
                 canGate="update" :canResource="$database" />

resources/views/livewire/project/database/mysql/general.blade.php

@@ -153,10 +153,12 @@
                 </div>
                 <x-forms.checkbox instantSave id="isPublic" label="Make it publicly available" canGate="update" :canResource="$database" />
             </div>
+            <div class="flex flex-col gap-2">
             <x-forms.input type="number" placeholder="5432" disabled="{{ $isPublic }}"
                 id="publicPort" label="Public Port" canGate="update" :canResource="$database" />
             <x-forms.input type="number" placeholder="3600" disabled="{{ $isPublic }}" id="publicPortTimeout"
                 label="Proxy Timeout (seconds)" helper="Timeout for the public TCP proxy connection in seconds. Default: 3600 (1 hour)." canGate="update" :canResource="$database" />
+            </div>
         </div>
         <x-forms.textarea label="Custom Mysql Configuration" rows="10" id="mysqlConf" canGate="update" :canResource="$database" />
         <h3 class="pt-4">Advanced</h3>

resources/views/livewire/project/database/postgresql/general.blade.php

@@ -163,10 +163,12 @@
                         <x-forms.checkbox instantSave id="isPublic" label="Make it publicly available"
                             canGate="update" :canResource="$database" />
                     </div>
-                    <x-forms.input type="number" placeholder="5432" disabled="{{ $isPublic }}" id="publicPort"
-                        label="Public Port" canGate="update" :canResource="$database" />
-                    <x-forms.input type="number" placeholder="3600" disabled="{{ $isPublic }}" id="publicPortTimeout"
-                        label="Proxy Timeout (seconds)" helper="Timeout for the public TCP proxy connection in seconds. Default: 3600 (1 hour)." canGate="update" :canResource="$database" />
+                    <div class="flex flex-col gap-2">
+                        <x-forms.input type="number" placeholder="5432" disabled="{{ $isPublic }}" id="publicPort"
+                            label="Public Port" canGate="update" :canResource="$database" />
+                        <x-forms.input type="number" placeholder="3600" disabled="{{ $isPublic }}" id="publicPortTimeout"
+                            label="Proxy Timeout (seconds)" helper="Timeout for the public TCP proxy connection in seconds. Default: 3600 (1 hour)." canGate="update" :canResource="$database" />
+                    </div>
                 </div>
 
                 <div class="flex flex-col gap-2">

resources/views/livewire/project/database/redis/general.blade.php

@@ -132,10 +132,12 @@
                 <x-forms.checkbox instantSave id="isPublic" label="Make it publicly available"
                     canGate="update" :canResource="$database" />
             </div>
-            <x-forms.input type="number" placeholder="5432" disabled="{{ $isPublic }}"
-                id="publicPort" label="Public Port" canGate="update" :canResource="$database" />
-            <x-forms.input type="number" placeholder="3600" disabled="{{ $isPublic }}" id="publicPortTimeout"
-                label="Proxy Timeout (seconds)" helper="Timeout for the public TCP proxy connection in seconds. Default: 3600 (1 hour)." canGate="update" :canResource="$database" />
+            <div class="flex flex-col gap-2">
+                <x-forms.input type="number" placeholder="5432" disabled="{{ $isPublic }}"
+                    id="publicPort" label="Public Port" canGate="update" :canResource="$database" />
+                <x-forms.input type="number" placeholder="3600" disabled="{{ $isPublic }}" id="publicPortTimeout"
+                    label="Proxy Timeout (seconds)" helper="Timeout for the public TCP proxy connection in seconds. Default: 3600 (1 hour)." canGate="update" :canResource="$database" />
+            </div>
         </div>
         <x-forms.textarea placeholder="# maxmemory 256mb
 # maxmemory-policy allkeys-lru