danak/dmenu-plus-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add: menu page dark theme

Browse Source
This commit is contained in:
Mahyar Khanbolooki
2025-08-12 19:30:16 +03:30
parent 5936f66665
commit d11cd474ab
11 changed files with 119 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/[name]/(Main)/page.tsx
+10 -11
View File
@@ -5,7 +5,6 @@ import SearchBox from "@/components/input/SearchBox";
import CategoryItemRenderer from "@/components/listview/CategoryItemRenderer";
import HorizontalScrollView from "@/components/listview/HorizontalScrollView";
import Image from "next/image";
import EqualizerIcon from "@/components/icons/EqualizerIcon";
import TextAlignIcon from "@/components/icons/TextAlignIcon";
import VerticalScrollView from "@/components/listview/VerticalScrollView";
import MenuItemRenderer from "@/components/listview/MenuItemRenderer";
@@ -15,7 +14,7 @@ import Button from "@/components/button/PrimaryButton";
import AnimatedBottomSheet from "@/components/bottomsheet/AnimatedBottomSheet";
import { Switch } from "@/components/ui/switch";
import { TicketPercentIcon } from "lucide-react";
import { MedalStar } from 'iconsax-react'
import { Candle2, MedalStar } from 'iconsax-react'
import { useQueryState } from 'next-usequerystate'
import clsx from "clsx";
import CategorySmallItemRenderer from "@/components/listview/CategorySmallItemRenderer";
@@ -224,7 +223,7 @@ const MenuIndex = () => {
<CategoryItemRenderer
key={index}
className={clsx(
index === +selectedCategory && "bg-white!",
index === +selectedCategory && "bg-container!",
)}
onClick={() => updateCategory(index)}
>
@@ -235,7 +234,7 @@ const MenuIndex = () => {
height={32}
alt="category image"
/>
<span className="text-xs text-black">{item.title}</span>
<span className="text-xs text-foreground">{item.title}</span>
</CategoryItemRenderer>
))}
</HorizontalScrollView>
@@ -247,12 +246,12 @@ const MenuIndex = () => {
{categories[+selectedCategory]?.title}
</span>
<div className="inline-flex gap-2 justify-around items-center">
<button onClick={toggleFilterModal} className="rounded-xl h-8 bg-white ps-4 pe-2 py-1.5 inline-flex items-center justify-between gap-[7px]">
<EqualizerIcon />
<button onClick={toggleFilterModal} className="rounded-xl h-8 bg-container ps-4 pe-2 py-1.5 inline-flex items-center justify-between gap-[7px]">
<Candle2 className="stroke-foreground" size={16} />
<span className="text-xs leading-5 font-medium">{tMenu('MenuFilterDrawer.Label')}</span>
</button>
<button onClick={toggleSortingModal} className="rounded-lg h-8 bg-white p-1.5">
<TextAlignIcon />
<button onClick={toggleSortingModal} className="rounded-lg h-8 bg-container p-1.5">
<TextAlignIcon className="text-foreground" />
</button>
</div>
</div>
@@ -262,7 +261,7 @@ const MenuIndex = () => {
animate={{ y: smallCategoriesVisible ? 0 : -50, opacity: smallCategoriesVisible ? 1 : 0 }}
transition={{ duration: .1 }}
className={clsx(
'fixed left-0 z-10 top-0 px-4 pt-16 bg-[#F4F5F9CC] backdrop-blur-[44px] right-0 xl:pr-72 xl:pt-20',
'fixed left-0 z-10 top-0 px-4 pt-16 bg-[#F4F5F9CC] dark:bg-background/70 backdrop-blur-[44px] right-0 xl:pr-72 xl:pt-20',
``
)}>
<HorizontalScrollView className="w-full noscrollbar py-4!">
@@ -270,7 +269,7 @@ const MenuIndex = () => {
<CategorySmallItemRenderer
key={index}
className={clsx(
index === +selectedCategory && "bg-white!",
index === +selectedCategory && "bg-container!",
)}
onClick={() => updateCategory(index)}
>
@@ -281,7 +280,7 @@ const MenuIndex = () => {
height={24}
alt="category image"
/>
<span className="text-xs text-black">{item.title}</span>
<span className="text-xs text-foreground">{item.title}</span>
</CategorySmallItemRenderer>
))}
</HorizontalScrollView>