diff --git a/src/Components/Navbar/Navbar.tsx b/src/Components/Navbar/Navbar.tsx
index 428dff6..638fc3f 100644
--- a/src/Components/Navbar/Navbar.tsx
+++ b/src/Components/Navbar/Navbar.tsx
@@ -1,28 +1,27 @@
 import NavMobile from "./NavMobile";
-import { MdHomeFilled, MdLocalFireDepartment } from "react-icons/md";
+import { MdComment, MdHomeFilled, MdLocalFireDepartment } from "react-icons/md";
 import { IoExtensionPuzzle } from "react-icons/io5";
 import { useCallback, useEffect } from "react";
 import { useAppDispatch, useAppSelector } from "src/utils/hooks";
 import { openModal } from "src/redux/features/modals.slice";
 import { setNavHeight } from "src/redux/features/ui.slice";
-import { useResizeListener } from "src/utils/hooks";
 import NavDesktop from "./NavDesktop";
 import { useMediaQuery } from "@react-hookz/web";
 import { MEDIA_QUERIES } from "src/utils/theme/media_queries";
-import { BiComment } from "react-icons/bi";
+
 
 export const navLinks = [
   { text: "Explore", url: "/", icon: MdHomeFilled, color: "text-primary-600" },
   {
-    text: "Hottest",
-    url: "/hottest",
-    icon: MdLocalFireDepartment,
+    text: "Blog",
+    url: "/blog",
+    icon: MdComment,
     color: "text-primary-600",
   },
   {
-    text: "Blog",
-    url: "/blog",
-    icon: BiComment,
+    text: "Hottest",
+    url: "/hottest",
+    icon: MdLocalFireDepartment,
     color: "text-primary-600",
   },
   // {
diff --git a/src/Components/Cards/ProjectCardMini/ProjectCardMini.Skeleton.tsx b/src/features/Projects/Components/ProjectCardMini/ProjectCardMini.Skeleton.tsx
similarity index 100%
rename from src/Components/Cards/ProjectCardMini/ProjectCardMini.Skeleton.tsx
rename to src/features/Projects/Components/ProjectCardMini/ProjectCardMini.Skeleton.tsx
diff --git a/src/Components/Cards/ProjectCardMini/ProjectCardMini.stories.tsx b/src/features/Projects/Components/ProjectCardMini/ProjectCardMini.stories.tsx
similarity index 93%
rename from src/Components/Cards/ProjectCardMini/ProjectCardMini.stories.tsx
rename to src/features/Projects/Components/ProjectCardMini/ProjectCardMini.stories.tsx
index 58a3c5d..5aa7e43 100644
--- a/src/Components/Cards/ProjectCardMini/ProjectCardMini.stories.tsx
+++ b/src/features/Projects/Components/ProjectCardMini/ProjectCardMini.stories.tsx
@@ -6,7 +6,7 @@ import ProjectCardMiniSkeleton from './ProjectCardMini.Skeleton';
 
 
 export default {
-    title: 'Projects/Project Card Mini',
+    title: 'Projects/Components/Project Card Mini',
     component: ProjectCardMini,
 
 } as ComponentMeta<typeof ProjectCardMini>;
diff --git a/src/Components/Cards/ProjectCardMini/ProjectCardMini.tsx b/src/features/Projects/Components/ProjectCardMini/ProjectCardMini.tsx
similarity index 100%
rename from src/Components/Cards/ProjectCardMini/ProjectCardMini.tsx
rename to src/features/Projects/Components/ProjectCardMini/ProjectCardMini.tsx
diff --git a/src/features/Projects/pages/CategoryPage/CategoryPage.stories.tsx b/src/features/Projects/pages/CategoryPage/CategoryPage.stories.tsx
new file mode 100644
index 0000000..9119782
--- /dev/null
+++ b/src/features/Projects/pages/CategoryPage/CategoryPage.stories.tsx
@@ -0,0 +1,28 @@
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+import { ModifyArgs } from 'src/utils/storybook/utils';
+import CategoryPage from './CategoryPage';
+
+export default {
+    title: 'Projects/Category Page',
+    component: CategoryPage,
+    argTypes: {
+        backgroundColor: { control: 'color' },
+    },
+    parameters: {
+        modifyArgs: {
+            router: {
+                routePath: "/:id",
+                currentPath: "/1"
+            }
+        } as ModifyArgs
+    }
+} as ComponentMeta<typeof CategoryPage>;
+
+
+const Template: ComponentStory<typeof CategoryPage> = (args) => <CategoryPage {...args as any} ></CategoryPage>
+
+export const Page = Template.bind({});
+Page.args = {
+}
+
+
diff --git a/src/features/Projects/pages/CategoryPage/HeaderImage/HeaderImage.stories.tsx b/src/features/Projects/pages/CategoryPage/HeaderImage/HeaderImage.stories.tsx
index b22ebcc..980aa33 100644
--- a/src/features/Projects/pages/CategoryPage/HeaderImage/HeaderImage.stories.tsx
+++ b/src/features/Projects/pages/CategoryPage/HeaderImage/HeaderImage.stories.tsx
@@ -3,7 +3,7 @@ import { ComponentStory, ComponentMeta } from '@storybook/react';
 import HeaderImage from './HeaderImage';
 
 export default {
-    title: 'Category Page/Header Image',
+    title: 'Projects/Category Page/Header Image',
     component: HeaderImage,
     argTypes: {
         backgroundColor: { control: 'color' },
diff --git a/src/features/Projects/pages/CategoryPage/ProjectsGrid/ProjectsGrid.stories.tsx b/src/features/Projects/pages/CategoryPage/ProjectsGrid/ProjectsGrid.stories.tsx
index 02fef20..dda5487 100644
--- a/src/features/Projects/pages/CategoryPage/ProjectsGrid/ProjectsGrid.stories.tsx
+++ b/src/features/Projects/pages/CategoryPage/ProjectsGrid/ProjectsGrid.stories.tsx
@@ -4,7 +4,7 @@ import { MOCK_DATA } from 'src/mocks/data';
 import ProjectsGrid from './ProjectsGrid';
 
 export default {
-    title: 'Category Page/Projects Grid',
+    title: 'Projects/Category Page/Projects Grid',
     component: ProjectsGrid,
     argTypes: {
         backgroundColor: { control: 'color' },
diff --git a/src/features/Projects/pages/CategoryPage/ProjectsGrid/ProjectsGrid.tsx b/src/features/Projects/pages/CategoryPage/ProjectsGrid/ProjectsGrid.tsx
index 9d2d349..f08db88 100644
--- a/src/features/Projects/pages/CategoryPage/ProjectsGrid/ProjectsGrid.tsx
+++ b/src/features/Projects/pages/CategoryPage/ProjectsGrid/ProjectsGrid.tsx
@@ -1,5 +1,6 @@
-import ProjectCardMini from 'src/Components/Cards/ProjectCardMini/ProjectCardMini'
-import ProjectCardMiniSkeleton from 'src/Components/Cards/ProjectCardMini/ProjectCardMini.Skeleton';
+
+import ProjectCardMini from "src/features/Projects/Components/ProjectCardMini/ProjectCardMini";
+import ProjectCardMiniSkeleton from 'src/features/Projects/Components/ProjectCardMini/ProjectCardMini.Skeleton';
 import { openModal } from 'src/redux/features/modals.slice';
 import { openProject } from 'src/redux/features/project.slice';
 import { useAppDispatch } from 'src/utils/hooks';
diff --git a/src/features/Projects/pages/ExplorePage/Categories/Categories.stories.tsx b/src/features/Projects/pages/ExplorePage/Categories/Categories.stories.tsx
index bbd063d..2c94d9d 100644
--- a/src/features/Projects/pages/ExplorePage/Categories/Categories.stories.tsx
+++ b/src/features/Projects/pages/ExplorePage/Categories/Categories.stories.tsx
@@ -4,7 +4,7 @@ import Categories from './Categories';
 
 
 export default {
-    title: 'Explore Page/Categories',
+    title: 'Projects/Explore Page/Categories',
     component: Categories,
 
 } as ComponentMeta<typeof Categories>;
diff --git a/src/features/Projects/pages/ExplorePage/ExplorePage.stories.tsx b/src/features/Projects/pages/ExplorePage/ExplorePage.stories.tsx
new file mode 100644
index 0000000..f10f4d1
--- /dev/null
+++ b/src/features/Projects/pages/ExplorePage/ExplorePage.stories.tsx
@@ -0,0 +1,28 @@
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+import { ModifyArgs } from 'src/utils/storybook/utils';
+import ExplorePage from './ExplorePage';
+
+export default {
+    title: 'Projects/Explore Page',
+    component: ExplorePage,
+    argTypes: {
+        backgroundColor: { control: 'color' },
+    },
+    parameters: {
+        modifyArgs: {
+            router: {
+                routePath: "/:id",
+                currentPath: "/1"
+            }
+        } as ModifyArgs
+    }
+} as ComponentMeta<typeof ExplorePage>;
+
+
+const Template: ComponentStory<typeof ExplorePage> = (args) => <ExplorePage {...args as any} ></ExplorePage>
+
+export const Page = Template.bind({});
+Page.args = {
+}
+
+
diff --git a/src/features/Projects/pages/ExplorePage/ExplorePage.tsx b/src/features/Projects/pages/ExplorePage/ExplorePage.tsx
index d88c8b3..363f94f 100644
--- a/src/features/Projects/pages/ExplorePage/ExplorePage.tsx
+++ b/src/features/Projects/pages/ExplorePage/ExplorePage.tsx
@@ -1,4 +1,3 @@
-import Categories from "./Categories/Categories";
 import Header from "./Header/Header";
 import ProjectsSection from "./ProjectsSection/ProjectsSection";
 
diff --git a/src/features/Projects/pages/ExplorePage/Header/Header.stories.tsx b/src/features/Projects/pages/ExplorePage/Header/Header.stories.tsx
index eeec438..4f0a190 100644
--- a/src/features/Projects/pages/ExplorePage/Header/Header.stories.tsx
+++ b/src/features/Projects/pages/ExplorePage/Header/Header.stories.tsx
@@ -4,7 +4,7 @@ import Header from './Header';
 
 
 export default {
-    title: 'Explore Page/Header',
+    title: 'Projects/Explore Page/Header',
     component: Header,
 
 } as ComponentMeta<typeof Header>;
diff --git a/src/features/Projects/pages/ExplorePage/ProjectsRow/ProjectsRow.Skeleton.tsx b/src/features/Projects/pages/ExplorePage/ProjectsRow/ProjectsRow.Skeleton.tsx
index 9a4f7f6..f99fe57 100644
--- a/src/features/Projects/pages/ExplorePage/ProjectsRow/ProjectsRow.Skeleton.tsx
+++ b/src/features/Projects/pages/ExplorePage/ProjectsRow/ProjectsRow.Skeleton.tsx
@@ -1,6 +1,6 @@
 
-import ProjectCardMiniSkeleton from "src/Components/Cards/ProjectCardMini/ProjectCardMini.Skeleton";
 import Skeleton from "react-loading-skeleton";
+import ProjectCardMiniSkeleton from "src/features/Projects/Components/ProjectCardMini/ProjectCardMini.Skeleton";
 
 export default function ProjectsRowSkeleton() {
 
diff --git a/src/features/Projects/pages/ExplorePage/ProjectsRow/ProjectsRow.stories.tsx b/src/features/Projects/pages/ExplorePage/ProjectsRow/ProjectsRow.stories.tsx
index 189d690..6b982a9 100644
--- a/src/features/Projects/pages/ExplorePage/ProjectsRow/ProjectsRow.stories.tsx
+++ b/src/features/Projects/pages/ExplorePage/ProjectsRow/ProjectsRow.stories.tsx
@@ -6,7 +6,7 @@ import { MOCK_DATA } from 'src/mocks/data';
 
 
 export default {
-    title: 'Explore Page/ProjectsRow',
+    title: 'Projects/Explore Page/ProjectsRow',
     component: ProjectsRow,
 
 } as ComponentMeta<typeof ProjectsRow>;
diff --git a/src/features/Projects/pages/ExplorePage/ProjectsRow/ProjectsRow.tsx b/src/features/Projects/pages/ExplorePage/ProjectsRow/ProjectsRow.tsx
index d21d828..5ab22c4 100644
--- a/src/features/Projects/pages/ExplorePage/ProjectsRow/ProjectsRow.tsx
+++ b/src/features/Projects/pages/ExplorePage/ProjectsRow/ProjectsRow.tsx
@@ -4,12 +4,12 @@ import Carousel from 'react-multi-carousel';
 import { MdDoubleArrow, } from 'react-icons/md';
 import { useAppDispatch } from "src/utils/hooks";
 import { openModal } from "src/redux/features/modals.slice";
-import ProjectCardMini from "src/Components/Cards/ProjectCardMini/ProjectCardMini";
 import { useResizeListener } from 'src/utils/hooks'
 import { IoIosArrowBack, IoIosArrowForward } from "react-icons/io";
 import './style.css';
 import { Link } from "react-router-dom";
 import { openProject } from "src/redux/features/project.slice";
+import ProjectCardMini from "src/features/Projects/Components/ProjectCardMini/ProjectCardMini";
 
 interface Props {
     title: string | ReactNode,
diff --git a/src/features/Projects/pages/ExplorePage/ProjectsSection/ProjectsSection.stories.tsx b/src/features/Projects/pages/ExplorePage/ProjectsSection/ProjectsSection.stories.tsx
index db2c566..09ef878 100644
--- a/src/features/Projects/pages/ExplorePage/ProjectsSection/ProjectsSection.stories.tsx
+++ b/src/features/Projects/pages/ExplorePage/ProjectsSection/ProjectsSection.stories.tsx
@@ -4,7 +4,7 @@ import ProjectsSection from './ProjectsSection';
 
 
 export default {
-    title: 'Explore Page/Projects Section',
+    title: 'Projects/Explore Page/Projects Section',
     component: ProjectsSection,
 
 } as ComponentMeta<typeof ProjectsSection>;
diff --git a/src/features/Projects/pages/HottestPage/HottestPage.stories.tsx b/src/features/Projects/pages/HottestPage/HottestPage.stories.tsx
new file mode 100644
index 0000000..a60965f
--- /dev/null
+++ b/src/features/Projects/pages/HottestPage/HottestPage.stories.tsx
@@ -0,0 +1,19 @@
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+import HottestPage from './HottestPage';
+
+export default {
+    title: 'Projects/Hottest Page',
+    component: HottestPage,
+    argTypes: {
+        backgroundColor: { control: 'color' },
+    },
+} as ComponentMeta<typeof HottestPage>;
+
+
+const Template: ComponentStory<typeof HottestPage> = (args) => <HottestPage {...args as any} ></HottestPage>
+
+export const Page = Template.bind({});
+Page.args = {
+}
+
+
diff --git a/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_CopySignatureCard.stories.tsx b/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_CopySignatureCard.stories.tsx
index bb818b1..3ca4cf5 100644
--- a/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_CopySignatureCard.stories.tsx
+++ b/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_CopySignatureCard.stories.tsx
@@ -5,7 +5,7 @@ import Claim_CopySignatureCard from './Claim_CopySignatureCard';
 import { ModalsDecorator } from 'src/utils/storybook/decorators';
 
 export default {
-    title: 'Project/Claim/Copy Signature Card',
+    title: 'Projects/Claim/Copy Signature Card',
     component: Claim_CopySignatureCard,
 
     decorators: [ModalsDecorator]
diff --git a/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_FundWithdrawCard.stories.tsx b/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_FundWithdrawCard.stories.tsx
index 890f509..1470dfb 100644
--- a/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_FundWithdrawCard.stories.tsx
+++ b/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_FundWithdrawCard.stories.tsx
@@ -5,7 +5,7 @@ import Claim_FundWithdrawCard from './Claim_FundWithdrawCard';
 import { ModalsDecorator } from 'src/utils/storybook/decorators';
 
 export default {
-    title: 'Project/Claim/Fund Withdraw Card',
+    title: 'Projects/Claim/Fund Withdraw Card',
     component: Claim_FundWithdrawCard,
 
     decorators: [ModalsDecorator]
diff --git a/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_GenerateSignatureCard.stories.tsx b/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_GenerateSignatureCard.stories.tsx
index 9869bc5..763e8a7 100644
--- a/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_GenerateSignatureCard.stories.tsx
+++ b/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_GenerateSignatureCard.stories.tsx
@@ -5,7 +5,7 @@ import Claim_GenerateSignatureCard from './Claim_GenerateSignatureCard';
 import { ModalsDecorator } from 'src/utils/storybook/decorators';
 
 export default {
-    title: 'Project/Claim/Generate Signature Card',
+    title: 'Projects/Claim/Generate Signature Card',
     component: Claim_GenerateSignatureCard,
 
     decorators: [ModalsDecorator]
diff --git a/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_SubmittedCard.stories.tsx b/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_SubmittedCard.stories.tsx
index 6cbb688..1503522 100644
--- a/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_SubmittedCard.stories.tsx
+++ b/src/features/Projects/pages/ProjectPage/ClaimProject/Claim_SubmittedCard.stories.tsx
@@ -5,7 +5,7 @@ import Claim_SubmittedCard from './Claim_SubmittedCard';
 import { ModalsDecorator } from 'src/utils/storybook/decorators';
 
 export default {
-    title: 'Project/Claim/Submitted Card',
+    title: 'Projects/Claim/Submitted Card',
     component: Claim_SubmittedCard,
 
     decorators: [ModalsDecorator]
diff --git a/src/features/Projects/pages/ProjectPage/ProjectDetailsCard/ProjectDetailsCard.stories.tsx b/src/features/Projects/pages/ProjectPage/ProjectDetailsCard/ProjectDetailsCard.stories.tsx
index 032f865..9102f41 100644
--- a/src/features/Projects/pages/ProjectPage/ProjectDetailsCard/ProjectDetailsCard.stories.tsx
+++ b/src/features/Projects/pages/ProjectPage/ProjectDetailsCard/ProjectDetailsCard.stories.tsx
@@ -6,7 +6,7 @@ import ProjectDetailsCardSkeleton from './ProjectDetailsCard.Skeleton';
 import { ModalsDecorator } from 'src/utils/storybook/decorators';
 
 export default {
-    title: 'Project/Project Details Card',
+    title: 'Projects/Project Page/Project Details Modal',
     component: ProjectDetailsCard,
 
     decorators: [ModalsDecorator],
diff --git a/src/features/Projects/pages/ProjectPage/VoteButton/VoteButton.stories.tsx b/src/features/Projects/pages/ProjectPage/VoteButton/VoteButton.stories.tsx
index ba98263..19465b0 100644
--- a/src/features/Projects/pages/ProjectPage/VoteButton/VoteButton.stories.tsx
+++ b/src/features/Projects/pages/ProjectPage/VoteButton/VoteButton.stories.tsx
@@ -4,7 +4,7 @@ import VoteButton from './VoteButton';
 import { centerDecorator } from 'src/utils/storybook/decorators';
 
 export default {
-  title: 'Project/Tip Button',
+  title: 'Projects/Project Page/Tip Button',
   component: VoteButton,
   decorators: [
     centerDecorator
diff --git a/src/features/Projects/pages/ProjectPage/VoteCard/VoteCard.stories.tsx b/src/features/Projects/pages/ProjectPage/VoteCard/VoteCard.stories.tsx
index 1e8525a..1d6e13f 100644
--- a/src/features/Projects/pages/ProjectPage/VoteCard/VoteCard.stories.tsx
+++ b/src/features/Projects/pages/ProjectPage/VoteCard/VoteCard.stories.tsx
@@ -5,7 +5,7 @@ import VoteCard from './VoteCard';
 import { ModalsDecorator } from 'src/utils/storybook/decorators';
 
 export default {
-    title: 'Project/Vote Card',
+    title: 'Projects/Project Page/Vote Card',
     component: VoteCard,
 
     decorators: [ModalsDecorator]