diff --git a/src/www/src/app/(pages)/docs/_components/code-line-with-flag.tsx b/src/www/src/app/(pages)/docs/_components/code-line-with-flag.tsx
deleted file mode 100644
index f53877e..0000000
--- a/src/www/src/app/(pages)/docs/_components/code-line-with-flag.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-"use client";
-import { useToast } from "@/components/ui/use-toast";
-import { useLang } from "@/providers/lang-provider";
-import { Check, Files, X } from "lucide-react";
-import { useState } from "react";
-import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
-import { vscDarkPlus } from "react-syntax-highlighter/dist/esm/styles/prism";
-interface ICodeLineWithFlag {
-  code: string;
-  language: string;
-  className?: string;
-  showLangFlag?: boolean;
-}
-
-const CodeLineWithFlag = ({
-  code,
-  language,
-  className,
-  showLangFlag = true,
-}: ICodeLineWithFlag) => {
-  const { lang } = useLang();
-  const [isCopying, setIsCopying] = useState({
-    isCopying: false,
-    Icon: Files,
-  });
-
-  const { toast } = useToast();
-
-  const codeWithLangFlag = `${code} -${lang}`;
-
-  const handleCopy = () => {
-    setIsCopying((prev) => ({ ...prev, isCopying: true }));
-    try {
-      navigator.clipboard.writeText(showLangFlag ? codeWithLangFlag : code);
-      setIsCopying((prev) => ({ ...prev, Icon: Check }));
-      toast({
-        description: "Code copied to clipboard 🚀",
-      });
-    } catch (err) {
-      setIsCopying((prev) => ({ ...prev, Icon: X }));
-      toast({
-        description: "Failed to copy code 😢",
-        variant: "destructive",
-      });
-    } finally {
-      setTimeout(() => {
-        setIsCopying(() => ({ isCopying: false, Icon: Files }));
-      }, 2000);
-    }
-  };
-
-  return (
-    <div className={`relative overflow-y-scroll ${className}`}>
-      <button
-        disabled={isCopying.isCopying}
-        onClick={handleCopy}
-        className="hover:bg-neutral-600 p-1 rounded-md transition-colors text-neutral-300 z-40 absolute right-4 top-1/2 -translate-y-1/2"
-      >
-        <isCopying.Icon className="h-5 w-5" />
-      </button>
-
-      <SyntaxHighlighter
-        language={language}
-        customStyle={{
-          borderRadius: "0.25rem",
-          padding: "1rem",
-          width: "100%",
-        }}
-        style={vscDarkPlus}
-        codeTagProps={{
-          style: {
-            fontSize: "1rem",
-          },
-        }}
-      >
-        {showLangFlag ? codeWithLangFlag : code}
-      </SyntaxHighlighter>
-    </div>
-  );
-};
-export default CodeLineWithFlag;
diff --git a/src/www/src/app/(pages)/docs/_pages/change-log.tsx b/src/www/src/app/(pages)/docs/_pages/change-log.tsx
index d45530e..2d6058b 100644
--- a/src/www/src/app/(pages)/docs/_pages/change-log.tsx
+++ b/src/www/src/app/(pages)/docs/_pages/change-log.tsx
@@ -41,16 +41,17 @@ const ChangeLog = async () => {
             <div className="flex flex-col gap-3">
               <h3
                 className="text-lg sm:text-xl lg:text-2xl font-semibold flex gap-2"
-                id="introduction"
+                id={pr.title.replace(/ /g, "-")}
               >
-                <Link target="_blank" href={pr.html_url} className="min-w-max">
-                  <span className="hover:underline">
-                    {i + 1}. {pr.title.substring(0, 50)}
-                    {pr.title.length > 50 ? "..." : ""}
-                  </span>
+                <Link
+                  target="_blank"
+                  href={pr.html_url}
+                  className="min-w-max w-full hover:underline truncate"
+                >
+                  {i + 1}. {pr.title}
                 </Link>
               </h3>
-              <div className="prose overflow-x-hidden ml-3 lg:ml-6">
+              <div className="prose-sm overflow-x-hidden ml-3 lg:ml-6">
                 {(() => {
                   return (
                     <div
diff --git a/src/www/src/app/(pages)/docs/_pages/method-page.tsx b/src/www/src/app/(pages)/docs/_pages/method-page.tsx
index 60ecb6f..129e71c 100644
--- a/src/www/src/app/(pages)/docs/_pages/method-page.tsx
+++ b/src/www/src/app/(pages)/docs/_pages/method-page.tsx
@@ -12,7 +12,7 @@ import {
 import { marked } from "marked";
 import ExampleTabs from "../_components/example-tabs";
 import { LangProvider } from "@/providers/lang-provider";
-import CodeLineWithFlag from "../_components/code-line-with-flag";
+import CodeLine from "../_components/code-line";
 const MethodPage = async ({ slug }: { slug: string[] }) => {
   if (!registry) return <NotFound />;
 
@@ -61,7 +61,7 @@ const MethodPage = async ({ slug }: { slug: string[] }) => {
           {
             title: "Installation",
             toRender: (
-              <CodeLineWithFlag
+              <CodeLine
                 code={`npx @jrtilak/lazykit@latest add ${methodData.name}`}
                 language="bash"
               />