From 89593ead7c0010daacb0850dd25ec316c86497b7 Mon Sep 17 00:00:00 2001
From: Ben Weeks <ben.weeks@outlook.com>
Date: Mon, 22 Dec 2025 23:58:32 +0000
Subject: [PATCH] fix: reduce gap between Relay URL input and Add Relay button
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Use q-col-gutter-sm instead of individual q-pa-md on columns
- Add items-center for vertical alignment
- Use col-auto for settings button to take minimum space

Closes #58

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 templates/nostrclient/index.html | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/templates/nostrclient/index.html b/templates/nostrclient/index.html
index ca44f1b..185772c 100644
--- a/templates/nostrclient/index.html
+++ b/templates/nostrclient/index.html
@@ -4,8 +4,8 @@
   <div class="col-12 col-md-7 q-gutter-y-md">
     <q-card>
       <q-form @submit="addRelay">
-        <div class="row">
-          <div class="col-12 col-md-7 q-pa-md">
+        <div class="row items-center q-pa-md q-col-gutter-sm">
+          <div class="col-12 col-md-7">
             <q-input
               outlined
               v-model="relayToAdd"
@@ -14,12 +14,11 @@
               label="Relay URL"
             ></q-input>
           </div>
-          <div class="col-6 col-md-3 q-pa-md">
+          <div class="col-auto">
             <q-btn-dropdown
               unelevated
               split
               color="primary"
-              class="float-left"
               type="submit"
               label="Add Relay"
             >
@@ -36,13 +35,13 @@
               </q-item>
             </q-btn-dropdown>
           </div>
-          <div class="col-6 col-md-2 q-pa-md">
+          <div class="col"></div>
+          <div class="col-auto">
             <q-btn
               unelevated
               @click="config.showDialog = true"
               color="primary"
               icon="settings"
-              class="float-right"
             ></q-btn>
           </div>
         </div>