Compare commits

..

1 commit

Author SHA1 Message Date
6b59a47b4e add: added a logo and a page name 2025-04-30 10:15:41 +02:00
9 changed files with 134 additions and 620 deletions

View file

@ -2,9 +2,9 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React + TS</title> <link rel="shortcut icon" href="bank.png" type="image/png">
<title>Tanuki's Bank</title>
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>

607
front/package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -10,13 +10,10 @@
"preview": "vite preview" "preview": "vite preview"
}, },
"dependencies": { "dependencies": {
"@tailwindcss/vite": "^4.1.4",
"axios": "^1.8.4", "axios": "^1.8.4",
"daisyui": "^5.0.28",
"react": "^19.0.0", "react": "^19.0.0",
"react-dom": "^19.0.0", "react-dom": "^19.0.0",
"react-router-dom": "^7.5.1", "react-router-dom": "^7.5.1"
"tailwindcss": "^4.1.4"
}, },
"devDependencies": { "devDependencies": {
"@eslint/js": "^9.21.0", "@eslint/js": "^9.21.0",

BIN
front/public/bank.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

View file

@ -1,49 +1,67 @@
import { useState } from "react"
import { Link } from "react-router-dom" import { Link } from "react-router-dom"
import { User } from "../types" import { User } from "../types"
export default function TopBar({ user }: { user: User | undefined }) { export default function TopBar({ user }: { user: User | undefined }) {
const [burgerMenuOpen, setBurgerMenuOpen] = useState(false)
return ( return (
<div className="navbar bg-base-200"> <div className="bank-section topbar">
<div className="navbar-start"> <div className="topbar-left">
<ul className="menu menu-horizontal rounded-box bg-base-300"> <Link to="/">Home</Link>
<li> {user?.admin == 1 && (
<Link to="/" className="">Home</Link> <Link to="/admin">Admin</Link>
</li> )}
{user?.admin == 1 && (
<li>
<Link to="/admin" className="">Admin</Link>
</li>
)}
</ul>
</div> </div>
<div className="navbar-center text-xl"> <div className="topbar-center">
<h1>Tanuki's Bank</h1> <h1>Tanuki's Bank</h1>
</div> </div>
{user ? ( {user ? (
<div className="navbar-end"> <div className="topbar-right">
<div className="flex items-center gap-3"> <span>{user.name}</span>
<span>{user.name}</span> <button onClick={() => {
<button className="btn bg-accent" onClick={() => { localStorage.removeItem("token")
localStorage.removeItem("token") window.location.reload()
window.location.reload() }}>
}}> Logout
Logout </button>
</button>
</div>
</div> </div>
) : ( ) : (
<div className="navbar-end"> <div className="topbar-right">
<ul className="menu menu-horizontal rounded-box bg-base-300"> <Link to="/login">Login</Link>
<li> <Link to="/register">Register</Link>
<Link to="/login" className="">Login</Link>
</li>
<li>
<Link to="/register" className="">Register</Link>
</li>
</ul>
</div> </div>
)} )}
<div className="burger-menu">
{burgerMenuOpen && (
<div className="burger-menu-content">
<Link to="/">Home</Link>
{user?.admin == 1 && (
<Link to="/admin">Admin</Link>
)}
{user ? (
<div className="burger-menu-user">
<span>{user.name}</span>
<button onClick={() => {
localStorage.removeItem("token")
window.location.reload()
}}>
Logout
</button>
</div>
) : (
<div className="burger-menu-user">
<Link to="/login">Login</Link>
<Link to="/register">Register</Link>
</div>
)}
</div>
)}
<button onClick={() => setBurgerMenuOpen(!burgerMenuOpen)}>
{burgerMenuOpen ? "Close" : "Menu"}
</button>
</div>
</div> </div>
) )
} }

View file

@ -1,10 +1,4 @@
@import "tailwindcss"; html {
@plugin "daisyui" {
themes: light --default, autumn --prefersdark;
}
/*html {
background: #2a6c9b; background: #2a6c9b;
background: linear-gradient(167deg, rgba(42, 108, 155, 1) 0%, rgba(87, 199, 133, 1) 50%, rgba(163, 237, 83, 1) 100%); background: linear-gradient(167deg, rgba(42, 108, 155, 1) 0%, rgba(87, 199, 133, 1) 50%, rgba(163, 237, 83, 1) 100%);
} }
@ -85,4 +79,4 @@
align-items: center; align-items: center;
gap: 15px; gap: 15px;
} }
}*/ }

View file

@ -31,20 +31,15 @@ export default function Login () {
} }
return ( return (
<div> <div className="bank-page">
<TopBar user={undefined} /> <TopBar user={undefined} />
<div className="card bg-base-200 m-4"> <div className="bank-section">
<form onSubmit={handleSubmit} className="card-body gap-5 flex flex-col items-center"> <h1>Login</h1>
<div className="card-title"> <form onSubmit={handleSubmit}>
<h1>Login</h1> <input type="text" id="username" name="username" value={email} onChange={(e) => setEmail(e.target.value)} placeholder="Email" />
</div> <input type="password" id="password" name="password" value={password} onChange={(e) => setPassword(e.target.value)} placeholder="Password" />
<input type="text" id="username" name="username" className="input" value={email} onChange={(e) => setEmail(e.target.value)} placeholder="Email" /> <button type="submit" >Login</button>
<input type="password" id="password" name="password" className="input" value={password} onChange={(e) => setPassword(e.target.value)} placeholder="Password" />
<div className="card-actions">
<button type="submit" className="btn bg-accent" >Login</button>
</div>
</form> </form>
</div> </div>
</div> </div>
) )

View file

@ -46,19 +46,17 @@ export default function Register () {
} }
return ( return (
<div> <div className='bank-page'>
<TopBar user={undefined} /> <TopBar user={undefined} />
<div className="card bg-base-200 m-4"> <div className='bank-section'>
<form onSubmit={handleSubmit} className="card-body gap-5 flex flex-col items-center"> <h1>Register</h1>
<div className='card-title'> <form onSubmit={handleSubmit}>
<h1>Register</h1> <input type="text" id="name" name="name" placeholder="Name" value={name} onChange={(e) => setName(e.target.value)} />
</div> <input type="text" id="lastname" name="lastname" placeholder="Lastname" value={lastname} onChange={(e) => setLastname(e.target.value)} />
<input type="text" className='input' placeholder="Name" value={name} onChange={(e) => setName(e.target.value)} /> <input type="text" id="email" name="email" placeholder="Email" value={email} onChange={(e) => setEmail(e.target.value)} />
<input type="text" className='input' placeholder="Lastname" value={lastname} onChange={(e) => setLastname(e.target.value)} /> <input type="text" id="numero" name="numero" placeholder="Numero" value={numero} onChange={(e) => setNumero(e.target.value)} />
<input type="text" className='input' placeholder="Email" value={email} onChange={(e) => setEmail(e.target.value)} /> <input type="password" id="password" name="password" placeholder="Password" value={password} onChange={(e) => setPassword(e.target.value)} />
<input type="text" className='input' placeholder="Numero" value={numero} onChange={(e) => setNumero(e.target.value)} /> <button type="submit">Register</button>
<input type="password" className='input' placeholder="Password" value={password} onChange={(e) => setPassword(e.target.value)} />
<button type="submit" className='btn bg-accent'>Register</button>
</form> </form>
</div> </div>
</div> </div>

View file

@ -1,10 +1,9 @@
import { defineConfig } from 'vite' import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react' import react from '@vitejs/plugin-react'
import tailwindcss from '@tailwindcss/vite';
// https://vite.dev/config/ // https://vite.dev/config/
export default defineConfig({ export default defineConfig({
plugins: [react(), tailwindcss()], plugins: [react()],
server: { server: {
proxy: { proxy: {
'/api': { '/api': {