Skip to content

Commit 0c88e3d

Browse files
lsbyerleylsbyerley
committed
feat: page additions to bucnation
1 parent 5546c4e commit 0c88e3d

File tree

1 file changed

+132
-20
lines changed

1 file changed

+132
-20
lines changed

‎app/routes/bucnation.tsx

+132-20
Original file line numberDiff line numberDiff line change
@@ -74,16 +74,63 @@ const heightFromInches = (total: number) => {
7474
}
7575

7676
const games = [
77-
{
78-
opponent: 'TBD',
79-
date: 'November 18, 2024',
80-
score: {
81-
home: 0,
82-
away: 0,
83-
},
84-
image: 'https://generated.vusercontent.net/placeholder.svg',
85-
},
86-
];
77+
{
78+
opponent: 'TBD',
79+
date: 'November 18, 2024',
80+
score: {
81+
home: 0,
82+
away: 0,
83+
},
84+
image: 'https://generated.vusercontent.net/placeholder.svg',
85+
},
86+
]
87+
88+
const stats = [
89+
{
90+
firstName: 'Tester',
91+
lastName: 'McNester',
92+
position: 'SF',
93+
height: '6\'9"',
94+
points: 27.4,
95+
rebounds: 7.8,
96+
assists: 7.2,
97+
blocks: 1.1,
98+
steals: 1.3,
99+
},
100+
{
101+
firstName: 'Tester',
102+
lastName: 'McNester',
103+
position: 'SF',
104+
height: '6\'9"',
105+
points: 27.4,
106+
rebounds: 7.8,
107+
assists: 7.2,
108+
blocks: 1.1,
109+
steals: 1.3,
110+
},
111+
{
112+
firstName: 'Tester',
113+
lastName: 'McNester',
114+
position: 'SF',
115+
height: '6\'9"',
116+
points: 27.4,
117+
rebounds: 7.8,
118+
assists: 7.2,
119+
blocks: 1.1,
120+
steals: 1.3,
121+
},
122+
{
123+
firstName: 'Tester',
124+
lastName: 'McNester',
125+
position: 'SF',
126+
height: '6\'9"',
127+
points: 27.4,
128+
rebounds: 7.8,
129+
assists: 7.2,
130+
blocks: 1.1,
131+
steals: 1.3,
132+
},
133+
]
87134

88135
export default function BucNation() {
89136
const data = useLoaderData<typeof loader>()
@@ -93,7 +140,7 @@ export default function BucNation() {
93140
defaultValue="roster"
94141
className="mx-auto w-full max-w-6xl px-4 py-8 md:px-6"
95142
>
96-
<header className="mb-8 flex flex-col sm:flex-row items-center justify-between">
143+
<header className="mb-8 flex flex-col items-center justify-between sm:flex-row">
97144
<div className="flex items-center gap-4">
98145
<img
99146
src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/East_Tennessee_State_Buccaneers_logo.svg/400px-East_Tennessee_State_Buccaneers_logo.svg.png"
@@ -107,15 +154,17 @@ export default function BucNation() {
107154
<span className="text-yellow-500">Buccaneers</span> Basketball
108155
</h1>
109156
</div>
110-
<TabsList className='mt-4 sm:mt-0'>
157+
<TabsList className="mt-4 sm:mt-0">
111158
<TabsTrigger value="roster">Roster</TabsTrigger>
112159
<TabsTrigger value="schedule">Schedule</TabsTrigger>
113-
<TabsTrigger value="stats">Stats</TabsTrigger>
160+
<TabsTrigger value="stats">Stats</TabsTrigger>
114161
</TabsList>
115162
</header>
116163

117164
<TabsContent value="roster">
118-
<h2 className="my-8 text-xl font-bold text-center sm:text-left">Roster</h2>
165+
<h2 className="my-8 text-center text-xl font-bold sm:text-left">
166+
Roster
167+
</h2>
119168
<div className="grid grid-cols-1 gap-6 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
120169
{data.roster.map(r => {
121170
return (
@@ -148,8 +197,9 @@ export default function BucNation() {
148197
</div>
149198
</TabsContent>
150199
<TabsContent value="schedule">
151-
<h2 className="my-8 text-xl font-bold text-center sm:text-left">Schedule</h2>
152-
<p>Coming soon..</p>
200+
<h2 className="my-8 text-center text-xl font-bold sm:text-left">
201+
Schedule (coming soon..)
202+
</h2>
153203
<div className="grid grid-cols-1 gap-6 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
154204
{games.map((game, index) => (
155205
<Card key={index} className="p-4">
@@ -184,10 +234,72 @@ export default function BucNation() {
184234
))}
185235
</div>
186236
</TabsContent>
187-
<TabsContent value='stats'>
188-
<h2 className="my-8 text-xl font-bold text-center sm:text-left">Stats</h2>
189-
<p>Coming soon..</p>
190-
</TabsContent>
237+
<TabsContent value="stats">
238+
<h2 className="my-8 text-center text-xl font-bold sm:text-left">
239+
Player Stats (coming soon)
240+
</h2>
241+
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
242+
{stats.map((player, index) => (
243+
<div
244+
key={index}
245+
className="flex flex-col gap-6 rounded-lg bg-white p-6 shadow-md dark:bg-gray-950"
246+
>
247+
<div className="flex items-center justify-between">
248+
<div className="flex items-center gap-4">
249+
<h3 className="text-xl font-bold">
250+
{player.firstName[0].toUpperCase()}. {player.lastName}
251+
</h3>
252+
<span className="text-sm text-gray-500 dark:text-gray-400">
253+
{player.position} | {player.height}
254+
</span>
255+
</div>
256+
</div>
257+
<div className="grid grid-cols-5 gap-4">
258+
<div className="flex flex-col items-end">
259+
<span className="text-sm text-gray-500 dark:text-gray-400">
260+
Pts
261+
</span>
262+
<span className="font-medium">
263+
{player.points.toFixed(1)}
264+
</span>
265+
</div>
266+
<div className="flex flex-col items-end">
267+
<span className="text-sm text-gray-500 dark:text-gray-400">
268+
Reb
269+
</span>
270+
<span className="font-medium">
271+
{player.rebounds.toFixed(1)}
272+
</span>
273+
</div>
274+
<div className="flex flex-col items-end">
275+
<span className="text-sm text-gray-500 dark:text-gray-400">
276+
Ast
277+
</span>
278+
<span className="font-medium">
279+
{player.assists.toFixed(1)}
280+
</span>
281+
</div>
282+
<div className="flex flex-col items-end">
283+
<span className="text-sm text-gray-500 dark:text-gray-400">
284+
Blk
285+
</span>
286+
<span className="font-medium">
287+
{player.blocks.toFixed(1)}
288+
</span>
289+
</div>
290+
<div className="flex flex-col items-end">
291+
<span className="text-sm text-gray-500 dark:text-gray-400">
292+
Stl
293+
</span>
294+
<span className="font-medium">
295+
{player.steals.toFixed(1)}
296+
</span>
297+
</div>
298+
</div>
299+
</div>
300+
))}
301+
</div>
302+
</TabsContent>
191303
</Tabs>
192304
)
193305
}

0 commit comments

Comments
 (0)