mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2025-06-06 09:31:35 -04:00
Card-ify login components (#53)
* Card-ify login components * Fix lint warnings * Replace HTML with react-bootstrap components * Remove now obsolete flex div * Apply fixed width to fa-icons * Reset sign-in buttons to normal size
This commit is contained in:
parent
8636391a73
commit
7a33177014
7 changed files with 167 additions and 165 deletions
|
@ -1,6 +1,6 @@
|
|||
import React, {Fragment, useState} from "react";
|
||||
import React, {useState} from "react";
|
||||
import {Trans, useTranslation} from "react-i18next";
|
||||
import {Alert, Button, Form} from "react-bootstrap";
|
||||
import {Alert, Button, Card, Form} from "react-bootstrap";
|
||||
import {postLdapLogin} from "../../../../../api/user";
|
||||
import {getAndSetUser} from "../../../../../utils/apiUtils";
|
||||
import {useSelector} from "react-redux";
|
||||
|
@ -33,43 +33,47 @@ const ViaLdap: React.FC = () => {
|
|||
}
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<h5 className="center">
|
||||
<Trans i18nKey="signInVia" values={{service: name}}/>
|
||||
</h5>
|
||||
<Form onSubmit={onFormSubmit}>
|
||||
<Form.Group controlId="username">
|
||||
<Form.Control
|
||||
isInvalid={error}
|
||||
type="text"
|
||||
size="sm"
|
||||
placeholder={t("username")}
|
||||
onChange={(event) => setUsername(event.currentTarget.value)}
|
||||
/>
|
||||
</Form.Group>
|
||||
<Card className="bg-dark mb-4">
|
||||
<Card.Body>
|
||||
<Card.Title>
|
||||
<Trans i18nKey="signInVia" values={{service: name}}/>
|
||||
</Card.Title>
|
||||
|
||||
<Form.Group controlId="password">
|
||||
<Form.Control
|
||||
isInvalid={error}
|
||||
type="password"
|
||||
size="sm"
|
||||
placeholder={t("password")}
|
||||
onChange={(event) => setPassword(event.currentTarget.value)}
|
||||
/>
|
||||
</Form.Group>
|
||||
<Form onSubmit={onFormSubmit}>
|
||||
<Form.Group controlId="username">
|
||||
<Form.Control
|
||||
isInvalid={error}
|
||||
type="text"
|
||||
size="sm"
|
||||
placeholder={t("username")}
|
||||
onChange={(event) => setUsername(event.currentTarget.value)}
|
||||
className="bg-dark text-white"
|
||||
/>
|
||||
</Form.Group>
|
||||
|
||||
<Alert className="small" show={error} variant="danger">
|
||||
<Trans i18nKey="errorLdapLogin"/>
|
||||
</Alert>
|
||||
<Form.Group controlId="password">
|
||||
<Form.Control
|
||||
isInvalid={error}
|
||||
type="password"
|
||||
size="sm"
|
||||
placeholder={t("password")}
|
||||
onChange={(event) => setPassword(event.currentTarget.value)}
|
||||
className="bg-dark text-white"
|
||||
/>
|
||||
</Form.Group>
|
||||
|
||||
<Button
|
||||
type="submit"
|
||||
size="sm"
|
||||
variant="primary">
|
||||
<Trans i18nKey="signIn"/>
|
||||
</Button>
|
||||
</Form>
|
||||
</Fragment>
|
||||
<Alert className="small" show={error} variant="danger">
|
||||
<Trans i18nKey="errorLdapLogin"/>
|
||||
</Alert>
|
||||
|
||||
<Button
|
||||
type="submit"
|
||||
variant="primary">
|
||||
<Trans i18nKey="signIn"/>
|
||||
</Button>
|
||||
</Form>
|
||||
</Card.Body>
|
||||
</Card>
|
||||
);
|
||||
};
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue