Hi all,
1) As of today's 3pm build, pretty well all aspects of the new tab look
will be styleable. That is, there are no hard coded values to speak of.
To give you an idea, in bold are some of the more interesting properties
you can change:
ETabFolder {
background-color: rgb(246, 246, 251);
simple: true;
maximize-visible: false;
minimize-visible: false;
webby-style: true;
margin: 2px;
tab-margin-offset: 4px;
border-color: rgb(201, 200, 204)
/* Can be expressed individually
border-top-color: rgb(201, 200, 204);
border-bottom-color: rgb(201, 200, 204);
*/
}
ETabFolder.active {
background-color: rgb(224, 226, 235);
}
ETabItem {
color: black;
background-color: rgb(241, 240, 245); /* unselected tabs can have
diff color than folder background */
font: normal;
padding-top: 4px;
padding-bottom: 4px;
margin-top: 3px;
margin-left: 2px;
margin-right: 0px;
border-color: rgb(208, 207, 212);
}
ETabItem:selected {
background-color: rgb(255, 255, 255) rgb(246, 245, 250);
padding-top: 7px; /* make the selected tab a bit taller */
}
ETabItem.active {
background-color: rgb(241, 240, 245);
}
ETabItem.active:selected {
background-color: rgb(255, 255, 255) rgb(255, 247, 229);
}
Note that color values can be in the form rgb(), #RRGGBB, or colorName.
You can find the stylesheet in
org.eclipse.e4.ui.examples.legacy.workbench/css/webby.css.
If you've downloaded the self hosting SDK, you can find it on disk in:
eclipse\plugins\org.eclipse.e4.ui.examples.legacy.workbench_0.9.0.vSomeBuildDate\css\webby.css
2) Changes in the style sheet will be picked up in the self hosting
workbench but you need to tell it that the style sheet changed. To do so,
there is a menu
Window->Reload Style Sheet
This will re-read the style sheet in and update the UI [1]. Thus you can
modify the style sheet on disk and then click the menu to live update the
workbench look. You don't need to restart Eclipse.
3) If you decide to create a new CSS file, you''ll need to change the
following property in
org.eclipse.e4.ui.examples.legacy.workbench/plugin.xml:
<property
name="applicationCSS"
value=
"platform:/plugin/org.eclipse.e4.ui.examples.legacy.workbench/css/webby.css"
>
</property>
to point to your new file. This of course will require a restart in order
to be picked up.
I encourage you to play with the styling capability and come up with your
own look to the workbench. Submit it via a bug and share it with others!
Regards,
Kevin
[1] Time permitting, this might get upgraded to prompting for sibling css
files, see bug 278877 _______________________________________________
e4-dev mailing list
[email protected]
https://dev.eclipse.org/mailman/listinfo/e4-dev
