feat(navigation): 添加 Demo 页面路由和组件
- 在 Layout 组件中添加了 Demo 页面的导航链接 - 在主路由中增加了 /demo 路径的路由 - 新增了 ComponentsDemo 组件用于 Demo 页面显示
This commit is contained in:
@@ -50,6 +50,10 @@ const Layout: ParentComponent = (props) => {
|
|||||||
<Icon icon="hugeicons:settings-01" class="text-[14px] stroke-1" />
|
<Icon icon="hugeicons:settings-01" class="text-[14px] stroke-1" />
|
||||||
<span class="navigate">Settings</span>
|
<span class="navigate">Settings</span>
|
||||||
</NavigateLink>
|
</NavigateLink>
|
||||||
|
<NavigateLink href="/demo">
|
||||||
|
<Icon icon="hugeicons:atom-01" class="text-[14px] stroke-1" />
|
||||||
|
<span class="navigate">Demo</span>
|
||||||
|
</NavigateLink>
|
||||||
<button class="ml-auto h-8 p-2 bg-transparent hover:bg-neutral-hover/45 active:bg-neutral-active/45 text-on-surface">
|
<button class="ml-auto h-8 p-2 bg-transparent hover:bg-neutral-hover/45 active:bg-neutral-active/45 text-on-surface">
|
||||||
<Icon icon="hugeicons:menu-01" class="text-base/[1] stroke-1" />
|
<Icon icon="hugeicons:menu-01" class="text-base/[1] stroke-1" />
|
||||||
</button>
|
</button>
|
||||||
|
@@ -6,12 +6,16 @@ import './index.css';
|
|||||||
import { Route, Router } from '@solidjs/router';
|
import { Route, Router } from '@solidjs/router';
|
||||||
import { render } from 'solid-js/web';
|
import { render } from 'solid-js/web';
|
||||||
import Layout from './Layout';
|
import Layout from './Layout';
|
||||||
|
import ComponentsDemo from './pages/ComponentsDemo';
|
||||||
import Models from './pages/Models';
|
import Models from './pages/Models';
|
||||||
|
import Settings from './pages/Settings';
|
||||||
|
|
||||||
render(
|
render(
|
||||||
() => (
|
() => (
|
||||||
<Router root={Layout}>
|
<Router root={Layout}>
|
||||||
<Route path="/" component={Models} />
|
<Route path="/" component={Models} />
|
||||||
|
<Route path="/settings" component={Settings} />
|
||||||
|
<Route path="/demo" component={ComponentsDemo} />
|
||||||
</Router>
|
</Router>
|
||||||
),
|
),
|
||||||
document.getElementById('root') as HTMLElement,
|
document.getElementById('root') as HTMLElement,
|
||||||
|
9
src/pages/ComponentsDemo.tsx
Normal file
9
src/pages/ComponentsDemo.tsx
Normal file
@@ -0,0 +1,9 @@
|
|||||||
|
import { Component } from 'solid-js';
|
||||||
|
|
||||||
|
const ComponentsDemo: Component = () => {
|
||||||
|
return (
|
||||||
|
<div class="workspace flex flex-col items-stretch gap-2 rounded-sm bg-swatch-neutral-20"></div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ComponentsDemo;
|
Reference in New Issue
Block a user