Skip to content
This repository has been archived by the owner on May 24, 2021. It is now read-only.

Added custom inline block on Tooltip #225

Open
indigofa opened this issue May 1, 2020 · 3 comments
Open

Added custom inline block on Tooltip #225

indigofa opened this issue May 1, 2020 · 3 comments

Comments

@indigofa
Copy link

indigofa commented May 1, 2020

Hi there,

I have added successfuly custom inline block on Tooltip and the HTML is rendered correctly on when I use convertToHTML

                            styleToHTML: style => {
                              if (style === "STRIKE") {
                                return (
                                  <span
                                    style={{ textDecoration: "line-through" }}
                                  />
                                )
                              }

But when I click the editor itself is not showing the text with line-through, but it is correct on convertToHTML this is from <p><span style="text-decoration:line-through">asd</span></p>, can someone guide me what I'm missing, How can I make the editor to render that text line-through

This is tooltip config

tooltips={[
                          DanteTooltipConfig({
                            widget_options: {
                              block_types: [
                                {
                                  label: "h1",
                                  style: "header-one",
                                  type: "block",
                                  icon: Icons.h1,
                                },
                                {
                                  label: "strike",
                                  style: "STRIKE",
                                  type: "inline",
                                  icon: Icons.italic,
                                },
                              ],
                            },
                          }),
                        ]}

Thanks

@indigofa
Copy link
Author

indigofa commented May 1, 2020

@michelson I just readed this from the docs but is not clear, can you tell me where is BOLD or ITALIC component defined so I can take a look and make the same with text-align: line-through

Tooltips are another kind of components that will be not rendered in your editor content but will interact with it, and will be rendered over it, like the tooltips you see when you hover links, or select words to toggle BOLD or ITALIC. The tooltips option is an array.

@indigofa
Copy link
Author

indigofa commented May 2, 2020

Anyone from contributors can help with clarification, I'm lost here

@ghost
Copy link

ghost commented Jun 21, 2020

@indigofa I am trying to accomplish the same. Pls let me know if you were able to figure it out.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant