refactor(clerk-js): Improve NavButton contrast (#6351)

Author: alexcarpenter

.changeset/wicked-badgers-know.md

@@ -0,0 +1,5 @@
+---
+'@clerk/clerk-js': patch
+---
+
+Improve the contrast of nav bar buttons within profile components.

packages/clerk-js/src/ui/elements/Navbar.tsx

@@ -279,14 +279,13 @@ const NavButton = (props: NavButtonProps) => {
           gap: t.space.$3,
           justifyContent: 'flex-start',
           backgroundColor: isActive ? t.colors.$neutralAlpha100 : undefined,
-          color: isActive ? t.colors.$primary500 : t.colors.$neutralAlpha600,
+          color: isActive ? t.colors.$primary500 : t.colors.$colorMutedForeground,
           '&:hover': {
             backgroundColor: isActive ? undefined : t.colors.$neutralAlpha25,
           },
           '&:focus': {
             backgroundColor: isActive ? undefined : t.colors.$neutralAlpha50,
           },
-          opacity: isActive ? 1 : 0.6,
         }),
         sx,
       ]}