How to customize the open(+) and close (-) icons in jsTree - jstree

Is it possible to customize the open(-) and close(+) icons of jstree using the types plugin ? I can customize the node icons using types plugin,but was wondering, if I can do something same for expando icons also.

The jstree icons are all css based sprites so you could always include your own CSS after the jstree.css where you have specific rewrites of the ins.jstree-icon instances.

Related

Maki icons not all displaying

I'm trying to build a map which allows users to choose icons for their geojson points. I just want to use the default map styles (streets|outdoors|light|dark|satellite) and Maki icons, however, not all icons are showing on all styles.
For example 'bicycle' and 'cafe' show on all the map styles, 'circle' only shows on satellite, and 'marker' doesn't show on any of them.
On a style I developed for another purpose, all markers show fine even though I know I didn't do anything special to 'add' them to the style.
So, my code is not the problem, my question is about the availability of maki icons on the default styles. I would have thought they'd all be available on all styles, but it seems not.
How can I tell which icons will work across all the default styles (short of trial and error)?
Is there some way I can 'enable' all the icons on a style?
Failing that, if I do have to make my own versions of the basic styles, I guess I can, but how do I ensure all the icons are loaded into the style?
The standard Mapbox styles are fairly optimised, and don't include anything that's not needed to display them. So, icons that aren't used in the style itself aren't included.
When you create a new style, I think Mapbox by default includes the whole Maki set.
If you can modify the style file (JSON) directly, you could try changing this line (for the Mapbox Streets style):
"sprite": "mapbox://sprites/mapbox/streets-v9",
to the equivalent in one of your custom styles, something like:
sprite": "mapbox://sprites/woowoowoo/htd32t6hd236t",
But it might cause problems if there are icons in Mapbox Streets that aren't in your style.
In short, I don't think there's a simple way to add "all the icons". Each style has its own set of icons.
A better way might be to use addImage/loadImage to load the custom icons you want, at run time. See this example.

Filepicker.io Web - Disable Inline Styles

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

How to apply proper CSS with GWT components?

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.

how to customize eclipse-rcp application's look and feel?

Use presentation solution can only change the look&feel of Views and Editors,
Can I change the look&feel of swt widgets, such as Tree, Table , TextInput ...and the background-color of all the gray panels
You can use the e4's CSS engine to render the elements. It works well with 3.x as well.

How to use multiple jQuery UI Themes in a Zend Framework application?

I am currently using the ui-lightness theme in my Zend Framework application but I would like to use both for different things. I'm currently registering the ui-lightness theme with this line in my bootstrap:
$view->headLink()->appendStylesheet($view->baseUrl().'/js/jquery/css/ui-lightness/jquery-ui-1.7.2.custom.css');
How can I add another theme to use? How will the application know which theme to use if I add another stylesheet?
You can do this using CSS scope. When you build your theme on the jQuery UI site choose Advanced Settings and then enter in name in the scope field.
Do the same with whatever other themes you want to use, making sure that the scope is unique for each one.
Include the CSS theme files as normal (using appendStylesheet) and use the scope classes to style each area/item on the page
A styled example is given here
I don't think you can use two themes on the same page out of the box with jQuery UI. Each jQuery UI theme styles all widgets, not just specific ones.
You could, create your own stylesheets to style widgets individually. Or, if you don't want different themes on a single page, just include the different themes on different pages.
If you want different jQuery UI themes on different pages of your application, you can use Zend_Layout to switch layouts on different pages of your application. Each layout can use a different jQuery UI theme.