ByoungSooPark/modeling-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use app foreground color for focus outline button color so there's no hue collision (#4894)

Browse Source 
Towards #4851
This commit is contained in:
Frank Noirot
2025-01-02 16:10:07 -05:00
committed by GitHub
parent 3d27f0191b
commit d478d81156
5 changed files with 18 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/CommandBar/CommandBarHeader.tsx
View File

@ -194,7 +194,7 @@ function ReviewingButton() {
autoFocus
type="submit"
form="review-form"
className="w-fit !p-0 rounded-sm border !border-primary hover:shadow"
className="w-fit !p-0 rounded-sm hover:shadow"
iconStart={{
icon: 'checkmark',
bgClassName: 'p-1 rounded-sm !bg-primary hover:brightness-110',
@ -212,7 +212,7 @@ function GatheringArgsButton() {
Element="button"
type="submit"
form="arg-form"
className="w-fit !p-0 rounded-sm border !border-primary hover:shadow"
className="w-fit !p-0 rounded-sm hover:shadow"
iconStart={{
icon: 'arrowRight',
bgClassName: 'p-1 rounded-sm !bg-primary hover:brightness-110',

2
src/components/ProjectSidebarMenu.tsx
View File

@ -210,7 +210,7 @@ function ProjectMenuPopover({
return (
<Popover className="relative">
<Popover.Button
className="gap-1 rounded-sm h-9 mr-auto max-h-min min-w-max border-0 py-1 px-2 flex items-center focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary dark:hover:bg-chalkboard-90"
className="gap-1 rounded-sm h-9 mr-auto max-h-min min-w-max border-0 py-1 px-2 flex items-center focus-visible:outline-appForeground dark:hover:bg-chalkboard-90"
data-testid="project-sidebar-toggle"
>
<div className="flex flex-col items-start py-0.5">

4
src/components/UserSidebarMenu.tsx
View File

@ -168,7 +168,7 @@ const UserSidebarMenu = ({ user }: { user?: User }) => {
return (
<Popover className="relative">
<Popover.Button
className="relative group border-0 w-fit min-w-max p-0 rounded-l-full focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary"
className="relative group border-0 w-fit min-w-max p-0 rounded-l-full focus-visible:outline-appForeground"
data-testid="user-sidebar-toggle"
>
<div className="flex items-center">
@ -240,7 +240,7 @@ const UserSidebarMenu = ({ user }: { user?: User }) => {
<li key={id} className="contents">
<ActionButton
{...rest}
className="!font-sans flex items-center gap-2 rounded-sm py-1.5 px-2 cursor-pointer hover:bg-chalkboard-20 dark:hover:bg-chalkboard-80 border-none text-left"
className="!font-sans flex items-center gap-2 rounded-sm py-1.5 px-2 cursor-pointer hover:bg-chalkboard-20 dark:hover:bg-chalkboard-80 !border-none text-left focus-visible:outline-appForeground"
onMouseUp={() => {
close()
}}