Skip to Content

Changes for page ERDivaLook

Last modified by Ravi Mendis on 2010/09/10 01:14
From version 191.1
edited by Ravi Mendis
on 2009/04/24 02:32
Change comment: There is no comment for this version
To version 194.1
edited by David Holt
on 2009/04/23 13:09
Change comment: There is no comment for this version

Summary

Details

Page properties
Author
... ... @@ -1,1 +1,1 @@
1 -XWiki.rmendis
1 +XWiki.dholt
Content
... ... @@ -42,7 +42,7 @@
42 42  
43 43  The graphics designer Eduardo Cesario wrote up his experience of developing his //Organica// design for an early prototype of ERDivaLook on his [[blog>>http://www.organicacreativa.com/organica-creativa.php?area=directtoweb&lang=en]].
44 44  
45 -= How to use ERDivaLook =
45 += Using ERDivaLook =
46 46  
47 47  === Setting the D2W Page CSS ===
48 48  
... ... @@ -71,13 +71,13 @@
71 71  
72 72  {{/code}}
73 73  
74 -The CSS file //NeutralEditPage.css// imports a global CSS for the theme, //Neutral.css//, a generic one for the edit page //ERDIVEditPage.css// and CSS files for D2W components used on an edit page.
74 +The CSS imports a global CSS for the theme, //Neutral.css//, a generic one for the edit page //ERDIVEditPage.css// and CSS files for D2W components used on an edit page.
75 75  
76 76  ===== 2. Image Replacement =====
77 77  
78 78  {{code}}
79 79  
80 -div#a h1.edit {
80 +div#a form h1.edit {
81 81   background: url(/WebObjects/Frameworks/JavaDirectToWeb.framework/WebServerResources/EditMetalBan.gif) no-repeat;
82 82   text-indent: -5000px;
83 83  }
... ... @@ -86,10 +86,4 @@
86 86  
87 87  Standard CSS image replacement applies.
88 88  
89 -Here, the edit page banner is being set. {{color value="red"}}{{div#a h1.edit}}{{/color}} is an example of a **CSS selector**. Diva D2W page content is nested inside a ##<div id="a">..</div>##. It's CSS selector is {{color value="red"}}{{div#a}}{{/color}}. The page title is marked up as ##<h1 class="edit">..</h1>##, so the resulting CSS selector for that element would be {{color value="red"}}{{h1.edit}}{{/color}} or more specifically {{color value="red"}}{{div#a h1.edit}}{{/color}}.
90 -
91 -{{tip title="Tip"}}
92 -
93 -All CSS selectors in a Diva D2W page begin with *{{div#a}}*.
94 -
95 -{{/tip}}
89 +Here, the edit page banner is being set. {{color value="red"}}{{div#a form h1.edit}}{{/color}} is an example of a **CSS selector**. All elements in a Diva look D2W page will begin with {{color value="red"}}{{div#a}}{{/color}}. The page title is a <h1> with a class //edit//, so the resulting CSS selector for that element would be {{color value="red"}}{{h1.edit}}{{/color}} or {{color value="red"}}{{div#a form h1.edit}}{{/color}} more specifically.