I am having some trouble styling filepicker.io widgets for web, specifically filepicker-dragdrop.
Is there any way to disable the inline styling and replace them with classes?
Something like data-fp-disable-styles or perhaps when using data-fp-dropzone-class="..." the inline styling is automatically disabled.
Although you can add classes to the button with the attribute data-fp-button-class, I cannot get rid of the inline styling on the on the dropzone and container div.
You can set the data-fp-drag-class and data-fp-class options to set the styling of the dropzone and container div and use the !important flag for any styles that you want to use to override the inline styles.
If you're looking for a more fully customizable solution, we'd recommend using the raw javascript api's to create your own drag pane (https://developers.filepicker.io/docs/web/#widgets-droppane) and/or pick button
Related
I come around to setup an background-image for summernote wysiwyg editor, let me know is there any control I need to set or any wysiwyg editor supports this thanks.
Summernote does not explicitly support setting background images in the editor. You should, however, be able to do so by setting the background in css on the .note-editable class, just make sure to do so after Summernotes declaration, i.e. include your style after the Summernote stylesheet. Keep in mind using backgrounds could make the visual appearance of elements inside the editing area harder to visualise.
I want to implement a custom text field with javascript and css. Is this allowed in the ionic fromework? Or will it not work?
It's just plain web with HTML, CSS and Javascript. What Ionic provides are the basic bootstrap for an application and their own UI elements with styling. So, it's your choice to define your own set of elements or customize Ionic's.
I know I can link a style sheet to TinyMCE and this will be used when I am editing. It also seems to apply the styling to the Heading options available in the format dropdown list which is great. I also know I can add custom formats menu using custom_formats (here) but is there a way for the Formats to be populated using my CSS automatically? I have various classes in my CSS for the P tag and would like to allow my users to utilise them.
No, this is not possible (at least not out of the box).
How could a piece of code guess what style or class to use from the pure CSS?
I have a gwt application which I need to apply custom themes for specific widgets, so I can maintain the Standard gwt CSS (for other widgets that I don't need to apply css to) in the gwt.xml file :
<inherits name='com.google.gwt.user.theme.standard.Standard'/>
I am using ClientBundle and CssResource approach in my app. I have applied simple css however I need to make a css that will be able to apply css for: selected and not selected, hover and push events/actions on a widget, just like what the standard gwt css provides.
What to write in the my css file so that for a MenuBar when I apply this:
ManuBar menuBar = new MenuBar(false);
menuBar.setStyleName(AppResources.INSTANCE.css().menuBar())
I will get the same MenuBar effects of a standard MenuBar css of gwt? With the App.css I have below, I just get a black menubar and the font-color of the menubar does not change, I think there is a proper way to apply css with gwt widgets, however I cannot find a good resource about this on the web. What I am trying to accomplish is to be able to change the menubar color theme to say, black, chrome or whatever color but still make the widget look like a real menubar.
App.css:
.menuBar {
background:#3c3b37;
font-weight:bold;
color:#FFFFFF;
font-size:10px;
}
I have a feeling you might be experiencing the problem lots of us face when we forget to call ensureInjected on the CssResource. The CSS never gets added to the page, and so it looks like it's not working.
AppResources.INSTANCE.css().ensureInjected();
why not try simply with menuBar.setStyleName("menuBar"); I'm sure this will work.
is there a way to force the GWT's RichTextEditor to use custom stylesheet for the edited text?
From what i have seen, it uses an iframe to render the text, so the host documen's styles are ignored.
That's currently not possible (there's an open issue about it).
As a workaround you could manually add your style definitions to the head element of the iframe document. See here for an example.