rzmk/learnhouse
1
0
Fork 0
mirror of https://github.com/rzmk/learnhouse.git synced 2025-12-19 04:19:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add animations and avatar to editor

Browse source
This commit is contained in:
swve 2022-12-03 17:51:36 +01:00
parent f349378ff9
commit 2995c8ec84
2 changed files with 87 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

14
front/components/Editor/Toolbar/ToolbarButtons.tsx
View file

@ -8,6 +8,12 @@ export const ToolbarButtons = ({ editor }: any) => {
return (
<ToolButtonsWrapper>
<ToolBtn onClick={() => editor.chain().focus().undo().run()}>
<ArrowLeftIcon />
</ToolBtn>
<ToolBtn onClick={() => editor.chain().focus().redo().run()}>
<ArrowRightIcon />
</ToolBtn>
<ToolBtn onClick={() => editor.chain().focus().toggleBold().run()} className={editor.isActive("bold") ? "is-active" : ""}>
<FontBoldIcon />
</ToolBtn>
@ -17,13 +23,6 @@ export const ToolbarButtons = ({ editor }: any) => {
<ToolBtn onClick={() => editor.chain().focus().toggleStrike().run()} className={editor.isActive("strike") ? "is-active" : ""}>
<StrikethroughIcon />
</ToolBtn>
<ToolBtn onClick={() => editor.chain().focus().undo().run()}>
<ArrowLeftIcon />
</ToolBtn>
<ToolBtn onClick={() => editor.chain().focus().redo().run()}>
<ArrowRightIcon />
</ToolBtn>
<ToolSelect onChange={(e) => editor.chain().focus().toggleHeading({ level: parseInt(e.target.value) }).run() }>
<option value="1">Heading 1</option>
<option value="2">Heading 2</option>
@ -52,6 +51,7 @@ const ToolBtn = styled.div`
padding: 5px;
font-size: 5px;
margin-right: 5px;
transition: all 0.2s ease-in-out;
&.is-active {
background: rgba(176, 176, 176, 0.5);