mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-17 17:00:15 +01:00
🎨 style: overall UI improvements (#3576)
* stlye: new dialogs * style: DashGroupItem * style: bookmarks update
This commit is contained in:
parent
5c99d93744
commit
cf393b1308
11 changed files with 172 additions and 121 deletions
|
|
@ -5,7 +5,7 @@ import { Spinner } from '~/components/svg';
|
|||
import { cn } from '~/utils';
|
||||
|
||||
type MenuItemProps = {
|
||||
tag: string;
|
||||
tag: string | React.ReactNode;
|
||||
selected: boolean;
|
||||
count?: number;
|
||||
handleSubmit: (tag: string) => Promise<void>;
|
||||
|
|
@ -25,14 +25,20 @@ const BookmarkItem: FC<MenuItemProps> = ({
|
|||
const [isLoading, setIsLoading] = useState(false);
|
||||
const clickHandler = async () => {
|
||||
setIsLoading(true);
|
||||
await handleSubmit(tag);
|
||||
await handleSubmit(tag as string);
|
||||
setIsLoading(false);
|
||||
};
|
||||
|
||||
const breakWordStyle: React.CSSProperties = {
|
||||
wordBreak: 'break-word',
|
||||
overflowWrap: 'anywhere',
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
role="menuitem"
|
||||
className={cn(
|
||||
'group m-1.5 flex cursor-pointer gap-2 rounded px-2 py-2.5 !pr-3 text-sm !opacity-100 focus:ring-0 radix-disabled:pointer-events-none radix-disabled:opacity-50',
|
||||
'group m-1.5 flex w-[225px] cursor-pointer gap-2 rounded px-2 py-2.5 !pr-3 text-sm !opacity-100 focus:ring-0 radix-disabled:pointer-events-none radix-disabled:opacity-50',
|
||||
'hover:bg-black/5 dark:hover:bg-white/5',
|
||||
highlightSelected && selected && 'bg-black/5 dark:bg-white/5',
|
||||
)}
|
||||
|
|
@ -51,14 +57,14 @@ const BookmarkItem: FC<MenuItemProps> = ({
|
|||
) : (
|
||||
<BookmarkIcon className="size-4" />
|
||||
)}
|
||||
<div className="break-all">{tag}</div>
|
||||
<div style={breakWordStyle}>{tag}</div>
|
||||
</div>
|
||||
|
||||
{count !== undefined && (
|
||||
<div className="flex items-center justify-end">
|
||||
<span
|
||||
className={cn(
|
||||
'ml-auto w-9 min-w-max whitespace-nowrap rounded-md bg-white px-2.5 py-0.5 text-center text-xs font-medium leading-5 text-gray-600',
|
||||
'ml-auto w-7 min-w-max whitespace-nowrap rounded-md bg-white px-2.5 py-0.5 text-center text-xs font-medium leading-5 text-gray-600',
|
||||
'dark:bg-gray-800 dark:text-white',
|
||||
)}
|
||||
aria-hidden="true"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue