refactor(resources): use PageHeader component

Author: eric15342335

src/app/resources/page.tsx

@@ -1,3 +1,4 @@
+import { PageHeader } from "@/components/primitives/page-header";
 import { ResourceIframe } from "@/components/sections/resource-iframe";
 import { buildPageMetadata } from "@/lib/config";
 import { resources } from "@/lib/resources";
@@ -10,12 +11,11 @@ export const metadata: Metadata = buildPageMetadata("/resources", { description
 export default function Resources() {
   return (
     <div className="max-w-8xl mx-auto w-full px-4 py-12 sm:px-6 lg:px-8">
-      <div className="mb-8 text-center">
-        <p className="text-muted-foreground text-lg">
-          Here are some recommended websites. They offer more details and different perspectives on our
-          chapter's topics.
-        </p>
-      </div>
+      <PageHeader
+        title="Resource"
+        description="Here are some recommended websites. They offer more details and different perspectives on our chapter's topics."
+        className="mb-8"
+      />
       <div className="space-y-8">
         {resources.map((r) => (
           <ResourceIframe