Hackathons/Bitcamp-2025
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI Update

Browse Source
This commit is contained in:
GamerBoss101
2025-04-13 00:40:25 -04:00
parent bd51b6a486
commit e00776d20b
8 changed files with 33 additions and 98 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/(app)/guide/Info.tsx
View File

@@ -5,7 +5,7 @@ import React from "react";
const InfoContent = () => {
return (
<div className="px-6 py-10 max-w-full lg:max-w-1/2 mx-auto font-sans text-neutral-100">
<div>
<h1 className="text-3xl dark:text-3xl font-bold mb-4">
Beverage Consumption Info!
</h1>

2
src/app/(app)/guide/PointGuide.tsx
View File

@@ -56,7 +56,7 @@ const tableData = [
const PointGuide = () => {
return (
<div className="px-6 py-10 max-w-full lg:max-w-3/4 mx-auto font-sans text-neutral-100">
<div>
<h1 className="text-2xl sm:text-3xl font-bold mb-4 text-white">
Points Guide
</h1>

1
src/app/(app)/guide/page.tsx
View File

@@ -9,6 +9,7 @@ export default function InfoPage() {
return (
<div className="px-6 py-10 max-w-full lg:max-w-3/4 mx-auto font-sans text-neutral-100">
<img src="/drinkhappylogo.png" alt="Drink Happy Logo Image" className="h-auto my-4 mx-auto w-3/4 lg:w-1/3" />
<div className="flex justify-center gap-4 mb-6">
<button
className={`px-4 py-2 rounded ${

3
src/app/(app)/layout.tsx
View File

@@ -13,8 +13,7 @@ export default function RootLayout({
return (
<main className="max-h-screen max-w-screen bg-img overflow-hidden" suppressHydrationWarning={true}>
{!isMobile && !isSafari ? <NavBar /> : null}
<section className="space-x-2 gap-4 flex flex-col overflow-y-auto h-screen p-4 lg:p-6 lg:rounded-xl lg:shadow-sm">
<img src="/drinkhappylogo.png" alt="Drink Happy Logo Image" className="h-auto mx-auto w-3/4 lg:w-1/3" />
<section className="space-x-2 gap-4 flex flex-col overflow-y-auto h-screen p-4 lg:p-6 lg:rounded-xl lg:shadow-sm mb-2">
{children}
</section>
{isMobile && isSafari ? (

10
src/app/(app)/page.tsx
View File

@@ -7,6 +7,11 @@ function Mobile() {
return (
<main className="flex flex-col gap-[32px] row-start-2 items-center mt-10 text-white">
<img
src="/drinkhappylogo.png"
alt="Drink Happy Logo Image"
className="h-auto mx-auto my-auto w-3/4 lg:w-1/3"
/>
<h1 className="text-3xl sm:text-4xl font-bold tracking-[-.01em] text-center sm:text-left">
{isAuthenticated ? `Welcome, ${session.username} !!` : ""}
</h1>
@@ -35,6 +40,11 @@ function Web() {
return (
<main className="flex flex-col row-start-2 items-center mt-10">
<img
src="/drinkhappylogo.png"
alt="Drink Happy Logo Image"
className="h-auto mx-auto w-3/4 lg:w-1/3"
/>
<h1 className="text-3xl sm:text-4xl font-bold tracking-[-.01em] text-center sm:text-left text-white">
{isAuthenticated ? `Welcome, ${session.username} !!` : ""}
</h1>

14
src/app/(app)/profile/page.tsx
View File

@@ -7,25 +7,19 @@ export default function ProfilePage() {
const [previewUrl, setPreviewUrl] = useState<string | null>(null);
const [uploadMessage, setUploadMessage] = useState<string>("");
const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
if (event.target.files && event.target.files[0]) {
const file = event.target.files[0];
setSelectedFile(file);
setPreviewUrl(URL.createObjectURL(file)); // Generate a preview URL for the image
}
};
return (
<main className="flex flex-col items-center mt-10">
<h1 className="text-3xl font-bold mb-6">Profile Picture</h1>
<div className="flex flex-col items-center gap-4">
{(
{
<img
alt="Profile Preview"
className="w-32 h-32 rounded-full object-cover border border-gray-300"
/>
}
{uploadMessage && (
<p className="text-sm text-gray-600">{uploadMessage}</p>
)}
{uploadMessage && <p className="text-sm text-gray-600">{uploadMessage}</p>}
</div>
</main>
);

34
src/app/api/index.ts
View File

@@ -1,34 +0,0 @@
import { NextApiRequest, NextApiResponse } from 'next';
import formidable from 'formidable';
import fs from 'fs';
export const config = {
api: {
bodyParser: false, // Disable Next.js body parser to handle form data
},
};
export default async function handler(req: NextApiRequest, res: NextApiResponse) {
if (req.method === 'POST') {
const form = new formidable.IncomingForm();
form.parse(req, (err, fields, files) => {
if (err) {
console.error('Error parsing form data:', err);
return res.status(500).json({ error: 'Failed to process form data' });
}
// Access the uploaded file
const file = files.image;
if (file) {
console.log('Uploaded file:', file);
return res.status(200).json({ message: 'Image received successfully', file });
} else {
return res.status(400).json({ error: 'No image file uploaded' });
}
});
} else {
res.setHeader('Allow', ['POST']);
res.status(405).end(`Method ${req.method} Not Allowed`);
}
}

35
src/components/PostRequestComponent.tsx
View File

@@ -1,35 +0,0 @@
import React, { useState } from 'react';
const PostRequestComponent: React.FC = () => {
const [responseMessage, setResponseMessage] = useState<string>('');
const handlePostRequest = async () => {
try {
const response = await fetch('/api', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ data: 'Sample data' }),
});
if (response.ok) {
const data = await response.json();
setResponseMessage(data.message);
} else {
setResponseMessage(`Error: ${response.status}`);
}
} catch (error) {
setResponseMessage('An error occurred while making the request.');
}
};
return (
<div>
<button onClick={handlePostRequest}>Make POST Request</button>
<p>Response: {responseMessage}</p>
</div>
);
};
export default PostRequestComponent;