I would like to remove the image handlers in the aloha-editor but i can't figure out how.
I tried using settings.contenthandler.allows but it didn't work.
Remove the default image plugin from the plugins list. But to remove handling for images, removed the selection range from the document.
document.selection.empty();
Related
I'm using quill editor v 1.3.7 inside primeng Editor. There is a strange behavior with whitespaces before an element. First line is my inout, second line is the content of the editor after reloading the stored string of step 1.
<p>line1</p><p><br></p><ul><li>e1</li><li>e2</li></ul>
<p>line1</p><p><br></p><p><br></p><ul><li>e1</li><li>e2</li></ul>
So I store the content with one linebreak before the lit element, after reloading the content quill editor adds an extra linebreak. Does anybody know how to fix this?
I was facing the similar issue.
On debugging the problem, I found that the problem was occurring because of the faulty CSS.
In the styles.scss, I was trying to override the ul and ol attributes to add custom margin for block-start and block-end. This was the main culprit due to which the extra line break was automatically getting introduced on the editor at the time the data was being populated into it.
On removing the custom css, it fixed the issue.
I want to add a custom pill element next to the import definitions in my Monaco Editor just like in the image below. So is there a way to extend Monaco editor's UI or is there any API that'll let me do so? I couldn't find any information on how to do it. Any help would be appreciated!
Thank you!
Check Monaco.IStandaloneCodeEditor.deltaDecorations which allows to add any type of HTML in the editor. Text content will be moved to avoid overlapping of decorations and text.
I've got some colorful md-icon and wanna change it to a grayscale one (replace with a different grayscale basically) when it's disabled (and in reverse).
I can definitely use .css to see whether a button's disabled: button[disabled]:hover, but I'm struggling to see how to combine it together with angular directives (I found a similar demo which works on click: https://codepen.io/elishaterada/pen/mDCEl).
Thanks.
¿wich file you use for the md-icon, svg or another img file?
you can use ng-style,
if is SVG you do delete 'fill' inside xml svg,and play with the css propertys
but if you need change the color to div o another the next example work perfect!
https://codepen.io/Gibrain/pen/pOdpdW
i hope hel you
enter code here
Steps to reproduce the issue::
Open the froala editor on https://www.froala.com/wysiwyg-editor.
Remove everything in the editor.
Insert an image.
Add a caption to the image.
Click outside the image and try to type.
Issue: After adding image caption, If write any text then it always written inside the image area[blue color]
Video:
In Froala: https://github.com/froala/wysiwyg-editor/issues/2597#issuecomment-386163085
Can anyone help me?
If you look at your browser's dom inspector you will see that erasing the content and adding the image leaves you with one element wrapping the image and caption, and therefore no-where else to set focus to continue typing. The quickinsert feature also fails to show as there are no block boundaries to trigger it.
Froala Editor offers a decent events API, and there is a workaround via the 'image.inserted' event which fires when an image element is added into the editor. The code below listens for this event and inserts a new para element immediately after Froala's wrapping elements around the image. When typed, your caption text is part of Froala's wrapper around the image, leaving this new para ready to accept focus and let you type into it.
$('#yourselector').on('froalaEditor.image.inserted', function (e, editor, $img, response) {
$img.after("<p>Type something here</p>"); // insert a new para or div here
});
Note the downside of the simple workaround is that you get extra content injected, but the benefit hopefully outweighs that for your use-case.
This is a plain JS solution which hopefully you can adapt for your environment.
I have previously failed to add JS snippets for Froala to SO so provide this codepen working example.
Is this what you are looking for? The text is after the image caption and not inside the image area [blue bordered].
I upgraded from ng-grid to ui-grid. The grid works fine including sorting, filtering and moving. I even have the correct font files and have them mapped properly. However I have no icons what so ever. I am not even getting "funky chars" because of the missing font file.
To show the order of the sort, nothing in the pagination buttons, nothing in the header row and nothing to show there is a dropdown menu. Does any one know if "ui" vs "ng" they removed anything like that?
How do I get the pagination to show something for the user to see and how do i show icons for the sort direction in the headers?
The current UI-Grid CSS file definitely has that ui-grid-icon-up-dir class; here's the relevant snippet:
/* '썘' */
.ui-grid-icon-up-dir:before {
content: '\c359';
}
Since the ui-grid-icon-up-dir class is not defined in the CSS file you examined, that file must be outdated (perhaps a cache- or path-related issue?) To test that theory, you could try temporarily changing your CSS link to the current UI-Grid CSS to see if those icons appear:
<link href="http://ui-grid.info/release/ui-grid-unstable.css" rel="stylesheet">