dylan/gander
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Update .gitignore;

Browse Source 
Update to style of CheckoutForm
This commit is contained in:
Chris-1010
2025-01-23 11:46:40 +00:00
parent e7822f3c98
commit be30d9c924
38 changed files with 1 additions and 5201 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
frontend/src/components/Layout/BaseLayout.tsx
View File

@@ -1,24 +0,0 @@
// base.html
// src/components/Layout/BaseLayout.tsx
import React from 'react';
interface BaseLayoutProps {
children: React.ReactNode;
}
const BaseLayout: React.FC<BaseLayoutProps> = ({ children }) => {
return (
<html lang="en">
<head>
<meta charSet="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Live Stream</title>
</head>
<body>
{children}
</body>
</html>
);
};
export default BaseLayout;

21
frontend/src/components/Layout/Button.tsx
View File

@@ -1,21 +0,0 @@
import React from "react";
interface ButtonProps {
title?: string;
onClick?: () => void;
}
const Button: React.FC<ButtonProps> = ({
title = "Submit",
onClick,
}) => {
return (
<div>
<button onClick={onClick}>
{title}
</button>
</div>
);
};
export default Button;

76
frontend/src/components/Layout/ListRow.tsx
View File

@@ -1,76 +0,0 @@
import React from "react";
interface StreamItem {
id: number;
title: string;
streamer: string;
viewers: number;
thumbnail?: string;
}
interface ListEntryProps {
stream: StreamItem;
onClick?: () => void;
}
interface ListRowProps {
title: string;
description: string;
streams: StreamItem[];
onStreamClick?: (streamId: string) => void;
}
// Individual stream entry component
const ListEntry: React.FC<ListEntryProps> = ({ stream, onClick }) => {
return (
<div
className="flex flex-col bg-gray-800 rounded-lg overflow-hidden cursor-pointer hover:bg-gray-700 transition-colors"
onClick={onClick}
>
<div className="relative w-full pt-[56.25%]">
{stream.thumbnail ? (
<img
src={`images/`+stream.thumbnail}
alt={stream.title}
className="absolute top-0 left-0 w-full h-full object-cover"
/>
) : (
<div className="absolute top-0 left-0 w-full h-full bg-gray-600" />
)}
</div>
<div className="p-3">
<h3 className="font-semibold text-lg">{stream.title}</h3>
<p className="text-gray-400">{stream.streamer}</p>
<p className="text-sm text-gray-500">{stream.viewers} viewers</p>
</div>
</div>
);
};
// Row of stream entries
const ListRow: React.FC<ListRowProps> = ({
title,
description,
streams,
onStreamClick,
}) => {
return (
<div className="flex flex-col space-y-4 py-6">
<div className="space-y-1">
<h2 className="text-2xl font-bold">{title}</h2>
<p className="text-gray-400">{description}</p>
</div>
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
{streams.map((stream) => (
<ListEntry
key={stream.id}
stream={stream}
onClick={() => onStreamClick?.(stream.id)}
/>
))}
</div>
</div>
);
};
export default ListRow;

19
frontend/src/components/Layout/Logo.tsx
View File

@@ -1,19 +0,0 @@
import React from "react";
const Logo: React.FC = () => {
return (
<div className="text-center text-[12vh] font-bold text-orange-500">
<h6 className="text-sm">Go on, have a...</h6>
<div className="flex justify-center items-center space-x-6">
<span>G</span>
<span>A</span>
<span>N</span>
<span>D</span>
<span>E</span>
<span>R</span>
</div>
</div>
);
};
export default Logo;

58
frontend/src/components/Layout/Navbar.tsx
View File

@@ -1,58 +0,0 @@
import React from "react";
import Logo from "./Logo";
import Button from "./Button";
import { Link } from "react-router-dom";
import { Search, User, LogIn } from "lucide-react";
interface NavbarProps {
logged_in: boolean;
}
const Navbar: React.FC<NavbarProps> = ({ logged_in }) => {
return (
<div className="flex flex-col justify-around items-center h-[45vh]">
<Logo />
<div className="nav-buttons flex items-center space-x-4">
{logged_in ? (
<div>
<Link
to="/logout"
className="flex items-center text-gray-700 hover:text-purple-600"
>
<Button title="" />
</Link>
</div>
) : (
<div>
<Link
to="/login"
className="flex items-center text-gray-700 hover:text-purple-600"
>
<LogIn className="h-5 w-5 mr-1" />
Login
</Link>
<Link
to="/signup"
className="flex items-center text-gray-700 hover:text-purple-600"
>
<User className="h-5 w-5 mr-1" />
Sign Up
</Link>
</div>
)}
<Button title="Quick Settings" />
</div>
<div className="search-bar relative">
<input
type="text"
placeholder="Search..."
className="w-64 px-4 py-2 rounded-lg border border-gray-300 focus:outline-none focus:border-purple-500"
/>
<Search className="absolute right-3 top-2.5 h-5 w-5 text-gray-400" />
</div>
</div>
);
};
export default Navbar;