SQ>Looks good. The injecting of style sheets is more or less what this simple demo is doing as well. : https://orion.eclipse.org/examples/textview/demo.htmlWow the demo is absolutely wonderful, I cannot understand why I haven't seen it yet. Normally, Nothing can escape from my deep curiosity.. (lol)SQ>Orion has a nice Settings page with more canned themes. Check it out. And that was really one of my big surprises since I don't see in what directory, they are located in my local
copy. And I can't wait to have them also
SQ> Please open a bugzilla if you would like to contribute more themes to the orion editor. Thanks!
Following my lazy nature, I will wait until I have successfully integrate the Theme Builder of Anton to follow your great recommendation.
Best Regards
Lamine
________________________________ De : Silenio Quarti <Silenio_Quarti@xxxxxxxxxx>À : lamine <laminba2003@xxxxxxxx>; "orion-dev@xxxxxxxxxxx" <orion-dev@xxxxxxxxxxx> Envoyé le : Jeudi 15 novembre 2012 17h56Objet : Re: Orion ThemingLooks good. The injecting of style sheets is moreor less what this simple demo is doing as well. https://orion.eclipse.org/examples/textview/demo.htmlOrion has a nice Settings page withmore canned themes. Check it out. Please open a bugzilla if you wouldlike to contribute more themes to the orion editor. Thanks! Silenio From: lamine <laminba2003@xxxxxxxx> To: Silenio Quarti/Ottawa/IBM@IBMCA,"orion-dev@xxxxxxxxxxx"
<orion-dev@xxxxxxxxxxx>, Cc: me <laminba2003@xxxxxxxx> Date: 11/14/2012 05:49 PM Subject: Orion Theming ________________________________Hi Selenio, Using your documentation, I have successfully created several themes forthe Eclipse Orion Editor and they are derived from the CodeMirror ones.Follow the link below, open the editor.js file, click on the config buttonand play around the themeClass option.1) http://youcontrol.lamine.cloudbees.net/faces/admin/editors/edit.xhtml?id=OrionAfter you can see how things are working by looking at the bottom of thisfile . You will see these settings :settings:{ themeClass:["default","dark","orion","rubyblue","elegant",
"lesser-dark","ambiance","blackboard","monokai","neat"], .....}and the default configuration is :config:{ themeClass:"default" }The css files are loaded on demand via the injected loadStyle method : tab.setConfig=function(key,value){ if(key=='themeClass') Orion.loadStyle(value+".css");var options={};options[key]=value;editor.getTextView().setOptions(options); }};You can perform a right click on the css folder + a click on the downloaditem to get a zip file of the themes. And also, one thing that might beinteresting would be to have an Orion web theme generator.ThanksLamine-----------------------------------------------------------------------------------------------------------------------------------------Currently, the way we expect the font, color, background and a
few otherproperties to change is by providing a style sheet and by setting the themeClassoption of the text view. Sorry, the documentation in this area is not veryclear yet. The basic API (which should not change) are the CSS classnames defined in textview.css These are: textViewContainer -> the whole editor including rulersand text area. textview -> the scrollable portion of the editor textviewContent -> the contents of the editor- text area inside of scrollable area textviewLeftRuler -> left rulers area textviewRightRuler -> right rulers area Take a look at "examples/textview/themes/orion.css" for an example: ----------------------------------- .orion { color: black; } .orion .textview {
background-color: #ffd400; } .... ----------------------------------- This style sheet specifies the ".orion .textview" selector whichoverwrites the background color of the scrollable area of the editor. Thestyle sheet is used by setting the themeClass option as follows: textview.setOptions({themeClass: "orion"}); Silenio