ps2.live-old/app/components/about.css.ts

78 lines
1.5 KiB
TypeScript

import { style } from "@vanilla-extract/css";
export const header = style({
fontSize: "2rem",
padding: "1rem",
});
export const outer = style({
display: "flex",
alignItems: "center",
justifyContent: "center",
minHeight: "calc(100vh - 300px)",
textAlign: "center",
flexDirection: "column",
});
export const link = style({
color: "#9e9e9e",
textDecoration: "none",
transition: "color 0.2s ease-in-out",
":hover": {
color: "#d53875",
},
});
export const itemContainer = style({
display: "flex",
flexWrap: "wrap",
justifyContent: "center",
alignItems: "center",
flexDirection: "column",
});
export const item = style({
listStyle: "none",
display: "flex",
padding: "1.5rem 1rem",
fontSize: "1.5rem",
backgroundColor: "#222",
margin: "1rem",
borderRadius: "0.4rem",
justifyContent: "space-between",
});
export const itemLink = style({
display: "block",
marginRight: "0.75rem",
paddingRight: "0.75rem",
borderRight: "1px solid #666",
color: "#d53875",
textDecoration: "none",
transition: "color 0.2s ease-in-out",
":hover": {
color: "#efefef",
},
});
export const itemGithubLink = style({
display: "flex",
alignItems: "center",
marginLeft: "0.75rem",
paddingLeft: "0.75rem",
borderLeft: "1px solid #666",
color: "#ddd",
textDecoration: "none",
transition: "color 0.2s ease-in-out",
fontSize: "1rem",
":hover": {
color: "#efefef",
},
});
export const love = style({
fontSize: "0.9rem",
color: "#aaa",
});