75 lines
1.5 KiB
TypeScript
75 lines
1.5 KiB
TypeScript
import { CSSProperties } from "react";
|
|
|
|
// Import shared tokens and styles to avoid duplication
|
|
// Note: We can't directly import tokens from shared.ts as it's not exported,
|
|
// so we'll use the shared style objects where possible
|
|
import {
|
|
layoutStyles,
|
|
cardStyles,
|
|
formStyles,
|
|
buttonStyles,
|
|
bannerStyles,
|
|
typographyStyles,
|
|
} from "./shared";
|
|
|
|
export const authFormStyles: Record<string, CSSProperties> = {
|
|
main: {
|
|
...layoutStyles.main,
|
|
...layoutStyles.contentCentered,
|
|
padding: "1rem",
|
|
},
|
|
container: {
|
|
width: "100%",
|
|
maxWidth: "420px",
|
|
},
|
|
card: {
|
|
...cardStyles.card,
|
|
padding: "3rem 2.5rem",
|
|
},
|
|
header: {
|
|
textAlign: "center" as const,
|
|
marginBottom: "2.5rem",
|
|
},
|
|
title: {
|
|
...typographyStyles.pageTitle,
|
|
fontSize: "2.5rem",
|
|
textAlign: "center" as const,
|
|
},
|
|
subtitle: {
|
|
...typographyStyles.pageSubtitle,
|
|
textAlign: "center" as const,
|
|
},
|
|
form: {
|
|
...formStyles.form,
|
|
gap: "1.5rem",
|
|
},
|
|
field: {
|
|
...formStyles.field,
|
|
},
|
|
label: {
|
|
...formStyles.label,
|
|
},
|
|
input: {
|
|
...formStyles.input,
|
|
},
|
|
button: {
|
|
...buttonStyles.primaryButton,
|
|
marginTop: "0.5rem",
|
|
},
|
|
error: {
|
|
...bannerStyles.errorBanner,
|
|
textAlign: "center" as const,
|
|
},
|
|
footer: {
|
|
fontFamily: "'DM Sans', system-ui, sans-serif",
|
|
textAlign: "center" as const,
|
|
marginTop: "2rem",
|
|
color: "rgba(255, 255, 255, 0.5)",
|
|
fontSize: "0.875rem",
|
|
},
|
|
link: {
|
|
color: "#a78bfa",
|
|
textDecoration: "none",
|
|
fontWeight: 500,
|
|
},
|
|
};
|