feat(design): make titles and list items unselectable

flyck · Oct 18, 2024 · db31726 · db31726
1 parent 10b572a
commit db31726
Show file tree

Hide file tree

Showing 5 changed files with 7 additions and 5 deletions.
diff --git a/src/components/content/participantList.astro b/src/components/content/participantList.astro
@@ -13,7 +13,7 @@ const { participants } = Astro.props;
 ---
 <ul id="openEditParticipantModal">
   {participants.map((p) =>
-  <button id={p.id.toString()} class="border-b border-gray-500 p-2 w-full text-left text-sm"
+  <button id={p.id.toString()} class="border-b border-gray-500 p-2 w-full text-left text-sm select-none"
           data-id={p.id.toString()} data-name={p.name} data-email={p.email}
   >
     {p.name} ({p.email || "?"})

diff --git a/src/components/content/taskList.astro b/src/components/content/taskList.astro
@@ -20,7 +20,7 @@ const { tasks, participants } = Astro.props;
 ---
 <ul id="openEditTaskModal">
     {tasks.map((t, index) =>
-    <div id={index.toString()} class="flex items-center justify-between border-b border-gray-500 p-2 cursor-pointer"
+    <div id={index.toString()} class="flex items-center justify-between border-b border-gray-500 p-2 cursor-pointer select-none"
          data-id={t.id.toString()} data-title={t.title.toString()}
          data-status={t.status} data-description={t.description} data-assignee={t.assignee}>
       <div class="text-sm">{t.title || "?"}{t.assignee ? ` (${participants.find(participant => participant.id == t.assignee)!.name})` : ''}</div>

diff --git a/src/components/submitButton.astro b/src/components/submitButton.astro
@@ -6,7 +6,9 @@ interface Props {
 const { class: className, ...rest } = Astro.props;
 import Spinner from "./mini/spinner.astro";
 ---
-<button id="button-spinner" class="disabled:bg-gray-800 bg-blue-700 text-gray-200 rounded-b-lg w-full h-8 flex justify-center items-center" type="submit" {...rest}>
+<button id="button-spinner"
+        class="disabled:bg-gray-800 bg-blue-700 text-gray-200 rounded-b-lg w-full h-8 flex justify-center items-center"
+        type="submit" {...rest}>
   <div class="block htmx-request:hidden">
     <slot  />
   </div>

diff --git a/src/layouts/Modal.astro b/src/layouts/Modal.astro
@@ -18,7 +18,7 @@ const id = Astro.props.id || `${title.replaceAll(" ", "")}Modal`;
     <div class="flex w-7 mr-2" />
     <div class="w-full modal-content h-96">
       <div class="mb-4">
-        <div class="w-full dark:bg-gray-900 bg-gray-100 dark:border-gray-800 p-2 rounded-lg text-center border">
+        <div class="w-full dark:bg-gray-900 bg-gray-100 dark:border-gray-800 p-2 rounded-lg text-center border select-none">
           <div class="flex justify-between">
             <>{title}</>
             <button class="" id={closeButtonId}>

diff --git a/src/layouts/PageLayout.astro b/src/layouts/PageLayout.astro
@@ -28,7 +28,7 @@ const { left, right, title } = Astro.props;
 
         <div class="w-full h-96">
           <div class="mb-4">
-            <div class="w-full dark:bg-gray-900 bg-gray-100 dark:border-gray-800 p-2 rounded-lg text-center border"
+            <div class="w-full dark:bg-gray-900 bg-gray-100 dark:border-gray-800 p-2 rounded-lg text-center border select-none"
                  transition:name="pageLayoutTitle">
               {title}
             </div>