From 99713d17408984fd93df1e001601d449934bc459 Mon Sep 17 00:00:00 2001
From: gibbyb <gib@gibbyb.com>
Date: Tue, 23 Jul 2024 15:55:58 -0500
Subject: [PATCH] adjust tv mode

---
 src/app/page.tsx                 | 2 +-
 src/components/ui/Tech_Table.tsx | 5 +++--
 src/styles/globals.css           | 9 +++++++--
 3 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 8b8bee1..c3e2fdb 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -12,7 +12,7 @@ export default async function HomePage() {
   } else {
     const employees = await getEmployees();
     return (
-      <main className="min-h-screen
+      <main className="min-h-screen 
         bg-gradient-to-b from-[#111111] to-[#212325]">
           <Header />
           <Tech_Table employees={employees}/>
diff --git a/src/components/ui/Tech_Table.tsx b/src/components/ui/Tech_Table.tsx
index 9e82eda..1257dbe 100644
--- a/src/components/ui/Tech_Table.tsx
+++ b/src/components/ui/Tech_Table.tsx
@@ -146,8 +146,9 @@ export default function Tech_Table({ employees }: { employees: Employee[] }) {
   if (loading) return <Loading interval_amount={3} />;
   else {
     return (
-      <div className={`techtable-wrapper ${tvMode ? 'content-fullscreen' : ''}`}>
-        <table className={`techtable rounded-2xl m-auto text-center text-[42px]
+      <div className={`${tvMode ? 'content-fullscreen' : ''}`}>
+        {tvMode && <div className="w-full tablefill"></div>}
+        <table className={`techtable m-auto text-center text-[42px]
           ${tvMode ? 'techtable-fullscreen' : 'w-5/6'}`}>
           <thead className="tabletitles border border-[#3e4446] bg-gradient-to-b
             from-[#282828] to-[#383838] text-[48px]">
diff --git a/src/styles/globals.css b/src/styles/globals.css
index 1de385c..4d64aec 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -121,11 +121,16 @@
 }
 
 .content-fullscreen {
-  width: 100vw;
-  height: 100vh;
+  width: 90vw;
+  height: 90vh;
+  margin: auto;
 }
 
 .techtable-fullscreen {
   width: 100%;
   height: 100%;
 }
+
+.tablefill {
+  height: 5vh;
+}