1
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-07-17 07:45:32 -04:00

all components should accept additional classnames

This commit is contained in:
2022-01-20 12:06:05 -05:00
parent 2162e9d563
commit 7e37adabc1
22 changed files with 150 additions and 86 deletions

View File

@@ -1,25 +1,27 @@
import classNames from "classnames";
import type { ReactNode } from "react";
import styles from "./List.module.css";
type Props = {
children: ReactNode;
className?: string;
};
export const UnorderedList = ({ children, ...rest }: Props) => (
<ul className={styles.unordered} {...rest}>
export const UnorderedList = ({ children, className, ...rest }: Props) => (
<ul className={classNames(styles.unordered, className)} {...rest}>
{children}
</ul>
);
export const OrderedList = ({ children, ...rest }: Props) => (
<ol className={styles.ordered} {...rest}>
export const OrderedList = ({ children, className, ...rest }: Props) => (
<ol className={classNames(styles.ordered, className)} {...rest}>
{children}
</ol>
);
// TODO: this is based on good faith that the children are all `<li>`s...
export const ListItem = ({ children, ...rest }: Props) => (
<li className={styles.item} {...rest}>
export const ListItem = ({ children, className, ...rest }: Props) => (
<li className={classNames(styles.item, className)} {...rest}>
{children}
</li>
);