From 4e144333c3a441e17a27450a094aa249f27848af Mon Sep 17 00:00:00 2001
From: esemenov <esemenov@ronasit.com>
Date: Fri, 8 Dec 2023 10:44:32 +0600
Subject: [PATCH] fix: policy template

---
 src/app/policies/page.tsx        |  2 +-
 src/components/DocsContainer.tsx | 16 ++++++++++++++--
 src/components/PolicyCard.tsx    |  2 +-
 3 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/app/policies/page.tsx b/src/app/policies/page.tsx
index 042b30bb..93efdd65 100644
--- 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
index 2ce13b74..4a8592c6 100644
--- 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
index 44bfa3c6..25db9bea 100644
--- 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