jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

fix: changed tooltip position on playground to improve visibility, fixed color of theme switcher on light mode (#4766)

Browse source 
* Implemented avoidCollisions on ShadTooltip

* Added type for avoidCollisions

* Changed tooltip position for buttons on IOModal

* Fix color of light theme switcher
This commit is contained in:
Lucas Oliveira 2024-11-21 21:40:07 -03:00 • committed by GitHub
commit f0febbcd40
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 15 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/frontend/src/components/appHeaderComponent/components/ThemeButtons/index.tsx
View file

@ -54,7 +54,7 @@ export const ThemeButtons = () => {
className={`relative z-10 inline-flex items-center rounded-full px-1 ${
selectedTheme === "light"
? "text-foreground"
: "text-foreground hover:text-background dark:hover:bg-amber-400"
: "text-foreground hover:bg-amber-400 hover:text-background"
}`}
onClick={() => handleThemeChange("light")}
>

3
src/frontend/src/components/shadTooltipComponent/index.tsx
View file

@ -13,6 +13,7 @@ const ShadTooltip: React.FC<ShadToolTipType> = ({
open,
align,
setOpen,
avoidCollisions = false,
}) => {
if (!content) {
return <>{children}</>;
@ -32,7 +33,7 @@ const ShadTooltip: React.FC<ShadToolTipType> = ({
styleClasses,
)}
side={side}
avoidCollisions={false}
avoidCollisions={avoidCollisions}
align={align}
sticky="always"
>

7
src/frontend/src/components/ui/dialog.tsx
View file

@ -50,7 +50,12 @@ const DialogContent = React.forwardRef<
{...props}
>
{children}
<ShadTooltip styleClasses="z-50" side="left" content="Close">
<ShadTooltip
styleClasses="z-50"
content="Close"
side="bottom"
avoidCollisions
>
<DialogPrimitive.Close className="absolute right-2 top-2 flex h-8 w-8 items-center justify-center rounded-sm ring-offset-background transition-opacity hover:bg-secondary-hover hover:text-accent-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
<Cross2Icon className="h-[18px] w-[18px]" />
<span className="sr-only">Close</span>

6
src/frontend/src/modals/IOModal/newModal.tsx
View file

@ -443,7 +443,11 @@ export default function IOModal({
"absolute right-12 top-2 flex h-8 items-center justify-center rounded-sm ring-offset-background transition-opacity focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
)}
>
<ShadTooltip styleClasses="z-50" content="New Chat">
<ShadTooltip
side="bottom"
styleClasses="z-50"
content="New Chat"
>
<Button
className="mr-2 h-[32px] w-[32px] hover:bg-secondary-hover"
variant="ghost"

1
src/frontend/src/types/components/index.ts
View file

@ -253,6 +253,7 @@ export type ShadToolTipType = {
children?: ReactElement;
delayDuration?: number;
styleClasses?: string;
avoidCollisions?: boolean;
};
export type TextHighlightType = {