Compare commits

...
Sign in to create a new pull request.

1 commit

Author SHA1 Message Date
e4b8b8cdfa add: added daisyui and started changin class names 2025-04-28 21:59:46 +02:00
7 changed files with 618 additions and 132 deletions

607
front/package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -10,10 +10,13 @@
"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"
"react-router-dom": "^7.5.1",
"tailwindcss": "^4.1.4"
},
"devDependencies": {
"@eslint/js": "^9.21.0",

View file

@ -1,67 +1,49 @@
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="bank-section topbar">
<div className="topbar-left">
<Link to="/">Home</Link>
{user?.admin == 1 && (
<Link to="/admin">Admin</Link>
)}
<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>
<div className="topbar-center">
<div className="navbar-center text-xl">
<h1>Tanuki's Bank</h1>
</div>
{user ? (
<div className="topbar-right">
<span>{user.name}</span>
<button onClick={() => {
localStorage.removeItem("token")
window.location.reload()
}}>
Logout
</button>
<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>
) : (
<div className="topbar-right">
<Link to="/login">Login</Link>
<Link to="/register">Register</Link>
<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>
)}
<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>
)
}

View file

@ -1,4 +1,10 @@
html {
@import "tailwindcss";
@plugin "daisyui" {
themes: light --default, autumn --prefersdark;
}
/*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%);
}
@ -79,4 +85,4 @@ html {
align-items: center;
gap: 15px;
}
}
}*/

View file

@ -31,15 +31,20 @@ export default function Login () {
}
return (
<div className="bank-page">
<div>
<TopBar user={undefined} />
<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>
<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>
</form>
</div>
</div>
)

View file

@ -46,17 +46,19 @@ export default function Register () {
}
return (
<div className='bank-page'>
<div>
<TopBar user={undefined} />
<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>
<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>
</form>
</div>
</div>

View file

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