Move and rename pages, add HeroPage to test hero anim

Author: Adam Plesnik

docs/src/main.tsx

@@ -3,23 +3,28 @@ import React from 'react'
 import ReactDOM from 'react-dom/client'
 import { RouterProvider, createBrowserRouter } from 'react-router-dom'
 import './index.css'
-import DocsView from './views/DocsView'
-import HowToView from './views/HowToView'
-import TechView from './views/TechView'
+import DocsPage from './pages/DocsPage'
+import HeroPage from './pages/HeroPage'
+import HowToPage from './pages/HowToPage'
+import TechPage from './pages/TechPage'
 
 const router = createBrowserRouter([
   {
     path: '/',
-    element: <HowToView />,
-    errorElement: <HowToView />,
+    element: <HowToPage />,
+    errorElement: <HowToPage />,
   },
   {
     path: '/docs',
-    element: <DocsView />,
+    element: <DocsPage />,
   },
   {
     path: '/tech',
-    element: <TechView />,
+    element: <TechPage />,
+  },
+  {
+    path: '/hero',
+    element: <HeroPage />,
   },
 ])
 

docs/src/views/DocsView.tsx renamed to docs/src/pages/DocsPage.tsx

@@ -2,7 +2,7 @@ import { WandSparkles } from 'lucide-react'
 import Docs from '../docs/Docs'
 import Page from '../layouts/Page'
 
-const DocsView = () => {
+const DocsPage = () => {
   return (
     <Page>
       <div className="hidden gap-4 rounded-lg border border-amber-400 bg-amber-50 p-4 text-sm no-animations:flex dark:border-amber-600 dark:bg-stone-700/30">
@@ -18,4 +18,4 @@ const DocsView = () => {
   )
 }
 
-export default DocsView
+export default DocsPage

docs/src/pages/HomePage.tsx renamed to docs/src/pages/HeroPage.tsx

@@ -2,7 +2,7 @@ import Page from '../layouts/Page.tsx'
 import HeroAnim from '../partials/HeroAnim.tsx'
 import Nav from '../partials/Nav.tsx'
 
-const HomePage = () => {
+const HeroPage = () => {
   return (
     <>
       <Nav />
@@ -12,4 +12,4 @@ const HomePage = () => {
   )
 }
 
-export default HomePage
+export default HeroPage

docs/src/views/HowToView.tsx renamed to docs/src/pages/HowToPage.tsx

@@ -8,7 +8,7 @@ import Installation from '../partials/Installation'
 import MainTitle from '../partials/MainTitle'
 import { keyframes101, keyframes102, keyframes103 } from '../utils/demoExamples'
 
-const HowToView = () => {
+const HowToPage = () => {
   return (
     <Page>
       <MainTitle />
@@ -40,4 +40,4 @@ const HowToView = () => {
   )
 }
 
-export default HowToView
+export default HowToPage

docs/src/views/TechView.tsx renamed to docs/src/pages/TechPage.tsx

@@ -1,12 +1,12 @@
 import Page from '../layouts/Page.tsx'
 import Animations from '../partials/Animations.tsx'
 
-function TechView() {
+function TechPage() {
   return (
     <Page>
       <Animations />
     </Page>
   )
 }
 
-export default TechView
+export default TechPage