fix: policy template

zuplo · Dec 8, 2023 · 4e14433 · 4e14433
1 parent 3a41c1e
commit 4e14433
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 4 deletions.
diff --git a/src/app/policies/page.tsx b/src/app/policies/page.tsx
@@ -14,7 +14,7 @@ export default async function Page() {
   const policies = await getAllPolicies();
 
   return (
-    <DocsContainer>
+    <DocsContainer className="w-full px-8">
       <Prose>
         <DocsHeader title="Policies" />
         <p>

diff --git a/src/components/DocsContainer.tsx b/src/components/DocsContainer.tsx
@@ -1,8 +1,20 @@
 import { PropsWithChildren } from "react";
+import clsx from "classnames";
 
-export function DocsContainer({ children }: PropsWithChildren) {
+export function DocsContainer({
+  children,
+  className,
+}: {
+  children: React.ReactNode;
+  className?: string;
+}) {
   return (
-    <div className="sticky top-[4.75rem] -ml-0.5 flex h-[calc(100vh-7rem)] overflow-y-auto overflow-x-hidden pt-[60px]">
+    <div
+      className={clsx(
+        className,
+        "sticky top-[4.75rem] -ml-0.5 flex h-[calc(100vh-7rem)] overflow-y-auto overflow-x-hidden pt-[60px]",
+      )}
+    >
       {children}
     </div>
   );

diff --git a/src/components/PolicyCard.tsx b/src/components/PolicyCard.tsx
@@ -10,7 +10,7 @@ export const PolicyCard: React.FC<Props> = ({ name, href, icon }) => {
   return (
     <Link
       href={href}
-      className="group block flex items-center gap-4 rounded-lg border border-gray-500 bg-white p-4 text-black transition-colors hover:bg-gray-500/50 md:h-36 md:flex-col md:justify-center md:px-5 md:py-6 md:text-center"
+      className="group flex items-center gap-4 rounded-lg border border-gray-500 bg-white p-4 text-black transition-colors hover:bg-gray-500/50 md:h-36 md:flex-col md:justify-center md:px-5 md:py-6 md:text-center"
     >
       <div className="rounded-lg bg-pink/10 p-2">
         <div