gib/Tech_Tracker_Web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Mostly front-end updates to make the table look more normal. Man design is hard. Most of the time I swear you are better off just doing simple colors.

Browse Source
This commit is contained in:
Gabriel Brown 2024-07-20 14:47:54 -05:00
parent 4a3eebfdf6
commit 6791cab2c6
5 changed files with 2422 additions and 2969 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -51,5 +51,5 @@
"ct3aMetadata": { "ct3aMetadata": {
"initVersion": "7.36.1" "initVersion": "7.36.1"
}, },
"packageManager": "pnpm@9.3.0" "packageManager": "pnpm@9.5.0"
} }

5373
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

4
src/components/ui/TT_Header.tsx
View File

@ -7,7 +7,9 @@ export default function TT_Header() {
<Image src="/images/tech_tracker_logo.png" <Image src="/images/tech_tracker_logo.png"
alt="Tech Tracker Logo" width={100} height={100} alt="Tech Tracker Logo" width={100} height={100}
/> />
<h1 className="title-text text-8xl font-semibold pl-12"> <h1 className="title-text text-8xl font-bold pl-12
bg-gradient-to-r from-[#bec8e6] via-[#F0EEE4] to-[#FFF8E7]
text-transparent bg-clip-text">
Tech Tracker Tech Tracker
</h1> </h1>
</div> </div>

10
src/components/ui/Table.tsx
View File

@ -122,7 +122,7 @@ export default function Table({ employees }: { employees: Employee[] }) {
return ( return (
<div> <div>
<table className="techtable w-5/6 m-auto text-center border-collapse text-[42px]"> <table className="techtable w-5/6 m-auto text-center border-collapse text-[42px]">
<thead className="bg-gradient-to-br from-[#232323] to-[#444444]"> <thead className="bg-gradient-to-b from-[#323232] to-[#444444]">
<tr> <tr>
<th className="tabletitles p-4 border border-[#3e4446] text-[48px]"> <th className="tabletitles p-4 border border-[#3e4446] text-[48px]">
<input <input
@ -139,8 +139,8 @@ export default function Table({ employees }: { employees: Employee[] }) {
</thead> </thead>
<tbody> <tbody>
{employeeData.map((employee) => ( {employeeData.map((employee) => (
<tr className="even:bg-gradient-to-br from-[#252525] to-[#333333] <tr className="even:bg-gradient-to-br from-[#282828] to-[#333333]
odd:bg-gradient-to-bl odd:from-[#212127] odd:to-[#232325]" key={employee.id}> odd:bg-gradient-to-tr odd:from-[#212127] odd:to-[#222225]" key={employee.id}>
<td className="p-1 border border-[#3e4446]"> <td className="p-1 border border-[#3e4446]">
<input <input
type="checkbox" type="checkbox"
@ -160,14 +160,14 @@ export default function Table({ employees }: { employees: Employee[] }) {
<input <input
type="text" type="text"
placeholder="New Status" placeholder="New Status"
className="min-w-[100px] p-2.5 border-none rounded-xl text-[#111111] md:text-xl" className="min-w-[120px] lg:min-w-[400px] bg-[#F9F6EE] py-2.5 px-3 border-none rounded-xl text-[#111111] md:text-xl"
value={status} value={status}
onChange={handleStatusChange} onChange={handleStatusChange}
onKeyDown={handleKeyPress} onKeyDown={handleKeyPress}
/> />
<button <button
type="submit" type="submit"
className="m-2 p-3 border-none rounded-2xl text-center className="min-w-[100px] lg:min-w-[160px] m-2 p-3 border-none rounded-xl text-center
font-semibold md:text-xl hover:text-slate-300 font-semibold md:text-xl hover:text-slate-300
hover:bg-gradient-to-bl hover:from-[#484848] hover:to-[#333333] hover:bg-gradient-to-bl hover:from-[#484848] hover:to-[#333333]
bg-gradient-to-br from-[#595959] to-[#444444]" bg-gradient-to-br from-[#595959] to-[#444444]"

2
src/styles/globals.css
View File

@ -64,7 +64,7 @@
@apply border-border; @apply border-border;
} }
body { body {
@apply bg-background text-foreground; @apply bg-background text-[#FDF5E6];
} }
} }