Merged PR 73: changed colors in sidebar

changed colors in sidebar
This commit is contained in:
Mouli Chand Birudugadda
2026-04-01 06:41:56 +00:00
committed by Kartik Datrika
6 changed files with 56 additions and 18 deletions

View File

@@ -145,7 +145,7 @@ export const NavAccountCard = ({
}
return (
<div ref={triggerRef} className="relative flex items-center gap-3 rounded-xl p-3 ring-1 ring-secondary ring-inset">
<div ref={triggerRef} className="relative flex items-center gap-3 rounded-xl p-3">
<AvatarLabelGroup
size="md"
src={selectedAccount.avatar}

View File

@@ -6,8 +6,8 @@ import { Badge } from "@/components/base/badges/badges";
import { cx, sortCx } from "@/utils/cx";
const styles = sortCx({
root: "group relative flex w-full cursor-pointer items-center rounded-md bg-primary outline-focus-ring transition duration-100 ease-linear select-none hover:bg-primary_hover focus-visible:z-10 focus-visible:outline-2 focus-visible:outline-offset-2",
rootSelected: "bg-active hover:bg-secondary_hover border-l-2 border-l-brand-600 text-brand-secondary",
root: "group relative flex w-full cursor-pointer items-center rounded-md outline-focus-ring transition duration-100 ease-linear select-none focus-visible:z-10 focus-visible:outline-2 focus-visible:outline-offset-2",
rootSelected: "bg-sidebar-active hover:bg-sidebar-active border-l-2 border-l-brand-600",
});
interface NavItemBaseProps {
@@ -48,9 +48,9 @@ export const NavItemBase = ({ current, type, badge, href, icon: Icon, children,
const labelElement = (
<span
className={cx(
"flex-1 text-md font-semibold text-secondary transition-inherit-all group-hover:text-secondary_hover",
"flex-1 text-md font-semibold text-white transition-inherit-all",
truncate && "truncate",
current && "text-secondary_hover",
current ? "text-sidebar-active" : "group-hover:text-sidebar-hover",
)}
>
{children}
@@ -62,7 +62,9 @@ export const NavItemBase = ({ current, type, badge, href, icon: Icon, children,
if (type === "collapsible") {
return (
<summary className={cx("px-3 py-2", styles.root, current && styles.rootSelected)} onClick={onClick}>
<summary
className={cx("px-3 py-2 bg-sidebar", !current && "hover:bg-sidebar-hover", styles.root, current && styles.rootSelected)}
onClick={onClick}>
{iconElement}
{labelElement}
@@ -80,7 +82,7 @@ export const NavItemBase = ({ current, type, badge, href, icon: Icon, children,
href={href!}
target={isExternal ? "_blank" : "_self"}
rel="noopener noreferrer"
className={cx("py-2 pr-3 pl-10", styles.root, current && styles.rootSelected)}
className={cx("py-2 pr-3 pl-10 bg-sidebar", !current && "hover:bg-sidebar-hover", styles.root, current && styles.rootSelected)}
onClick={onClick}
aria-current={current ? "page" : undefined}
>
@@ -96,7 +98,7 @@ export const NavItemBase = ({ current, type, badge, href, icon: Icon, children,
href={href!}
target={isExternal ? "_blank" : "_self"}
rel="noopener noreferrer"
className={cx("px-3 py-2", styles.root, current && styles.rootSelected)}
className={cx("px-3 py-2 bg-sidebar", !current && "hover:bg-sidebar-hover", styles.root, current && styles.rootSelected)}
onClick={onClick}
aria-current={current ? "page" : undefined}
>