From 94a232de8bc29c3c642f50225b80131c524f81dc Mon Sep 17 00:00:00 2001
From: tgt <tgt@incognitotgt.me>
Date: Thu, 19 Dec 2024 14:09:58 -0500
Subject: [PATCH] style(fix): fix weirdness on the session screenshots and
 tweak text size

Co-authored-by: proudparrot2 <71939973+proudparrot2@users.noreply.github.com
Co-authored-by: AnonymousFxz <117674270+AnonymousFxz@users.noreply.github.com>
---
 src/app/(main)/page.tsx          | 6 +++---
 src/app/(main)/sessions/page.tsx | 4 ++--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/app/(main)/page.tsx b/src/app/(main)/page.tsx
index cf514e2..89e2f1b 100644
--- a/src/app/(main)/page.tsx
+++ b/src/app/(main)/page.tsx
@@ -20,13 +20,13 @@ export default async function Dashboard() {
 	const images = await db.select().from(image);
 	return (
 		<div className="m-auto flex w-full flex-col p-4">
-			<h1 className="text-2xl font-bold mb-6">Workspaces</h1>
+			<h1 className="text-3xl font-bold mb-6">Workspaces</h1>
 			<section className="flex flex-wrap gap-2">
 				<Suspense fallback={<Loader2 size={64} className="animate-spin" />}>
 					{images.map((image) => (
 						<Dialog key={image.dockerImage}>
 							<DialogTrigger>
-								<div className="relative w-64 aspect-[5/3] rounded-lg overflow-hidden shadow-lg bg-accent/40 backdrop-blur-lg group">
+								<div className="relative w-64 aspect-[5/3] rounded-lg overflow-hidden shadow-lg bg-accent/40 group">
 									<Image
 										src={image.icon}
 										alt={image.friendlyName}
@@ -34,7 +34,7 @@ export default async function Dashboard() {
 										className="object-cover group-hover:scale-105 duration-200"
 									/>
 									<div className="absolute inset-0 bg-gradient-to-t from-accent/90 to-transparent" />
-									<div className="absolute bottom-2 left-2 text-white flex flex-col">
+									<div className="absolute bottom-2 left-2 text-foreground flex flex-col">
 										<h3 className="text-lg font-bold">{image.friendlyName}</h3>
 										<p className="text-left text-sm text-muted-foreground">{image.category}</p>
 									</div>
diff --git a/src/app/(main)/sessions/page.tsx b/src/app/(main)/sessions/page.tsx
index e70bb0f..2623335 100644
--- a/src/app/(main)/sessions/page.tsx
+++ b/src/app/(main)/sessions/page.tsx
@@ -61,7 +61,7 @@ export default async function Dashboard() {
 	const containerStates = await Promise.all(sessions.map((session) => docker.getContainer(session.id).inspect()));
 	return (
 		<div className="m-auto flex w-full flex-col p-4">
-			<h1 className="text-2xl font-bold mb-6">Sessions</h1>
+			<h1 className="text-3xl font-bold mb-6">Sessions</h1>
 			<section className="flex flex-wrap gap-1">
 				<Suspense fallback={<Loader2 size={64} className="animate-spin" />}>
 					{sessions.length ? (
@@ -121,7 +121,7 @@ export default async function Dashboard() {
 													fill
 													sizes="6.5rem 13rem"
 													alt=""
-													className="object-fill rounded-sm md:h-[6.5rem] md:w-[13rem] h-[3.25rem] w-[6.5rem]"
+													className="object-fill rounded-none md:h-[6.5rem] md:w-[13rem] h-[3.25rem] w-[6.5rem]"
 												/>
 											) : (
 												<div className="flex items-center justify-center rounded-sm bg-muted h-36 w-full">