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

🖼️ chore: Linting & Transition Styling in UI Components (#7467)

Browse source 
* chore: linting

* 🔧 fix: Correctly parse dimensions for image width and height in OpenAIImageGen component

* style: overlay class for DialogImage component to improve visibility

* style: Update transition timing function for PixelCard component to rely on style props
This commit is contained in:
Danny Avila 2025-05-20 09:24:52 -04:00 • committed by GitHub
parent 59109cd2dd
commit af96666ff4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 18 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -8,7 +8,7 @@ export default function DialogImage({ isOpen, onOpenChange, src = '', downloadIm
showCloseButton={false}
className="h-full w-full rounded-none bg-transparent"
disableScroll={false}
overlayClassName="bg-surface-secondary"
overlayClassName="bg-surface-primary opacity-95 z-50"
>
<div className="absolute left-0 right-0 top-0 flex items-center justify-between p-4">
<Button

4
client/src/components/Chat/Messages/Content/Parts/OpenAIImageGen/OpenAIImageGen.tsx
View file

@ -194,8 +194,8 @@ export default function OpenAIImageGen({
<Image
altText={filename}
imagePath={filepath ?? ''}
width={dimensions.width}
height={dimensions.height}
width={Number(dimensions.width?.split('px')[0])}
height={Number(dimensions.height?.split('px')[0])}
placeholderDimensions={{ width: dimensions.width, height: dimensions.height }}
/>
</div>

3
client/src/components/ui/PixelCard.tsx
View file

@ -350,12 +350,13 @@ export default function PixelCard({
>
<div
className={cn(
'ease-[cubic-bezier(0.5,1,0.89,1)] relative isolate grid select-none place-items-center overflow-hidden rounded-lg border border-border-light shadow-md transition-colors duration-200',
'relative isolate grid select-none place-items-center overflow-hidden rounded-lg border border-border-light shadow-md transition-colors duration-200 ease-in-out',
className,
)}
style={{
width: '100%',
height: '100%',
transitionTimingFunction: 'cubic-bezier(0.5, 1, 0.89, 1)',
}}
onMouseEnter={hoverIn}
onMouseLeave={hoverOut}