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

bottom navbar primary color

Browse Source
This commit is contained in:
hamid zarghami
2025-12-17 16:38:12 +03:30
parent 32c197a105
commit 340937ca8d
7 changed files with 32 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/sw.js
+1 -1
View File
File diff suppressed because one or more lines are too long
src/app/globals.css
+4
View File
@@ -300,6 +300,10 @@ html[data-theme="light"] {
/* #292D32 */
}
* {
outline: none !important;
}
html[data-theme="dark"] {
/* --background: oklch(0.145 0 0);
--foreground: oklch(0.985 0 0);
src/components/icons/HomeIcon.tsx
+5 -2
View File
@@ -1,8 +1,10 @@
import React from 'react';
type Props = React.SVGProps<SVGSVGElement>;
type Props = React.SVGProps<SVGSVGElement> & {
variant?: 'Outline' | 'Bold';
};
const HomeIcon: React.FC<Props> = ({ ...props }) => {
const HomeIcon: React.FC<Props> = ({ variant = 'Outline', ...props }) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
@@ -10,6 +12,7 @@ const HomeIcon: React.FC<Props> = ({ ...props }) => {
height='24'
viewBox="0 0 24 24"
fill="none"
className={variant === 'Bold' ? 'fill-current text-primary' : 'stroke-current text-primary'}
{...props}
>
<path d="M17.79 22.75H6.21c-2.74 0-4.96-2.23-4.96-4.97v-7.41c0-1.36.84-3.07 1.92-3.91l5.39-4.2C10.18 1 12.77.94 14.45 2.12l6.18 4.33c1.19.83 2.12 2.61 2.12 4.06v7.28c0 2.73-2.22 4.96-4.96 4.96Z" />
src/components/navigation/BottomNavBar.tsx
+13 -15
View File
@@ -69,10 +69,10 @@ function BottomNavBar({ onPagerClick }: BottomNavBarProps) {
{onPagerClick ? (
<button
onClick={onPagerClick}
className="flex flex-col justify-arround items-center gap-[5px] text-disabled2 pointer-events-auto dark:**:stroke-neutral-500"
className="flex flex-col justify-arround items-center gap-[5px] text-primary pointer-events-auto **:stroke-primary"
>
<PagerIcon width={20} height={20} />
<span className="text-xs2 text-disabled-text">
<span className="text-xs2">
{t('Pager')}
</span>
</button>
@@ -82,33 +82,31 @@ function BottomNavBar({ onPagerClick }: BottomNavBarProps) {
<BottomNavHighlightLink
href={`/${name}`}
icon={
<HomeIcon className='transition-all duration-200'
fill={isHomeRoute ? 'white' : 'transparent'}
stroke={isHomeRoute ? 'black' : 'white'}
strokeWidth={1}
<HomeIcon
className={clsx(
'transition-all duration-200 stroke-primary'
)}
fill="white"
stroke="currentColor"
variant={isHomeRoute ? 'Bold' : 'Outline'}
width={20}
height={20} />}
value={t('Menu')} />
<Link
href={`/${name}/about`}
className={clsx(
'flex flex-col justify-arround items-center gap-[5px] text-disabled2 pointer-events-auto dark:**:stroke-neutral-500 min-w-0',
isAboutRoute && 'text-foreground **:stroke-foreground'
'flex flex-col justify-arround items-center gap-[5px] text-primary pointer-events-auto **:stroke-primary min-w-0'
)}
>
<div className="shrink-0">
<div className="shrink-0 text-primary">
<Building
key={`building-${buildingVariant}-${isAboutRoute}`}
size={20}
variant={buildingVariant as 'Bold' | 'Outline'}
color={isAboutRoute ? undefined : "#8C90A3"}
style={isAboutRoute ? { fill: 'currentColor' } : undefined}
color="currentColor"
/>
</div>
<span className={clsx(
'text-xs2 text-disabled-text text-center truncate w-full',
isAboutRoute && 'text-foreground'
)}>
<span className="text-xs2 text-center truncate w-full">
{t('about')}
</span>
</Link>
src/components/navigation/BottomNavLink.tsx
+3 -4
View File
@@ -17,16 +17,15 @@ function BottomNavLink({ icon, value, href, ...restProps }: Props) {
return (
<Link {...restProps} href={href} className={clsx(
'flex flex-col justify-arround items-center gap-[5px] text-disabled2 pointer-events-auto dark:**:stroke-neutral-500 min-w-0',
isActive && 'text-foreground **:stroke-foreground',
'flex flex-col justify-arround items-center gap-[5px] text-primary pointer-events-auto **:stroke-primary min-w-0',
isActive && 'text-primary-foreground **:stroke-primary-foreground',
restProps.className ?? '',
)}>
<div className="shrink-0">
{icon}
</div>
<span className={clsx(
'text-xs2 text-disabled-text text-center truncate w-full',
isActive && 'text-foreground'
'text-xs2 text-center truncate w-full',
)}>
{value}
</span>
src/components/navigation/BottomNavLinkBig.tsx
+3 -7
View File
@@ -17,19 +17,15 @@ function BottomNavHighlightLink({ icon, value, href, ...restProps }: Props) {
return (
<Link {...restProps} href={href} className={clsx(
'flex flex-col justify-arround items-center gap-[5px] text-disabled2 pointer-events-auto',
isActive && 'text-foreground',
'flex flex-col justify-arround items-center gap-[5px] text-primary pointer-events-auto',
restProps.className ?? '',
)}>
<div className={clsx(
'bg-primary text-white p-3.5 rounded-full',
'bg-primary text-primary-foreground p-3.5 rounded-full',
)}>
{icon}
</div>
<span className={clsx(
'text-xs2 text-disabled-text',
isActive && 'text-foreground'
)}>
<span className="text-xs2">
{value}
</span>
</Link>
src/components/overlays/SplashScreen.tsx
+3 -3
View File
@@ -140,7 +140,7 @@ export default function SplashScreen({
repeat: Infinity,
ease: "easeInOut"
}}
// className="w-3 h-3 rounded-full bg-primary shadow-lg shadow-primary/50"
className="w-3 h-3 rounded-full bg-primary shadow-lg shadow-primary/50"
/>
<motion.div
animate={{
@@ -153,7 +153,7 @@ export default function SplashScreen({
repeat: Infinity,
ease: "easeInOut"
}}
// className="w-3 h-3 rounded-full bg-primary shadow-lg shadow-primary/50"
className="w-3 h-3 rounded-full bg-primary shadow-lg shadow-primary/50"
/>
<motion.div
animate={{
@@ -166,7 +166,7 @@ export default function SplashScreen({
repeat: Infinity,
ease: "easeInOut"
}}
// className="w-3 h-3 rounded-full bg-primary shadow-lg shadow-primary/50"
className="w-3 h-3 rounded-full bg-primary shadow-lg shadow-primary/50"
/>
</motion.div>
</motion.div>