styling fixes

This commit is contained in:
Michael Freno
2025-12-21 01:00:57 -05:00
parent 291971a1d7
commit 200037e7a0
9 changed files with 197 additions and 102 deletions

View File

@@ -25,12 +25,17 @@ export default function EditCommentModal(props: EditCommentModalProps) {
<div class="fixed top-48 h-fit w-11/12 sm:w-4/5 md:w-2/3">
<div
id="edit_prompt"
class="fade-in z-50 rounded-md bg-zinc-600 px-8 py-4 shadow-lg dark:bg-zinc-800"
class="fade-in bg-surface1 z-50 rounded-md px-8 py-4 shadow-lg"
>
<button class="absolute right-4" onClick={() => {}}>
<Xmark strokeWidth={0.5} color="white" height={50} width={50} />
<Xmark
strokeWidth={0.5}
color="var(--color-text)"
height={50}
width={50}
/>
</button>
<div class="py-4 text-center text-3xl tracking-wide text-zinc-50">
<div class="text-text py-4 text-center text-3xl tracking-wide">
Edit Comment
</div>
<form onSubmit={editCommentWrapper}>
@@ -40,7 +45,7 @@ export default function EditCommentModal(props: EditCommentModalProps) {
ref={bodyRef}
placeholder=" "
value={props.commentBody}
class="underlinedInput w-full bg-transparent text-blue-300"
class="underlinedInput text-blue w-full bg-transparent"
rows={4}
/>
<span class="bar" />
@@ -51,17 +56,17 @@ export default function EditCommentModal(props: EditCommentModalProps) {
type="submit"
disabled={props.editCommentLoading}
class={`${
props.editCommentLoading ? "bg-zinc-400" : ""
} rounded border px-4 py-2 text-white shadow-md transition-all duration-300 ease-in-out hover:border-blue-500 hover:bg-blue-400 active:scale-90`}
props.editCommentLoading
? "bg-surface2 opacity-50"
: "border-sapphire bg-blue hover:brightness-125"
} rounded border px-4 py-2 text-base shadow-md transition-all duration-300 ease-in-out active:scale-90`}
>
Submit
</button>
</div>
</form>
<Show when={showNoChange()}>
<div class="text-center text-red-500 italic">
No change detected
</div>
<div class="text-red text-center italic">No change detected</div>
</Show>
</div>
</div>