Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2026-01-20 17:26:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

🖌️ style: Minor UI Updates (#2011)

Browse source 
* UI Design update

* Add an error icon next to the avatar.

* fix

* Change the style of buttons

* fix: avatar
This commit is contained in:
MACHINSOFT 2024-03-11 17:31:32 +03:00 • committed by GitHub
parent 2e77813952
commit f5a754c8be
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
39 changed files with 147 additions and 121 deletions
Download patch file Download diff file Expand all files Collapse all files

6
client/src/components/Chat/Messages/HoverButtons.tsx
View file

@ -55,7 +55,7 @@ export default function HoverButtons({
<div className="visible mt-0 flex justify-center gap-1 self-end text-gray-400 lg:justify-start">
<button
className={cn(
'hover-button rounded-md p-1 pl-0 text-gray-400 hover:text-gray-900 dark:text-gray-400/70 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400 md:group-hover:visible md:group-[.final-completion]:visible',
'hover-button rounded-md p-1 text-gray-400 hover:text-gray-900 dark:text-gray-400/70 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400 md:group-hover:visible md:group-[.final-completion]:visible',
isCreatedByUser ? '' : 'active',
hideEditButton ? 'opacity-0' : '',
isEditing ? 'active bg-gray-200 text-gray-700 dark:bg-gray-700 dark:text-gray-200' : '',
@ -69,7 +69,7 @@ export default function HoverButtons({
</button>
<button
className={cn(
'ml-0 flex items-center gap-1.5 rounded-md p-1 pl-0 text-xs hover:text-gray-900 dark:text-gray-400/70 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400 md:group-hover:visible md:group-[.final-completion]:visible',
'ml-0 flex items-center gap-1.5 rounded-md p-1 text-xs hover:text-gray-900 dark:text-gray-400/70 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400 md:group-hover:visible md:group-[.final-completion]:visible',
isSubmitting && isCreatedByUser ? 'md:opacity-0 md:group-hover:opacity-100' : '',
)}
onClick={() => copyToClipboard(setIsCopied)}
@ -82,7 +82,7 @@ export default function HoverButtons({
</button>
{regenerateEnabled ? (
<button
className="hover-button active rounded-md p-1 pl-0 text-gray-400 hover:text-gray-900 dark:text-gray-400/70 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400 md:invisible md:group-hover:visible md:group-[.final-completion]:visible"
className="hover-button active rounded-md p-1 text-gray-400 hover:text-gray-900 dark:text-gray-400/70 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400 md:invisible md:group-hover:visible md:group-[.final-completion]:visible"
onClick={regenerate}
type="button"
title={localize('com_ui_regenerate')}

4
client/src/components/Chat/Messages/Message.tsx
View file

@ -59,7 +59,7 @@ export default function Message(props: TMessageProps) {
<div className="relative flex flex-shrink-0 flex-col items-end">
<div>
<div className="pt-0.5">
<div className="flex h-6 w-6 items-center justify-center overflow-hidden rounded-full">
<div className="gizmo-shadow-stroke flex h-5 w-5 items-center justify-center rounded-full">
{typeof icon === 'string' && /[^\\x00-\\x7F]+/.test(icon as string) ? (
<span className=" direction-rtl w-40 overflow-x-scroll">{icon}</span>
) : (
@ -70,7 +70,7 @@ export default function Message(props: TMessageProps) {
</div>
</div>
<div
className={cn('relative flex w-full flex-col', isCreatedByUser ? '' : 'agent-turn')}
className={cn('relative flex w-11/12 flex-col', isCreatedByUser ? '' : 'agent-turn')}
>
<div className="select-none font-semibold">{messageLabel}</div>
<div className="flex-col gap-1 md:gap-3">