diff --git a/src/components/Library/LibraryItemComponent.tsx b/src/components/Library/LibraryItemComponent.tsx
index 6c992ee..f5d514d 100644
--- a/src/components/Library/LibraryItemComponent.tsx
+++ b/src/components/Library/LibraryItemComponent.tsx
@@ -1,4 +1,3 @@
-import styles from "styles/Library/LibraryItemComponent.module.css";
import Link from "next/link";
import Image from "next/image";
import { GetLibraryItemsPreviewQuery } from "graphql/operations-types";
@@ -31,7 +30,7 @@ export default function LibraryItemComponent(
return (
-
+
{prettyTitleSubtitle(
props.item.attributes.title,
diff --git a/src/components/Panels/ContentPanel.tsx b/src/components/Panels/ContentPanel.tsx
index 279f132..5385545 100644
--- a/src/components/Panels/ContentPanel.tsx
+++ b/src/components/Panels/ContentPanel.tsx
@@ -1,22 +1,24 @@
type ContentPanelProps = {
children: React.ReactNode;
autoformat?: boolean;
+ width?: ContentPanelWidthSizes;
};
-export default function ContentPanel(props: ContentPanelProps): JSX.Element {
- if (props.autoformat) {
- return (
-
-
- {props.children}
-
-
- );
- } else {
- return (
-
- {props.children}
-
- );
- }
+export enum ContentPanelWidthSizes {
+ default,
+ large,
+}
+
+export default function ContentPanel(props: ContentPanelProps): JSX.Element {
+ const width = props.width ? props.width : ContentPanelWidthSizes.default;
+ const widthCSS = width === ContentPanelWidthSizes.default ? "w-[45rem]" : "w-full";
+ const prose = props.autoformat ? "prose" : "";
+
+ return (
+
+
+ {props.children}
+
+
+ );
}
diff --git a/src/pages/library/index.tsx b/src/pages/library/index.tsx
index ae282bf..d8d0a9d 100644
--- a/src/pages/library/index.tsx
+++ b/src/pages/library/index.tsx
@@ -1,6 +1,6 @@
import { GetStaticProps } from "next";
import SubPanel from "components/Panels/SubPanel";
-import ContentPanel from "components/Panels/ContentPanel";
+import ContentPanel, { ContentPanelWidthSizes } from "components/Panels/ContentPanel";
import LibraryItemComponent from "components/Library/LibraryItemComponent";
import { applyCustomAppProps } from "pages/_app";
import { GetLibraryItemsPreviewQuery } from "graphql/operations-types";
@@ -30,7 +30,7 @@ export default function Library(props: Props): JSX.Element {
-
+
{props.libraryItems.libraryItems.data.map((item) => (
))}