移动视图布局按钮

youxiurui · Sep 4, 2023 · 2e9dbd1 · 2e9dbd1
1 parent cac30b7
commit 2e9dbd1
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/src/pages/home/header/layout.tsx b/src/pages/home/header/layout.tsx
@@ -12,6 +12,8 @@ import { Switch, Match, For } from "solid-js"
 import { Dynamic } from "solid-js/web"
 import { useT } from "~/hooks"
 import { getMainColor, LayoutType, layout, setLayout } from "~/store"
+// 将视图布局按钮悬浮在视口10px
+import "./menu.css"
 
 const layouts = {
   list: FaSolidListUl,
@@ -22,7 +24,7 @@ const layouts = {
 export const Layout = () => {
   const t = useT()
   return (
-    <>
+    <div class="menu">
       <Menu>
         <MenuTrigger
           as={IconButton}
@@ -63,6 +65,6 @@ export const Layout = () => {
           </For>
         </MenuContent>
       </Menu>
-    </>
+    </div>
   )
 }
diff --git a/src/pages/home/header/menu.css b/src/pages/home/header/menu.css
@@ -0,0 +1,5 @@
+.menu {
+  position: fixed;
+  right: 10px;
+  top: 150px;
+}