css - GWT Tree styling -
i have normal tree widget want style. know tree widget has following styles:
•.gwt-tree { tree } •.gwt-tree .gwt-treeitem { tree item } •.gwt-tree .gwt-treeitem-selected { selected tree item }
the webb people sent me css , html example how should like
css:
/* menu styling */ #menu li { margin-top: 8px; margin-bottom: 8px; /*margin: 8px 0 8px 0;*/ padding: 0; } .menuitems,.indented { background: none repeat scroll 0 0 transparent; border-width: 0; float: left; font-size: 100%; list-style-image: none; list-style-type: none; margin: 0; padding: 0; } .menuitems { * display: block; * float: left; * clear: left; } .indented { border-left: 1px solid #005284; border-right: none; padding-left: 5px; margin-left: 20px; } .menuitems { color: #000000; display: block; } .menuitems a:hover { text-decoration: underline; } .currentpage { color: #c60; font-weight: bold; } and html
<div id="menu"> <ul class="menuitems"> <li> <a href="abc">option 1</a> </li> <li> <a href="abc">option 2</a> </li> <li> <a href="abc">option 3</a> <ul class="indented"> <li class="currentpage"> <a href="blabla">subselection</a> </li> <li> subselection 2 </li> </ul> </li> <li> <a href="abc">option 4</a> </li> </ul> </div> i'm struggling bit want. using uibinder.
- should use .css file or ui:style in ui binder file?
- do need remove default styles "removestylename" , setstylename on every tree item?
thx
update:
found out how add images leafs. make interface:
public interface treeresources extends resources { imageresource treeopen(); imageresource treeclosed(); } create tree gwt.create. make sure images matching names (treeopen.gif, treeclosed.gif) in same folder, or , annotations point them out.
question how them on right side instead of left side?
gwt not expose css class tree item, can each treeitem create:
treeitem item = new treeitem("click me!"); item.getelement().addclassname("gwt-treenode"); tree.additem(item); later can add lines tree this:
.gwt-tree .gwt-treenode { border-left: 1px solid #005284; }
Comments
Post a Comment