fix: repair rounded corners for first input

flyck · May 29, 2024 · 4641a72 · 4641a72
1 parent 22d0500
commit 4641a72
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 15 deletions.
diff --git a/src/components/content/createParticipant.astro b/src/components/content/createParticipant.astro
@@ -14,8 +14,8 @@ const { buttonId } = Astro.props;
     hx-post="/server/participant/create"
     hx-swap="none"
   >
-    <Input name="name" title="Name" value="Johnny B" autofocus={true}></Input>
+    <Input class="rounded-t-lg" name="name" title="Name" value="Johnny B" autofocus={true}></Input>
     <Input name="email" title="Email" value="john@john.de"></Input>
     <SubmitButton>Ok</SubmitButton>
   <form>
-</Modal>
+</Modal>
diff --git a/src/components/content/createTask.astro b/src/components/content/createTask.astro
@@ -16,7 +16,7 @@ const { buttonId, assignees } = Astro.props;
     hx-post="/server/task/create"
     hx-swap="none"
   >
-    <Input name="title" title="Title" value="Buy Beer" autofocus={true} />
+    <Input class="rounded-t-lg" name="title" title="Title" value="Buy Beer" autofocus={true} />
     <VirginDropdown assignees={assignees.map((p) => ({id: p.id ,name: p.name}))}/>
     <Input name="description" title="Description" value="" />
     <SubmitButton>Ok</SubmitButton>

diff --git a/src/components/content/participantList.astro b/src/components/content/participantList.astro
@@ -27,7 +27,7 @@ const { participants } = Astro.props;
     hx-swap="none"
     >
     <Input id="modal-id" name="id" title="Id" class="hidden" type="text" value="init" />
-    <Input id="modal-name" name="name" title="Name" type="text" value="init" validateUrl="/server/participant/validate" />
+    <Input class="rounded-t-lg" id="modal-name" name="name" title="Name" type="text" value="init" validateUrl="/server/participant/validate" />
     <Input id="modal-email" name="email" title="Email" type="text" value="init" validateUrl="/server/participant/validate" />
 
     <DeleteButton url="/server/participant/delete" />

diff --git a/src/components/content/partyDetails.astro b/src/components/content/partyDetails.astro
@@ -11,7 +11,7 @@ interface Props {
 
 const { loading, title, location, date, description } = Astro.props;
 ---
-<Input name="title" title="Title" value={title} loading={loading} validateUrl="/server/party/validate" />
+<Input class="rounded-t-lg" name="title" title="Title" value={title} loading={loading} validateUrl="/server/party/validate" />
 <Input name="location" title="Where" value={location} loading={loading} validateUrl="/server/party/validate" />
 <Input name="date" title="When" value={date} loading={loading} validateUrl="/server/party/validate" />
 <Input name="description" title="Description" value={description} loading={loading} validateUrl="/server/party/validate" />
diff --git a/src/components/content/taskList.astro b/src/components/content/taskList.astro
@@ -28,34 +28,34 @@ const { tasks, participants } = Astro.props;
     </div>
     )}
   </ul>
-  
-  
+
+
   <CreateTaskModal buttonId={openModalId} assignees={participants.map((p) => ({id: p.id ,name: p.name}))}/>
-  
+
   <Modal title="Edit Task" openModalId="openEditTaskModal">
     <form
       hx-post="/server/task/update"
       hx-swap="none"
       >
       <Input id="modal-id" name="id" title="Id" class="hidden" type="text" value="init"></Input>
-      <Input id="modal-title" name="title" title="Title" type="text" value="init" autofocus={true} validateUrl="/server/task/validate"></Input>
+      <Input class="rounded-t-lg" id="modal-title" name="title" title="Title" type="text" value="init" autofocus={true} validateUrl="/server/task/validate"></Input>
       <AssigneeDropdown id="modal-assignee" assignees={participants.map((p) => ({id: p.id ,name: p.name}))}/>
       <StatusDropdown id="modal-status" />
       <Input id="modal-description" name="description" title="Description" type="text" value="init" validateUrl="/server/task/validate"></Input>
-  
+
       <DeleteButton url="/server/task/delete" />
       <SubmitButton>Ok</SubmitButton>
     </form>
   </Modal>
-  
+
   <script is:inline>
       // Get the item list
       var itemList = document.getElementById('openEditTaskModal');
-  
+
       // When a list item is clicked, open the modal with the corresponding content
       itemList.addEventListener('click', function(e) {
         const properties = ["id", "title", "assignee", "status", "description"];
-  
+
         // as data-attributes are not inherited, find the data-holding parent if a child-div was clicked.
         let target = e.target;
         while (target) {
@@ -64,7 +64,7 @@ const { tasks, participants } = Astro.props;
           }
           target = target.parentNode;
         }
-  
+
         // transfer the task properties from the button metadata into the modal inputs
         properties.forEach((property) => {
           var value = target.getAttribute(`data-${property}`);
@@ -73,4 +73,3 @@ const { tasks, participants } = Astro.props;
         })
       });
   </script>
-