Marco/infoalloggi-monorepo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 6 Wiki Activity Actions

feat: update RicercaCommand button styling and replace LangToggle with SettingsPopover in SiteHeader

Browse source
This commit is contained in:
Marco Pedone 2025-12-03 17:04:15 +01:00
parent c153dca662
commit e68a2720d5
3 changed files with 7 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
apps/infoalloggi/src/components/navbar/ricerca_command.tsx
View file

@ -26,8 +26,8 @@ export function RicercaCommand() {
<> <>
<Dialog onOpenChange={setOpen} open={open}> <Dialog onOpenChange={setOpen} open={open}>
<DialogTrigger asChild> <DialogTrigger asChild>
<Button aria-label="ricercaBtn" variant="ghost"> <Button aria-label="ricercaBtn" className="p-2" variant="ghost">
<Search className="size-6" /> <Search className="size-5" />
</Button> </Button>
</DialogTrigger> </DialogTrigger>
<DialogContent className="border-none bg-transparent sm:max-w-xl [&_[data-slot=dialog-close]]:hidden"> <DialogContent className="border-none bg-transparent sm:max-w-xl [&_[data-slot=dialog-close]]:hidden">

6
apps/infoalloggi/src/components/navbar/site-header.tsx
View file

@ -5,8 +5,7 @@ import { UserHeaderSection } from "~/components/navbar/login-button";
import { MainNav } from "~/components/navbar/main-nav"; import { MainNav } from "~/components/navbar/main-nav";
import { MobileNav } from "~/components/navbar/mobile-nav"; import { MobileNav } from "~/components/navbar/mobile-nav";
import { RicercaCommand } from "~/components/navbar/ricerca_command"; import { RicercaCommand } from "~/components/navbar/ricerca_command";
import { LangToggle } from "./lang-toggle"; import { SettingsPopover } from "./settings-modal";
import { ThemeSwitch } from "./theme-toggle";
export function SiteHeader() { export function SiteHeader() {
const pathname = usePathname(); const pathname = usePathname();
@ -37,8 +36,7 @@ export function SiteHeader() {
<RicercaCommand /> <RicercaCommand />
<div className="hidden w-fit items-center gap-2 md:flex"> <div className="hidden w-fit items-center gap-2 md:flex">
<LangToggle /> <SettingsPopover />
<ThemeSwitch />
</div> </div>
<UserHeaderSection <UserHeaderSection
key={pathname} key={pathname}

6
apps/infoalloggi/src/components/navbar/theme-toggle.tsx
View file

@ -46,15 +46,15 @@ const ThemeSwitchContent = () => {
type="button" type="button"
> >
<motion.div <motion.div
animate={{ opacity: 1 }} //animate={{ opacity: 1 }}
className={cn( className={cn(
"flex size-5.5 items-center justify-center rounded-full bg-black", "flex size-5.5 items-center justify-center rounded-full bg-black",
theme === "light" ? "bg-yellow-300" : "bg-gray-800/60", theme === "light" ? "bg-yellow-300" : "bg-gray-800/60",
)} )}
initial={{ opacity: 0 }} //initial={{ opacity: 0 }}
layout layout
transition={{ transition={{
opacity: { duration: 0.1, ease: "easeInOut", delay: 0.5 }, // Fast fade in //opacity: { duration: 0.1, ease: "easeInOut", delay: 0.5 }, // Fast fade in
layout: spring, // Spring for position change layout: spring, // Spring for position change
}} }}
> >