Fix

codicocodes · Jan 14, 2024 · 23e58d9 · 23e58d9
1 parent aa096c9
commit 23e58d9
Show file tree

Hide file tree

Showing 4 changed files with 38 additions and 34 deletions.
diff --git a/src/lib/components/CoolTextOnHover.svelte b/src/lib/components/CoolTextOnHover.svelte
@@ -1,5 +1,5 @@
 <span
-	class="hover:cursor-pointer hover:text-transparent hover:bg-clip-text hover:bg-gradient-primary"
+	class="hover:cursor-pointer hover:text-transparent hover:bg-clip-text hover:bg-gradient-primary w-full"
 >
 	<slot />
 </span>
diff --git a/src/lib/components/MultiSelectFilter.svelte b/src/lib/components/MultiSelectFilter.svelte
@@ -33,25 +33,27 @@
 	<div class="px-1 flex text-xs font-semibold gap-2 flex-wrap">
 		{title}
 	</div>
-	<input bind:value={filter} placeholder="filter" class="bg-black/30 border-[1px] border-accent-muted focus:outline-none px-2 py-1 rounded text-sm text-muted-bright" />
+	<input
+		bind:value={filter}
+		placeholder="filter"
+		class="bg-black/30 border-[1px] border-accent-muted focus:outline-none px-2 py-1 rounded text-sm text-muted-bright"
+	/>
 	<div class="flex flex-wrap gap-1 text-xs mt-2">
 		{#each items
 			.filter((c) => (selected.size > 0 ? !selected.has(c) : true))
 			.filter((c) => c.toLowerCase().includes(filter.toLowerCase()))
 			.slice(0, expanded ? -1 : expandAtCount) as currItem}
-			<CoolTextOnHover>
-				<button
-					in:fly
-					class={`py-1 px-2 cursor-pointer rounded bg-white focus:shadow-main font-medium text-black`}
-					on:click={() => {
-						selected.add(currItem);
-						selected = selected;
-						sendSelectionUpdated();
-					}}
-				>
-					{currItem}
-				</button>
-			</CoolTextOnHover>
+			<button
+				in:fly
+				class={`py-1 px-2 cursor-pointer rounded bg-white focus:shadow-main font-medium text-black`}
+				on:click={() => {
+					selected.add(currItem);
+					selected = selected;
+					sendSelectionUpdated();
+				}}
+			>
+				{currItem}
+			</button>
 		{/each}
 
 		{#if !expanded}

diff --git a/src/lib/components/SingleSelectFilter.svelte b/src/lib/components/SingleSelectFilter.svelte
@@ -32,7 +32,11 @@
 	<div class="px-1 flex text-xs font-semibold gap-2 flex-wrap">
 		{title}
 	</div>
-	<input bind:value={filter} placeholder="filter" class="px-2 py-1 rounded text-sm text-accent-bright focus:outline-none" />
+	<input
+		bind:value={filter}
+		placeholder="filter"
+		class="px-2 py-1 rounded text-sm text-accent-bright focus:outline-none"
+	/>
 	<div class="flex flex-wrap gap-1 aext-xs mt-2">
 		{#if selected}
 			<CoolTextWithChildren>
@@ -51,18 +55,16 @@
 			.filter((c) => selected !== c)
 			.filter((c) => c.toLowerCase().includes(filter.toLowerCase()))
 			.slice(0, expanded ? -1 : expandAtCount) as currItem}
-			<CoolTextOnHover>
-				<button
-					in:fly
-					class={`py-1 px-2 cursor-pointer rounded bg-white/30 focus:shadow-main font-medium`}
-					on:click={() => {
-						selected = currItem;
-						sendSelectionUpdated();
-					}}
-				>
-					{currItem}
-				</button>
-			</CoolTextOnHover>
+			<button
+				in:fly
+				class={`py-1 px-2 cursor-pointer rounded bg-white focus:shadow-main font-medium text-black`}
+				on:click={() => {
+					selected = currItem;
+					sendSelectionUpdated();
+				}}
+			>
+				{currItem}
+			</button>
 		{/each}
 
 		{#if !expanded}

diff --git a/src/routes/this-week-in-neovim/+page.svelte b/src/routes/this-week-in-neovim/+page.svelte
@@ -53,9 +53,9 @@
 		<h2 class="font-semibold text-3xl">Past issues</h2>
 		<div class="flex flex-col gap-4">
 			{#each data.posts as post}
-				<CoolTextOnHover>
-					<GlossyCard>
-						<div class="flex w-full p-4 whitespace-normal">
+				<GlossyCard>
+					<div class="flex w-full p-4 whitespace-normal">
+						<CoolTextOnHover>
 							<a
 								class="flex w-full text-xl font-light justify-between"
 								href="/this-week-in-neovim/{post.issue}"
@@ -70,9 +70,9 @@
 									<Fa size="xs" class="force-white-text" icon={faChevronCircleRight} />
 								</span>
 							</a>
-						</div>
-					</GlossyCard>
-				</CoolTextOnHover>
+						</CoolTextOnHover>
+					</div></GlossyCard
+				>
 			{/each}
 		</div>
 		<Pagination page={$page} next={data.pagination.next} previous={data.pagination.prev} />