111 lines
2.1 KiB
TypeScript
111 lines
2.1 KiB
TypeScript
|
import { Roboto, Playfair_Display, Poppins } from "next/font/google";
|
||
|
|
|
||
|
|
const roboto = Roboto({
|
||
|
|
weight: ["400"],
|
||
|
|
subsets: ["latin"],
|
||
|
|
display: "swap",
|
||
|
|
});
|
||
|
|
|
||
|
|
const playfair = Playfair_Display({
|
||
|
|
weight: ["900"],
|
||
|
|
subsets: ["latin"],
|
||
|
|
display: "swap",
|
||
|
|
});
|
||
|
|
|
||
|
|
const poppins = Poppins({
|
||
|
|
weight: ["400", "700"],
|
||
|
|
subsets: ["latin"],
|
||
|
|
display: "swap",
|
||
|
|
});
|
||
|
|
|
||
|
|
export const fonts = {
|
||
|
|
roboto,
|
||
|
|
playfair,
|
||
|
|
poppins,
|
||
|
|
};
|
||
|
|
|
||
|
|
export const colors: any = {
|
||
|
|
lightGray: "#ededf0",
|
||
|
|
mediumGray: "#e3e5e5",
|
||
|
|
darkGray: "#33302f",
|
||
|
|
mediumBlue: "#4285f4",
|
||
|
|
green: "#349d7b",
|
||
|
|
lavender: "#a5a6f6",
|
||
|
|
darkLavender: "#5d5fef",
|
||
|
|
pink: "#fcddec",
|
||
|
|
cdrLinkOrange: "#ff7115",
|
||
|
|
coreYellow: "#fac942",
|
||
|
|
helpYellow: "#fff4d5",
|
||
|
|
dwcDarkBlue: "#191847",
|
||
|
|
hazyMint: "#ecf7f8",
|
||
|
|
waterbearElectricPurple: "#332c83",
|
||
|
|
waterbearLightSmokePurple: "#eff3f8",
|
||
|
|
bumpedPurple: "#212058",
|
||
|
|
mutedPurple: "#373669",
|
||
|
|
warningPink: "#ef5da8",
|
||
|
|
lightPink: "#fff0f7",
|
||
|
|
lightGreen: "#f0fff3",
|
||
|
|
lightOrange: "#fff5f0",
|
||
|
|
beige: "#f6f2f1",
|
||
|
|
almostBlack: "#33302f",
|
||
|
|
white: "#ffffff",
|
||
|
|
};
|
||
|
|
|
||
|
|
export const typography: any = {
|
||
|
|
h1: {
|
||
|
|
fontFamily: playfair.style.fontFamily,
|
||
|
|
fontSize: 45,
|
||
|
|
fontWeight: 700,
|
||
|
|
lineHeight: 1.1,
|
||
|
|
margin: 0,
|
||
|
|
},
|
||
|
|
h2: {
|
||
|
|
fontFamily: poppins.style.fontFamily,
|
||
|
|
fontSize: 35,
|
||
|
|
fontWeight: 700,
|
||
|
|
lineHeight: 1.1,
|
||
|
|
margin: 0,
|
||
|
|
},
|
||
|
|
h3: {
|
||
|
|
fontFamily: poppins.style.fontFamily,
|
||
|
|
fontWeight: 400,
|
||
|
|
fontSize: 27,
|
||
|
|
lineHeight: 1.1,
|
||
|
|
margin: 0,
|
||
|
|
},
|
||
|
|
h4: {
|
||
|
|
fontFamily: poppins.style.fontFamily,
|
||
|
|
fontWeight: 700,
|
||
|
|
fontSize: 18,
|
||
|
|
},
|
||
|
|
h5: {
|
||
|
|
fontFamily: roboto.style.fontFamily,
|
||
|
|
fontWeight: 700,
|
||
|
|
fontSize: 16,
|
||
|
|
lineHeight: "24px",
|
||
|
|
textTransform: "uppercase",
|
||
|
|
textAlign: "center",
|
||
|
|
margin: 1,
|
||
|
|
},
|
||
|
|
h6: {
|
||
|
|
fontFamily: roboto.style.fontFamily,
|
||
|
|
fontWeight: 400,
|
||
|
|
fontSize: 14,
|
||
|
|
textAlign: "center",
|
||
|
|
},
|
||
|
|
p: {
|
||
|
|
fontFamily: roboto.style.fontFamily,
|
||
|
|
fontSize: 17,
|
||
|
|
lineHeight: "26.35px",
|
||
|
|
fontWeight: 400,
|
||
|
|
margin: 0,
|
||
|
|
},
|
||
|
|
small: {
|
||
|
|
fontFamily: roboto.style.fontFamily,
|
||
|
|
fontSize: 13,
|
||
|
|
lineHeight: "18px",
|
||
|
|
fontWeight: 400,
|
||
|
|
margin: 0,
|
||
|
|
},
|
||
|
|
};
|