Brendon/gameyfin
1
0
Fork 0
mirror of https://github.com/BrenBroZAYT/gameyfin.git synced 2026-06-16 16:20:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add autofill support for login screen (tested with Bitwarden)

Browse Source
This commit is contained in:
grimsi
2024-03-07 18:45:00 +01:00
parent 97a942c811
commit 61f04716a0
2 changed files with 32 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/App.tsx
+4 -4
View File
@@ -8,11 +8,11 @@ import React from 'react';
export default function App() { export default function App() {
return ( return (
<React.StrictMode> <React.StrictMode>
<ThemeProvider> <AuthProvider>
<AuthProvider> <ThemeProvider>
<RouterProvider router={router}/> <RouterProvider router={router}/>
</AuthProvider> </ThemeProvider>
</ThemeProvider> </AuthProvider>
</React.StrictMode> </React.StrictMode>
); );
} }
frontend/views/LoginView.tsx
+28 -13
View File
@@ -1,6 +1,6 @@
import {useAuth} from "Frontend/util/auth"; import {useAuth} from "Frontend/util/auth";
import {useState} from "react"; import {useState} from "react";
import {useNavigate} from "react-router-dom"; import {Link, useNavigate} from "react-router-dom";
import {Button, Card, Input, Typography} from "@material-tailwind/react"; import {Button, Card, Input, Typography} from "@material-tailwind/react";
export default function LoginView() { export default function LoginView() {
@@ -40,13 +40,19 @@ export default function LoginView() {
} }
}} }}
> >
<Typography variant="h6" color="blue-gray" className="-mb-3"> <label htmlFor="username">
Username <Typography variant="h6" color="blue-gray" className="-mb-3">
</Typography> Username
</Typography>
</label>
<Input <Input
onChange={(event) => { onChange={(event) => {
setUsername(event.target.value); setUsername(event.target.value);
}} }}
id="username"
type="text"
autoComplete="username"
placeholder=""
size="lg" size="lg"
className=" !border-t-blue-gray-200 focus:!border-t-gray-900" className=" !border-t-blue-gray-200 focus:!border-t-gray-900"
labelProps={{ labelProps={{
@@ -54,14 +60,19 @@ export default function LoginView() {
}} }}
crossOrigin="" //TODO: see https://github.com/creativetimofficial/material-tailwind/issues/427 crossOrigin="" //TODO: see https://github.com/creativetimofficial/material-tailwind/issues/427
/> />
<Typography variant="h6" color="blue-gray" className="-mb-3"> <label htmlFor="current-password">
Password <Typography variant="h6" color="blue-gray" className="-mb-3">
</Typography> Password
</Typography>
</label>
<Input <Input
onChange={(event) => { onChange={(event) => {
setPassword(event.target.value); setPassword(event.target.value);
}} }}
id="current-password"
type="password" type="password"
autoComplete="current-password"
placeholder=""
size="lg" size="lg"
className=" !border-t-blue-gray-200 focus:!border-t-gray-900" className=" !border-t-blue-gray-200 focus:!border-t-gray-900"
labelProps={{ labelProps={{
@@ -69,12 +80,16 @@ export default function LoginView() {
}} }}
crossOrigin="" //TODO: see https://github.com/creativetimofficial/material-tailwind/issues/427 crossOrigin="" //TODO: see https://github.com/creativetimofficial/material-tailwind/issues/427
/> />
<Button <div className="flex justify-between items-center">
type="submit" <Link to="#">Forgot password?</Link>
size="lg" <Button
fullWidth> type="submit"
Log in size="lg"
</Button> className="w-28"
>
Log in
</Button>
</div>
</form> </form>
</div> </div>
</Card> </Card>