mirror of
https://github.com/Buriburizaem0n/nezha-dash-v1.git
synced 2026-05-06 05:48:41 +00:00
fix: update GroupSwitch and Server components for improved tab handling and styling
This commit is contained in:
@@ -1,5 +1,6 @@
|
||||
import { cn } from "@/lib/utils"
|
||||
import { m } from "framer-motion"
|
||||
import { s } from "node_modules/framer-motion/dist/types.d-6pKw1mTI"
|
||||
import { createRef, useEffect, useRef } from "react"
|
||||
|
||||
export default function GroupSwitch({
|
||||
@@ -36,6 +37,10 @@ export default function GroupSwitch({
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
if (tabs.length === 1 && tabs[0] === "All") {
|
||||
setCurrentTab("All")
|
||||
return
|
||||
}
|
||||
const savedGroup = sessionStorage.getItem("selectedGroup")
|
||||
if (savedGroup && tabs.includes(savedGroup)) {
|
||||
setCurrentTab(savedGroup)
|
||||
@@ -54,6 +59,10 @@ export default function GroupSwitch({
|
||||
}
|
||||
}, [currentTab])
|
||||
|
||||
if (tabs.length === 1 && tabs[0] === "All") {
|
||||
return null
|
||||
}
|
||||
|
||||
return (
|
||||
<div ref={scrollRef} className="scrollbar-hidden z-50 flex flex-col items-start overflow-x-scroll rounded-[50px]">
|
||||
<div
|
||||
|
||||
+8
-19
@@ -243,21 +243,16 @@ export default function Servers() {
|
||||
localStorage.setItem("showMap", showMap === "0" ? "1" : "0")
|
||||
}}
|
||||
className={cn(
|
||||
"rounded-[50px] bg-white dark:bg-stone-800 cursor-pointer p-[10px] transition-all border dark:border-none border-stone-200 dark:border-stone-700 hover:bg-stone-100 dark:hover:bg-stone-700 shadow-[inset_0_1px_0_rgba(255,255,255,0.2)]",
|
||||
"inset-shadow-2xs inset-shadow-white/20 flex cursor-pointer flex-col items-center gap-0 rounded-[50px] bg-blue-100 p-2.5 text-blue-600 transition-all dark:bg-blue-900 dark:text-blue-100",
|
||||
{
|
||||
"shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] bg-blue-600! hover:bg-blue-600! border-blue-600 dark:border-blue-600": showMap === "1",
|
||||
"text-white": showMap === "1",
|
||||
"inset-shadow-black/20 bg-blue-600 text-white dark:bg-blue-100 dark:text-blue-600": showMap === "1",
|
||||
},
|
||||
{
|
||||
"bg-opacity-70 dark:bg-opacity-70": customBackgroundImage,
|
||||
},
|
||||
)}
|
||||
>
|
||||
<MapIcon
|
||||
className={cn("size-[13px]", {
|
||||
"text-white": showMap === "1",
|
||||
})}
|
||||
/>
|
||||
<MapIcon className={cn("size-[13px]")} />
|
||||
</button>
|
||||
<button
|
||||
onClick={() => {
|
||||
@@ -265,21 +260,16 @@ export default function Servers() {
|
||||
localStorage.setItem("showServices", showServices === "0" ? "1" : "0")
|
||||
}}
|
||||
className={cn(
|
||||
"rounded-[50px] bg-white dark:bg-stone-800 cursor-pointer p-[10px] transition-all border dark:border-none border-stone-200 dark:border-stone-700 hover:bg-stone-100 dark:hover:bg-stone-700 shadow-[inset_0_1px_0_rgba(255,255,255,0.2)]",
|
||||
"inset-shadow-2xs inset-shadow-white/20 flex cursor-pointer flex-col items-center gap-0 rounded-[50px] bg-blue-100 p-2.5 text-blue-600 transition-all dark:bg-blue-900 dark:text-blue-100",
|
||||
{
|
||||
"shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] bg-blue-600! hover:bg-blue-600! border-blue-600 dark:border-blue-600": showServices === "1",
|
||||
"text-white": showServices === "1",
|
||||
"inset-shadow-black/20 bg-blue-600 text-white dark:bg-blue-100 dark:text-blue-600": showServices === "1",
|
||||
},
|
||||
{
|
||||
"bg-opacity-70 dark:bg-opacity-70": customBackgroundImage,
|
||||
},
|
||||
)}
|
||||
>
|
||||
<ChartBarSquareIcon
|
||||
className={cn("size-[13px]", {
|
||||
"text-white": showServices === "1",
|
||||
})}
|
||||
/>
|
||||
<ChartBarSquareIcon className={cn("size-[13px]")} />
|
||||
</button>
|
||||
<button
|
||||
onClick={() => {
|
||||
@@ -287,10 +277,9 @@ export default function Servers() {
|
||||
localStorage.setItem("inline", inline === "0" ? "1" : "0")
|
||||
}}
|
||||
className={cn(
|
||||
"rounded-[50px] bg-white dark:bg-stone-800 cursor-pointer p-[10px] transition-all border dark:border-none border-stone-200 dark:border-stone-700 hover:bg-stone-100 dark:hover:bg-stone-700 shadow-[inset_0_1px_0_rgba(255,255,255,0.2)]",
|
||||
"inset-shadow-2xs inset-shadow-white/20 flex cursor-pointer flex-col items-center gap-0 rounded-[50px] bg-blue-100 p-2.5 text-blue-600 transition-all dark:bg-blue-900 dark:text-blue-100",
|
||||
{
|
||||
"shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] bg-blue-600! hover:bg-blue-600! border-blue-600 dark:border-blue-600": inline === "1",
|
||||
"text-white": inline === "1",
|
||||
"inset-shadow-black/20 bg-blue-600 text-white dark:bg-blue-100 dark:text-blue-600": inline === "1",
|
||||
},
|
||||
{
|
||||
"bg-opacity-70 dark:bg-opacity-70": customBackgroundImage,
|
||||
|
||||
Reference in New Issue
Block a user