mirror/formbricks
1
0
Fork 0
mirror of https://github.com/formbricks/formbricks.git synced 2026-04-24 11:39:22 -05:00
Code Issues Packages Projects Releases 164 Wiki Activity

fix: Unexpected Behavior when Toggling Italics in Text Editor and improve clarity of formatting status (#1506)

Browse Source 
Co-authored-by: Dhruwang <dhruwangjariwala18@gmail.com>
Co-authored-by: Dhruwang Jariwala <67850763+Dhruwang@users.noreply.github.com>
This commit is contained in:
Mohit Negi
2023-10-30 16:08:19 +05:30
committed by GitHub
parent 59113ebe59
commit 8d9b676a03
2 changed files with 12 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/Editor/components/ToolbarPlugin.tsx
+3 -9
View File
@@ -453,11 +453,8 @@ export default function ToolbarPlugin(props: TextEditorProps) {
StartIcon={Bold}
onClick={() => {
editor.dispatchCommand(FORMAT_TEXT_COMMAND, "bold");
if (isItalic) {
editor.dispatchCommand(FORMAT_TEXT_COMMAND, "italic");
}
}}
className={isBold ? "bg-subtle" : ""}
className={isBold ? "bg-subtle active-button" : "inactive-button"}
/>
)}
{!props.excludedToolbarItems?.includes("italic") && (
@@ -468,11 +465,8 @@ export default function ToolbarPlugin(props: TextEditorProps) {
StartIcon={Italic}
onClick={() => {
editor.dispatchCommand(FORMAT_TEXT_COMMAND, "italic");
if (isItalic) {
editor.dispatchCommand(FORMAT_TEXT_COMMAND, "bold");
}
}}
className={isItalic ? "bg-subtle" : ""}
className={isItalic ? "bg-subtle active-button" : "inactive-button"}
/>
)}
{!props.excludedToolbarItems?.includes("link") && (
@@ -483,7 +477,7 @@ export default function ToolbarPlugin(props: TextEditorProps) {
type="button"
StartIcon={Link}
onClick={insertLink}
className={isLink ? "bg-subtle" : ""}
className={isLink ? "bg-subtle active-button" : "inactive-button"}
/>
{isLink && createPortal(<FloatingLinkEditor editor={editor} />, document.body)}{" "}
</>
packages/ui/Editor/stylesEditor.css
+9
View File
@@ -335,3 +335,12 @@ i.italic {
i.link {
background-image: url(images/icons/link.svg);
}
.active-button {
color: #000000;
}
.inactive-button {
color: #777;
}