generated from lucien/api-template
Compare commits
1 commit
Author | SHA1 | Date | |
---|---|---|---|
6b59a47b4e |
9 changed files with 134 additions and 620 deletions
|
@ -2,9 +2,9 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<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" />
|
||||
<title>Vite + React + TS</title>
|
||||
<link rel="shortcut icon" href="bank.png" type="image/png">
|
||||
<title>Tanuki's Bank</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
|
|
607
front/package-lock.json
generated
607
front/package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
@ -10,13 +10,10 @@
|
|||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@tailwindcss/vite": "^4.1.4",
|
||||
"axios": "^1.8.4",
|
||||
"daisyui": "^5.0.28",
|
||||
"react": "^19.0.0",
|
||||
"react-dom": "^19.0.0",
|
||||
"react-router-dom": "^7.5.1",
|
||||
"tailwindcss": "^4.1.4"
|
||||
"react-router-dom": "^7.5.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint/js": "^9.21.0",
|
||||
|
|
BIN
front/public/bank.png
Normal file
BIN
front/public/bank.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 14 KiB |
|
@ -1,49 +1,67 @@
|
|||
import { useState } from "react"
|
||||
import { Link } from "react-router-dom"
|
||||
import { User } from "../types"
|
||||
|
||||
export default function TopBar({ user }: { user: User | undefined }) {
|
||||
const [burgerMenuOpen, setBurgerMenuOpen] = useState(false)
|
||||
|
||||
return (
|
||||
<div className="navbar bg-base-200">
|
||||
<div className="navbar-start">
|
||||
<ul className="menu menu-horizontal rounded-box bg-base-300">
|
||||
<li>
|
||||
<Link to="/" className="">Home</Link>
|
||||
</li>
|
||||
{user?.admin == 1 && (
|
||||
<li>
|
||||
<Link to="/admin" className="">Admin</Link>
|
||||
</li>
|
||||
)}
|
||||
</ul>
|
||||
<div className="bank-section topbar">
|
||||
<div className="topbar-left">
|
||||
<Link to="/">Home</Link>
|
||||
{user?.admin == 1 && (
|
||||
<Link to="/admin">Admin</Link>
|
||||
)}
|
||||
</div>
|
||||
<div className="navbar-center text-xl">
|
||||
<div className="topbar-center">
|
||||
<h1>Tanuki's Bank</h1>
|
||||
</div>
|
||||
{user ? (
|
||||
<div className="navbar-end">
|
||||
<div className="flex items-center gap-3">
|
||||
<span>{user.name}</span>
|
||||
<button className="btn bg-accent" onClick={() => {
|
||||
localStorage.removeItem("token")
|
||||
window.location.reload()
|
||||
}}>
|
||||
Logout
|
||||
</button>
|
||||
</div>
|
||||
<div className="topbar-right">
|
||||
<span>{user.name}</span>
|
||||
<button onClick={() => {
|
||||
localStorage.removeItem("token")
|
||||
window.location.reload()
|
||||
}}>
|
||||
Logout
|
||||
</button>
|
||||
</div>
|
||||
) : (
|
||||
<div className="navbar-end">
|
||||
<ul className="menu menu-horizontal rounded-box bg-base-300">
|
||||
<li>
|
||||
<Link to="/login" className="">Login</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="/register" className="">Register</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="topbar-right">
|
||||
<Link to="/login">Login</Link>
|
||||
<Link to="/register">Register</Link>
|
||||
</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>
|
||||
)
|
||||
}
|
|
@ -1,10 +1,4 @@
|
|||
@import "tailwindcss";
|
||||
@plugin "daisyui" {
|
||||
themes: light --default, autumn --prefersdark;
|
||||
}
|
||||
|
||||
|
||||
/*html {
|
||||
html {
|
||||
background: #2a6c9b;
|
||||
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;
|
||||
gap: 15px;
|
||||
}
|
||||
}*/
|
||||
}
|
||||
|
|
|
@ -31,20 +31,15 @@ export default function Login () {
|
|||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="bank-page">
|
||||
<TopBar user={undefined} />
|
||||
<div className="card bg-base-200 m-4">
|
||||
<form onSubmit={handleSubmit} className="card-body gap-5 flex flex-col items-center">
|
||||
<div className="card-title">
|
||||
<h1>Login</h1>
|
||||
</div>
|
||||
<input type="text" id="username" name="username" className="input" value={email} onChange={(e) => setEmail(e.target.value)} placeholder="Email" />
|
||||
<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>
|
||||
<div className="bank-section">
|
||||
<h1>Login</h1>
|
||||
<form onSubmit={handleSubmit}>
|
||||
<input type="text" id="username" name="username" value={email} onChange={(e) => setEmail(e.target.value)} placeholder="Email" />
|
||||
<input type="password" id="password" name="password" value={password} onChange={(e) => setPassword(e.target.value)} placeholder="Password" />
|
||||
<button type="submit" >Login</button>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
|
@ -46,19 +46,17 @@ export default function Register () {
|
|||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className='bank-page'>
|
||||
<TopBar user={undefined} />
|
||||
<div className="card bg-base-200 m-4">
|
||||
<form onSubmit={handleSubmit} className="card-body gap-5 flex flex-col items-center">
|
||||
<div className='card-title'>
|
||||
<h1>Register</h1>
|
||||
</div>
|
||||
<input type="text" className='input' placeholder="Name" value={name} onChange={(e) => setName(e.target.value)} />
|
||||
<input type="text" className='input' placeholder="Lastname" value={lastname} onChange={(e) => setLastname(e.target.value)} />
|
||||
<input type="text" className='input' placeholder="Email" value={email} onChange={(e) => setEmail(e.target.value)} />
|
||||
<input type="text" className='input' placeholder="Numero" value={numero} onChange={(e) => setNumero(e.target.value)} />
|
||||
<input type="password" className='input' placeholder="Password" value={password} onChange={(e) => setPassword(e.target.value)} />
|
||||
<button type="submit" className='btn bg-accent'>Register</button>
|
||||
<div className='bank-section'>
|
||||
<h1>Register</h1>
|
||||
<form onSubmit={handleSubmit}>
|
||||
<input type="text" id="name" name="name" placeholder="Name" value={name} onChange={(e) => setName(e.target.value)} />
|
||||
<input type="text" id="lastname" name="lastname" placeholder="Lastname" value={lastname} onChange={(e) => setLastname(e.target.value)} />
|
||||
<input type="text" id="email" name="email" placeholder="Email" value={email} onChange={(e) => setEmail(e.target.value)} />
|
||||
<input type="text" id="numero" name="numero" placeholder="Numero" value={numero} onChange={(e) => setNumero(e.target.value)} />
|
||||
<input type="password" id="password" name="password" placeholder="Password" value={password} onChange={(e) => setPassword(e.target.value)} />
|
||||
<button type="submit">Register</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,10 +1,9 @@
|
|||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
import tailwindcss from '@tailwindcss/vite';
|
||||
|
||||
// https://vite.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [react(), tailwindcss()],
|
||||
plugins: [react()],
|
||||
server: {
|
||||
proxy: {
|
||||
'/api': {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue