⌨️ a11y: enhance accessibility & visual consistency (#6866)

* a11y: TemporaryChat label

* style: ChatForm badges update
This commit is contained in:
Marco Beretta 2025-04-15 04:40:07 +02:00 committed by GitHub
parent d0332c6e07
commit 77a21719fd
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 4 additions and 3 deletions

View file

@ -115,7 +115,7 @@ function MCPSelect({ conversationId }: { conversationId?: string | null }) {
className="badge-icon min-w-fit"
selectIcon={<MCPIcon className="icon-md text-text-primary" />}
selectItemsClassName="border border-blue-600/50 bg-blue-500/10 hover:bg-blue-700/10"
selectClassName="group relative inline-flex items-center justify-center md:justify-start gap-1.5 rounded-full border border-border-medium text-sm font-medium transition-shadow md:w-full size-9 p-2 md:p-3 bg-surface-chat shadow-sm hover:bg-surface-hover hover:shadow-md active:shadow-inner"
selectClassName="group relative inline-flex items-center justify-center md:justify-start gap-1.5 rounded-full border border-border-medium text-sm font-medium transition-all md:w-full size-9 p-2 md:p-3 bg-transparent shadow-sm hover:bg-surface-hover hover:shadow-md active:shadow-inner"
/>
);
}

View file

@ -43,6 +43,7 @@ export function TemporaryChat() {
render={
<motion.button
onClick={handleBadgeToggle}
aria-label={localize(temporaryBadge.label)}
className={cn(
'inline-flex size-10 flex-shrink-0 items-center justify-center rounded-lg border border-border-light text-text-primary transition-all ease-in-out hover:bg-surface-tertiary',
isTemporary

View file

@ -41,8 +41,8 @@ export default function CheckboxButton({
// Base styling from MultiSelect's selectClassName
'group relative inline-flex items-center justify-center gap-1.5',
'rounded-full border border-border-medium text-sm font-medium',
'size-9 p-2 transition-shadow md:w-full md:p-3',
'bg-surface-chat shadow-sm hover:bg-surface-hover hover:shadow-md active:shadow-inner',
'size-9 p-2 transition-all md:w-full md:p-3',
'bg-transparent shadow-sm hover:bg-surface-hover hover:shadow-md active:shadow-inner',
// Checked state styling
isChecked && isCheckedClassName && isCheckedClassName,