|
|
| (10 intermediate revisions by one other user not shown) |
| Line 1: |
Line 1: |
| − | == Solstice (a skin for Phoenix) ==
| + | The documentation for the new solstice theme is available at https://eclipse.org/eclipse.org-common/themes/solstice/docs/#body_solstice |
| − | | + | |
| − | === About: ===
| + | |
| − | The Eclipse Foundation is currently working on a new look and feel for www.eclipse.org. We have setup a test instance on http://staging.eclipse.org. We are planing to go live on June 11th, 2014. | + | |
| − | | + | |
| − | === Introduction: ===
| + | |
| − | [[File:Solstice home.jpg]]
| + | |
| − | | + | |
| − | This is the new Solstice theme for eclipse.org. We designed it to be cleaner and lighter. We took a less is more approach. We’ve decided to use Bootstrap for
| + | |
| − | | + | |
| − | Solstice, you can find more information about this here:
| + | |
| − | http://getbootstrap.com/. In addition, we now include jQuery v2.1.0 on every page. You shouldn't include your own instance of jQuery with Solstice.
| + | |
| − | | + | |
| − | We will support UI components from Nova. We’re hoping that the transition to Solstice won’t be too hard for any of the project sites.
| + | |
| − | | + | |
| − | === Using Solstice ===
| + | |
| − | | + | |
| − | ==== The Basics ====
| + | |
| − | [[Image:NovaColumns.jpg]]
| + | |
| − | | + | |
| − | Nova uses a 3 column layout. '''#leftnav, #midcolumn, and #rightcolumn'''. Each of these are only used once per document.
| + | |
| − | | + | |
| − | ===== #leftnav =====
| + | |
| − | leftnav is the same as it was in Phoenix. This nav is generated by using the nav class and passed into your $App->generatePage() function.
| + | |
| − | | + | |
| − | If you do not wish your page to have a left nav, or the Faux Purple column NULL out the $nav paramater in your $App->generatePage() function.
| + | |
| − | | + | |
| − | ===== #midcolumn =====
| + | |
| − | midcolumn is where your content goes.
| + | |
| − | | + | |
| − | The '''.homeitem''' class is used to make content groupings inside of #midcolumn. Here's an example
| + | |
| − | <pre>
| + | |
| − | <div class='homeitem'>
| + | |
| − | <h3>subsection title</h3>
| + | |
| − | ''<p> <ul> <ol> <span> etc''
| + | |
| − | ...
| + | |
| − | </div>
| + | |
| − | </pre>
| + | |
| − | | + | |
| − | *midcolumn is 495 pixels wide.
| + | |
| − | | + | |
| − | ===== #rightcolumn =====
| + | |
| − | rightcolumn is used to place navigation boxes, related links, graphics, etc.
| + | |
| − | | + | |
| − | The sideitem class is used to create content groupings inside of #rightcolumn. Here's an example
| + | |
| − | | + | |
| − | <pre>
| + | |
| − | <div class='sideitem'>
| + | |
| − | <h6>subsection title</h6>
| + | |
| − | <div class='modal'> **1
| + | |
| − | ''<p> <ul> <ol> <span> etc''
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </pre>
| + | |
| − | **1 If you choose to not have a div.modal then the gradient fade background will not appear.
| + | |
| − | | + | |
| − | *rightcolumn is 240 pixels wide.
| + | |
| − | | + | |
| − | | + | |
| − | === Migrating your projects page from Phoenix ===
| + | |
| − | When migrating your projects from the Phoenix skin was designed to be easy. There are only a few minor differences in the CSS markup show its look.
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | ==== .homeitem3col & .homeitem ====
| + | |
| − | This preview shows how these 2 classes are displayed in the Phoenix Skin.
| + | |
| − | | + | |
| − | [[Image:phoenixHomeItem.jpg]]
| + | |
| − | | + | |
| − | In Nova there will be no '''.homeitem''' style class. All containers will appear like the old '''.homeitem3col''', to be the full width of '''.midcolumn'''
| + | |
| − | | + | |
| − | If your pages use .homeitem3col or .homeitem they will display correctly, while it'd be nice if you changed them all to .homeitem but there is no need to do so.
| + | |
| − | | + | |
| − | === Starting from the template (/default) ===
| + | |
| − | When starting from a copy of the template at [http://www.eclipse.org/default /default] the following adjustments are required:
| + | |
| − | | + | |
| − | * create your own banner (backgroundMain.png) as explained in the [http://www.eclipse.org/default/images/backgroundMain.png default banner].
| + | |
| − | * do the obvious replacements of "Your name", "My project home" etc. in _projectCommon.php, index.php, _index.html
| + | |
| − | * in index.php replace reference to /default/style.css with your copy of style.css, '''otherwise the default banner will still be used'''
| + | |
| − | * use midcolumn_example.html as a template for secondary pages
| + | |
