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

improve: dark theme

Browse Source
This commit is contained in:
Mahyar Khanbolooki
2025-08-13 00:13:46 +03:30
parent 772235502c
commit 947c5f8b34
8 changed files with 22 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/[name]/(Dialogs)/cart/page.tsx
+2 -2
View File
@@ -65,7 +65,7 @@ const CartIndex = ({ }: Props) => {
<>
<button
onClick={() => increment(0)}
className="bg-white hover:bg-white/60 active:bg-white/30 rounded-sm p-1"
className="bg-container hover:bg-container/60 active:bg-container/30 rounded-sm p-1"
>
<PlusIcon size={16} />
</button>
@@ -80,7 +80,7 @@ const CartIndex = ({ }: Props) => {
</motion.div>
<button
onClick={() => decrement(0)}
className="bg-white hover:bg-white/60 active:bg-white/30 rounded-sm p-1"
className="bg-container hover:bg-container/60 active:bg-container/30 rounded-sm p-1"
>
{quantity > 1 ? <MinusIcon size={16} /> : <Trash className='stroke-foreground' size={16} />} {/* Use PlusIcon for decrement if quantity is 1 or less */}
</button>
src/app/[name]/(Main)/about/AboutPage.tsx
+9 -9
View File
@@ -67,22 +67,22 @@ function AboutPage({ data }: Readonly<{ data: AboutDataModel; }>) {
<h2 className='text-sm2 font-medium leading-5'>ارتباط</h2>
<div className='col-span-1 text-center flex justify-center gap-4'>
{data.contacts.phone &&
<a href={`tel://${data.contacts.phone}`} className='bg-[#EAEDF5] p-2 rounded-normal'>
<a href={`tel://${data.contacts.phone}`} className='bg-[#EAEDF5] dark:bg-neutral-700 p-2 rounded-normal'>
<CallCalling className='stroke-foreground' size={24} />
</a>
}
{data.contacts.telegram &&
<a href={`https://t.me/${data.contacts.telegram}`} className='bg-[#EAEDF5] p-2 rounded-normal'>
<a href={`https://t.me/${data.contacts.telegram}`} className='bg-[#EAEDF5] dark:bg-neutral-700 p-2 rounded-normal'>
<TelegramIcon className='stroke-foreground' width={24} height={24} />
</a>
}
{data.contacts.whatsapp &&
<a href={`https://whatsapp.com/?phone=${data.contacts.whatsapp}`} className='bg-[#EAEDF5] p-2 rounded-normal'>
<a href={`https://whatsapp.com/?phone=${data.contacts.whatsapp}`} className='bg-[#EAEDF5] dark:bg-neutral-700 p-2 rounded-normal'>
<Whatsapp className='stroke-foreground' size={24} />
</a>
}
{data.contacts.instagram &&
<a href={`https://instagram.com/${data.contacts.instagram}`} className='bg-[#EAEDF5] p-2 rounded-normal'>
<a href={`https://instagram.com/${data.contacts.instagram}`} className='bg-[#EAEDF5] dark:bg-neutral-700 p-2 rounded-normal'>
<Instagram className='stroke-foreground' size={24} />
</a>
}
@@ -118,7 +118,7 @@ function AboutPage({ data }: Readonly<{ data: AboutDataModel; }>) {
<div
key={index}
style={{ boxShadow: '0px 0px 14px 0px #0000000F' }}
className="bg-[#F6F6FA] rounded-container leading-5 py-6 px-4 mt-4 flex justify-between items-center">
className="bg-[#F6F6FA] dark:bg-border rounded-container leading-5 py-6 px-4 mt-4 flex justify-between items-center">
<div className="text-sm2">
{v.day}
</div>
@@ -155,8 +155,8 @@ function AboutPage({ data }: Readonly<{ data: AboutDataModel; }>) {
<section className="bg-container rounded-container shadow-container pt-3 pb-3.5 px-[16px] mt-4">
<div className="flex justify-between items-center border-b-[1.5px] border-border pb-2">
<h2 className='text-sm2 font-medium leading-5'>نظرات کاربران</h2>
<button onClick={toggleSortingModal} 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={toggleSortingModal} className="rounded-xl h-8 bg-container ps-4 pe-2 py-1.5 inline-flex items-center justify-between gap-[7px]">
<EqualizerIcon className='dark:text-white' />
<span className="text-xs leading-5 font-medium">{sortings[+sorting]}</span>
</button>
</div>
@@ -180,10 +180,10 @@ function AboutPage({ data }: Readonly<{ data: AboutDataModel; }>) {
{sortings.map((v, i) => {
return (
<div key={i}>
<div onClick={() => changeSorting(i)} className="text-sm2 font-medium cursor-pointer">
<div onClick={() => changeSorting(i)} className="text-sm2 font-normal cursor-pointer">
{v}
</div>
{i < sortings.length - 1 && <hr className="text-white/40 mb-4 mt-4" />}
{i < sortings.length - 1 && <hr className="border-white/40 dark:border-border mb-4 mt-4" />}
</div>
)
})}
src/app/[name]/(Main)/page.tsx
+2 -2
View File
@@ -347,10 +347,10 @@ const MenuIndex = () => {
{sortings.map((v, i) => {
return (
<div key={i}>
<div onClick={() => changeSorting(i)} className="text-sm2 font-medium cursor-pointer">
<div onClick={() => changeSorting(i)} className="text-sm2 font-normal cursor-pointer">
{tMenu('MenuSortingDrawer.Options.' + v)}
</div>
{i < sortings.length - 1 && <hr className="text-white/40 mb-4 mt-4" />}
{i < sortings.length - 1 && <hr className="border-white/40 dark:border-border mb-4 mt-4" />}
</div>
)
})}
src/app/globals.css
+1 -1
View File
@@ -329,7 +329,7 @@ html[data-theme="dark"] {
/* #FFFFFF */
--primary: oklch(14% 0.005 285.823);
/* #000000 */
--border: oklch(21.15% 0.012 254.09);
--border: oklch(1 0 0 / 10%);
/* #E5E5E5 */
--invalid: oklch(0.515 0.118 27.5);
/* red (#FF0000 approx) */
src/components/icons/EqualizerIcon.tsx
+1 -1
View File
@@ -9,7 +9,7 @@ interface EqualizerIconProps {
const EqualizerIcon: React.FC<EqualizerIconProps> = ({
className = '',
stroke = '#333333',
stroke = 'currentColor',
strokeWidth = 1.5,
size = 16,
}) => {
src/components/utils/Comment.tsx
+4 -4
View File
@@ -16,9 +16,9 @@ function Comment({ user, rating, date, text, tags, className = '' }: Props) {
return (
<div className={className}>
<div className="flex items-center justify-start">
<span className="rounded-sm bg-primary h-5 mb-1 w-13 flex items-center justify-center gap-1">
<Star1 className='fill-white mb-0.5' size={12} />
<span className='text-sm2 font-medium text-white mt-1'>{rating}</span>
<span className="rounded-sm bg-primary dark:bg-foreground h-5 mb-1 w-13 flex items-center justify-center gap-1">
<Star1 className='fill-white dark:fill-primary mb-0.5' size={12} />
<span className='text-sm2 font-medium text-white dark:text-primary mt-1'>{rating}</span>
</span>
<span className='ms-2 text-sm2'>{user}</span>
<span className='ms-3 mb-1 size-1.5 bg-border rounded-full'></span>
@@ -31,7 +31,7 @@ function Comment({ user, rating, date, text, tags, className = '' }: Props) {
<ul className='mt-3 flex flex-wrap items-center justify-start gap-2'>
{tags.map((v, i) => (
<li key={i} className='text-xs py-1.5 px-3 bg-[#F2F2F2] rounded-sm text-center'>
<li key={i} className='text-xs py-1.5 px-3 bg-[#F2F2F2] dark:bg-neutral-700 dark:text-disabled-text rounded-sm text-center'>
{v}
</li>
))}
src/components/utils/Prompt.tsx
+1 -1
View File
@@ -4,7 +4,7 @@ import { BlurredOverlayContainerProps } from '@/components/overlays/BlurredOverl
import Modal from '@/components/utils/Modal'
import React from 'react'
import { useTranslation } from 'react-i18next'
import { Button } from '../ui/button'
import Button from '../button/PrimaryButton';
export type PromptProps = {
title?: string,
src/components/utils/RateBar.tsx
+2 -2
View File
@@ -17,11 +17,11 @@ function RateBar({ percentage, content, className = '' }: Props) {
<span className='mb-1 me-3 relative w-[67px] h-1 bg-border rounded-full'>
<motion.span
animate={{ width: [0, `${percentage}%`] }}
className='absolute top-0 left-0 w-[10%] h-1 bg-primary rounded-full'
className='absolute top-0 left-0 w-[10%] h-1 bg-primary dark:bg-foreground rounded-full'
>
</motion.span>
</span>
<Star1 className='fill-black me-1 mb-1' size={12} />
<Star1 className='fill-black dark:fill-foreground me-1 mb-1' size={12} />
<span className='text-xs font-medium'>{content}</span>
</div>
)