knee-cola/evidencija-rezija
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added custom login screen

Browse Source
This commit is contained in:
Nikola Derežić
2024-02-13 16:07:50 +01:00
parent fdd15565b8
commit 199159c208
9 changed files with 96 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/ui/PageFooter.tsx
View File

@@ -8,9 +8,9 @@ export const PageFooter: React.FC = () =>
<div>
<div className="flex items-center gap-2">
<Image src="/icon4.png" alt="logo" width={64} height={64}></Image>
<div className="font-title inline-flex text-3xl font-black ml-2">Bills Tracker</div>
<div className="font-title inline-flex text-3xl font-black ml-2">Moje Režije</div>
</div>
<p className="text-base-content/70 mb-5">Web app for tracking home utility bills</p>
<p className="text-base-content/70 mb-5">Web aplikacija za vođenje evidencije o pristiglim i plaćenim režijskim troškovima</p>
<Link href="/" className="link link-hover">Home</Link>
<Link href="/policy/" className="link link-hover">Privacy Policy</Link>
<Link href="/terms/" className="link link-hover">Terms of Service</Link>

2
app/ui/PageHeader.tsx
View File

@@ -3,5 +3,5 @@ import Link from "next/link";
export const PageHeader = () =>
<div className="navbar bg-base-100 mb-6">
<Link className="btn btn-ghost text-xl" href="/"><Image src="/icon3.png" alt="logo" width={48} height={48} /> Utility Bills Tracker</Link>
<Link className="btn btn-ghost text-xl" href="/"><Image src="/icon3.png" alt="logo" width={48} height={48} /> Moje Režije</Link>
</div>

23
app/ui/SignInButton.tsx Normal file
View File

@@ -0,0 +1,23 @@
"use client";
import { signIn } from "next-auth/react"
import { Button } from "@/app/ui/button";
const providerLogo = (provider: {id:string, name:string}) => {
switch(provider.id) {
case "google": return "https://authjs.dev/img/providers/google.svg";
case "facebook": return "https://authjs.dev/img/providers/facebook.svg";
case "github": return "https://authjs.dev/img/providers/github.svg";
case "twitter": return "https://authjs.dev/img/providers/twitter.svg";
case "email": return "https://authjs.dev/img/providers/email.svg";
default: return "https://authjs.dev/img/providers/google.svg";
}
}
export const SignInButton:React.FC<{ provider: {id:string, name:string} }> = ({ provider }) =>
<button className="btn btn-neutral" onClick={() => signIn(provider.id)}>
<img loading="lazy" height="24" width="24" id="provider-logo-dark" src={providerLogo(provider)} />
<span>Sign in with {provider.name}</span>
</button>