Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-17 08:50:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 7

🎨 style: Unify Styles across Themes and Improve Accessibility (#7783)

Browse source 
* style: update button styles for improved hover effects and accessibility

* style: enhance CustomMenuItem styling for improved visual feedback

* style: improved accessibility and visual consistency

* chore: add missing localization in ActionsPanel

---------

Co-authored-by: Danny Avila <danny@librechat.ai>
This commit is contained in:
Marco Beretta 2025-06-08 00:22:08 +02:00 • committed by GitHub
parent c22d74d41e
commit cd7dd576c1
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
9 changed files with 38 additions and 66 deletions
Download patch file Download diff file Expand all files Collapse all files

18
client/src/components/Chat/Messages/Content/DialogImage.tsx
View file

@ -68,7 +68,7 @@ export default function DialogImage({ isOpen, onOpenChange, src = '', downloadIm
/>
<div className="flex items-center gap-2">
<TooltipAnchor
description={localize('com_ui_save')}
description={localize('com_ui_download')}
render={
<Button onClick={() => downloadImage()} variant="ghost" className="h-10 w-10 p-0">
<ArrowDownToLine className="size-6" />
@ -108,7 +108,7 @@ export default function DialogImage({ isOpen, onOpenChange, src = '', downloadIm
alt="Image"
className="max-h-full max-w-full object-contain"
style={{
maxHeight: 'calc(100vh - 6rem)', // Account for header and padding
maxHeight: 'calc(100vh - 6rem)',
maxWidth: '100%',
}}
/>
@ -117,7 +117,7 @@ export default function DialogImage({ isOpen, onOpenChange, src = '', downloadIm
{/* Side Panel */}
<div
className={`shadow-l-lg fixed right-0 top-0 z-20 h-full w-80 transform rounded-l-2xl border-l border-border-light bg-surface-secondary transition-transform duration-500 ease-in-out ${
className={`shadow-l-lg fixed right-0 top-0 z-20 h-full w-80 transform rounded-l-2xl border-l border-border-light bg-surface-primary transition-transform duration-500 ease-in-out ${
isPromptOpen ? 'translate-x-0' : 'translate-x-full'
}`}
>
@ -132,7 +132,7 @@ export default function DialogImage({ isOpen, onOpenChange, src = '', downloadIm
<div className="space-y-6">
{/* Prompt Section */}
<div>
<h4 className="mb-2 text-sm font-medium text-text-secondary">
<h4 className="mb-2 text-sm font-medium text-text-primary">
{localize('com_ui_prompt')}
</h4>
<div className="rounded-md bg-surface-tertiary p-3">
@ -144,20 +144,18 @@ export default function DialogImage({ isOpen, onOpenChange, src = '', downloadIm
{/* Generation Settings */}
<div>
<h4 className="mb-3 text-sm font-medium text-text-secondary">
<h4 className="mb-3 text-sm font-medium text-text-primary">
{localize('com_ui_generation_settings')}
</h4>
<div className="space-y-3">
<div className="flex items-center justify-between">
<span className="text-sm text-text-secondary">{localize('com_ui_size')}:</span>
<span className="text-sm text-text-primary">{localize('com_ui_size')}:</span>
<span className="text-sm font-medium text-text-primary">
{args?.size || 'Unknown'}
</span>
</div>
<div className="flex items-center justify-between">
<span className="text-sm text-text-secondary">
{localize('com_ui_quality')}:
</span>
<span className="text-sm text-text-primary">{localize('com_ui_quality')}:</span>
<span
className={`rounded px-2 py-1 text-xs font-medium capitalize ${
args?.quality === 'high'
@ -171,7 +169,7 @@ export default function DialogImage({ isOpen, onOpenChange, src = '', downloadIm
</span>
</div>
<div className="flex items-center justify-between">
<span className="text-sm text-text-secondary">
<span className="text-sm text-text-primary">
{localize('com_ui_file_size')}:
</span>
<span className="text-sm font-medium text-text-primary">