mirror of
https://github.com/QuivrHQ/quivr.git
synced 2024-10-26 15:18:16 +03:00
fix(frontend): using dark mode in tiptap (#2616)
# Description Applying dark mode to icons in tiptap. ## Checklist before requesting a review Please delete options that are not relevant. - [X] My code follows the style guidelines of this project - [X] I have performed a self-review of my code ## Screenshots: <img width="906" alt="image" src="https://github.com/QuivrHQ/quivr/assets/33584382/c8d86fa2-0f58-4c44-82d2-5162a5e025cd">
This commit is contained in:
parent
1a8303ce2a
commit
a266066d25
@ -21,4 +21,8 @@
|
|||||||
.brain_name {
|
.brain_name {
|
||||||
@include Typography.EllipsisOverflow;
|
@include Typography.EllipsisOverflow;
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
.dark_image {
|
||||||
|
filter: invert(100%);
|
||||||
|
}
|
||||||
|
}
|
@ -1,6 +1,7 @@
|
|||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
|
|
||||||
import Icon from "@/lib/components/ui/Icon/Icon";
|
import Icon from "@/lib/components/ui/Icon/Icon";
|
||||||
|
import { useUserSettingsContext } from "@/lib/context/UserSettingsProvider/hooks/useUserSettingsContext";
|
||||||
|
|
||||||
import styles from "./MentionItem.module.scss";
|
import styles from "./MentionItem.module.scss";
|
||||||
|
|
||||||
@ -18,16 +19,18 @@ export const MentionItem = ({
|
|||||||
onClick,
|
onClick,
|
||||||
isSelected,
|
isSelected,
|
||||||
}: MentionItemProps): JSX.Element => {
|
}: MentionItemProps): JSX.Element => {
|
||||||
|
|
||||||
|
const { isDarkMode } = useUserSettingsContext();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<span
|
<span
|
||||||
className={`${styles.mention_item_wrapper} ${
|
className={`${styles.mention_item_wrapper} ${isSelected ? styles.selected : ""
|
||||||
isSelected ? styles.selected : ""
|
}`}
|
||||||
}`}
|
|
||||||
key={item.id}
|
key={item.id}
|
||||||
onClick={onClick}
|
onClick={onClick}
|
||||||
>
|
>
|
||||||
{item.iconUrl ? (
|
{item.iconUrl ? (
|
||||||
<Image src={item.iconUrl} width={18} height={18} alt="logo_url" />
|
<Image src={item.iconUrl} width={18} height={18} alt="logo_url" className={isDarkMode ? styles.dark_image : ""} />
|
||||||
) : (
|
) : (
|
||||||
<Icon color="primary" size="normal" name="brain" />
|
<Icon color="primary" size="normal" name="brain" />
|
||||||
)}
|
)}
|
||||||
|
Loading…
Reference in New Issue
Block a user