[Ecm-checkins] r11734 - in org.nuxeo.theme/trunk: jsf-editor/resources/nxthemes/jsf/editor/styles jsf-editor/resources/nxthemes/jsf/editor/widgets jsf-editor/web jsf-editor/web/icons jsf-editor/web/img jsf/resources/nxthemes/jsf/styles

[jmorliaguet]

Author: jmorliaguet
Date: Sun Feb  4 21:07:53 2007
New Revision: 11734

Modified:
   org.nuxeo.theme/trunk/jsf-editor/resources/nxthemes/jsf/editor/styles/authoring.css
   org.nuxeo.theme/trunk/jsf-editor/resources/nxthemes/jsf/editor/widgets/theme-view.xml
   org.nuxeo.theme/trunk/jsf-editor/web/icons/copy-16.png
   org.nuxeo.theme/trunk/jsf-editor/web/icons/delete-16.png
   org.nuxeo.theme/trunk/jsf-editor/web/icons/duplicate-16.png
   org.nuxeo.theme/trunk/jsf-editor/web/icons/edit-16.png
   org.nuxeo.theme/trunk/jsf-editor/web/img/header-bg.png
   org.nuxeo.theme/trunk/jsf-editor/web/themeSelector.xhtml
   org.nuxeo.theme/trunk/jsf/resources/nxthemes/jsf/styles/nxthemes-widgets.css
   org.nuxeo.theme/trunk/jsf/resources/nxthemes/jsf/styles/nxthemes.css

Log:
- UI updates

Modified: org.nuxeo.theme/trunk/jsf-editor/resources/nxthemes/jsf/editor/styles/authoring.css
==============================================================================
--- org.nuxeo.theme/trunk/jsf-editor/resources/nxthemes/jsf/editor/styles/authoring.css	(original)
+++ org.nuxeo.theme/trunk/jsf-editor/resources/nxthemes/jsf/editor/styles/authoring.css	Sun Feb  4 21:07:53 2007
@@ -1,44 +1,50 @@
-html {
-  overflow-y: expression('hidden'); /* IE */
-}
 
-body {
+html, body {
   margin: 0;
   padding: 0;
-  overflow-y: expression('auto'); /* IE */
-  height: expression('100%'); /* IE */
-}
-
-:root {
-  overflow-y: scroll;
-}
-
- at media screen {
-  body>div.nxthemesHeader {
-    position: fixed;
-  }
-}
-
-#editorArea {
-  margin-top: 35px;
+  height: 100%;
 }
 
 /* Top header */
-.nxthemesHeader {
-  background: #999 url(/nxthemes-jsf-editor/img/header-bg.png) bottom left
+#nxthemesHeader {
+  background: #fff url(/nxthemes-jsf-editor/img/header-bg.png) top left
     repeat-x;
   text-decoration: none;
-  position: absolute;
+  position: fixed;
   z-index: 10;
   top: 0;
   left: 0;
-  height: 35px;
+  height: 105px;
   width: 100%;
-  margin: 0;
-  padding: 0;
+}
+
+#topButtons {
+  position: absolute;
+  top: 8px;
+  left: 4px;
+}
+
+#perspectiveSelector {
+  position: absolute;
+  top: 8px;
+  right: 4px;
+}
+
+#canvasArea {
+  padding: 10px;
+  position: absolute;
+  z-index: 1;
+  top: 105px;
+  min-height:100%;
 }
 
 /* Theme selector tabs */
+
+#themeSelectorArea {
+  position: absolute;
+  top: 35px;
+}
+
 #nxthemesThemeSelector ul {
   list-style: none;
 }
@@ -57,7 +63,6 @@
 .nxthemesPerspectiveSelector {
   font: 12px Arial, sans-serif;
   color: #fff;
-  padding-right: 10px;
 }
 
 .nxthemesPerspectiveSelector select,.nxthemesPerspectiveSelector button {
@@ -68,6 +73,40 @@
   border: 1px solid #000;
 }
 
+
+/* canvas mode */
+#canvasModeArea {
+  position: absolute;
+  top: 85px;
+  right: 8px;
+}
+
+div.nxthemesCanvasModeSelector {
+  font: 11px Arial, sans-serif;
+  text-align: right;
+  padding: 0;
+}
+
+div.nxthemesCanvasModeSelector a {
+  text-decoration: none;
+  padding: 0 0.2em;
+  color: #000;
+  background-color: #fff;
+  border-style: solid;
+  border-width: 1px;
+  border-color: #ddd #999 #999 #ddd;
+}
+
+div.nxthemesCanvasModeSelector a:hover {
+  background-color: #eee;
+}
+
+div.nxthemesCanvasModeSelector a.selected {
+  background-color: #eee;
+  border-color: #666 #ddd #ddd #666;
+  color: #333;
+}
+
 #nxthemesOverlay {
   position: fixed;
   top: 0px;
@@ -131,11 +170,6 @@
   background-color: #fff;
 }
 
-#canvasArea {
-  margin-top: 35px;
-  padding: 10px;
-}
-
 .emptyContainer {
   height: 35px;
   border: 1px dashed red;
@@ -213,7 +247,7 @@
   background-color: #ddd;
   padding: 2px;
   padding-left: 15px;
-  z-index: 20;
+  z-index: 30;
   background-image: none;
 }
 
@@ -311,10 +345,16 @@
 /* page tabs */
 .nxthemesPageTabs {
   font: 11px Arial;
-  margin: 10px;
+  margin-top: 10px;
+  padding-left: 10px;
   border-bottom: 1px dotted #ccc;
 }
 
+.nxthemesPageTabs ul {
+  margin: 0;
+  padding: 0;
+}
+
 .nxthemesPageTabs li {
   padding: 3px 0px 0px 20px;
   background-image: url(/nxthemes-jsf-editor/img/l-page-tab.png);
@@ -438,31 +478,7 @@
   border: 1px solid #fc0;
 }
 
-div.nxthemesCanvasModeSelector {
-  font: 11px Arial, sans-serif;
-  text-align: right;
-  padding: 0 1.5em;
-}
-
-div.nxthemesCanvasModeSelector a {
-  text-decoration: none;
-  padding: 0 0.2em;
-  color: #000;
-  background-color: #fff;
-  border-style: solid;
-  border-width: 1px;
-  border-color: #ddd #999 #999 #ddd;
-}
-
-div.nxthemesCanvasModeSelector a:hover {
-  background-color: #eee;
-}
 
-div.nxthemesCanvasModeSelector a.selected {
-  background-color: #eee;
-  border-color: #666 #ddd #ddd #666;
-  color: #333;
-}
 
 /* layout */
 .sizer {

Modified: org.nuxeo.theme/trunk/jsf-editor/resources/nxthemes/jsf/editor/widgets/theme-view.xml
==============================================================================
--- org.nuxeo.theme/trunk/jsf-editor/resources/nxthemes/jsf/editor/widgets/theme-view.xml	(original)
+++ org.nuxeo.theme/trunk/jsf-editor/resources/nxthemes/jsf/editor/widgets/theme-view.xml	Sun Feb  4 21:07:53 2007
@@ -35,91 +35,95 @@
 
     <nxthemes:accesskeys />
 
-    <nxthemes:controller resource="editor-perspectives.json" />
-    <nxthemes:view resource="editor-area.json" />
-
-    <div class="nxthemesHeader">
+    <div id="nxthemesHeader">
 
-      <span style="float: right">
-
-        <!-- perspective selector -->
-        <nxthemes:controller
-          resource="perspective-selector.json" />
+      <div id="topButtons">
+        <nxthemes:button identifier="add fragments"
+          controlledBy="editor buttons"
+          switchTo="editor perspectives/add fragments" label="Add fragments" />
+
+        <nxthemes:button identifier="canvas"
+          controlledBy="editor buttons"
+          switchTo="editor perspectives/edit canvas" label="Edit canvas" />
+
+        <nxthemes:button identifier="export theme"
+          switchTo="editor perspectives/export theme" label="Export theme" />
+
+        <nxthemes:button identifier="exit"
+          link="/nxthemes/select?engine=&amp;perspective=&amp;theme="
+          label="Exit" />
+      </div>
 
+      <div id="perspectiveSelector">
         <nxthemes:panel identifier="perspective selector"
           url="/nxthemes-jsf-editor/perspectiveSelector.faces"
           controlledBy="editor perspectives,perspective selector"
           visibleInPerspectives="add fragments,edit canvas" />
-      </span>
-
-      <nxthemes:controller resource="editor-buttons.json" />
-
-      <nxthemes:controller resource="canvas-mode-selector.json" />
+      </div>
 
-      <nxthemes:button identifier="add fragments"
-        controlledBy="editor buttons"
-        switchTo="editor perspectives/add fragments" label="Add fragments" />
 
-      <nxthemes:button identifier="canvas"
-        controlledBy="editor buttons"
-        switchTo="editor perspectives/edit canvas" label="Edit canvas" />
 
-      <nxthemes:button identifier="export theme"
-        switchTo="editor perspectives/export theme" label="Export theme" />
+      <!--  theme selector -->
+      <div id="themeSelectorArea">
+        <nxthemes:panel identifier="theme selector"
+          url="/nxthemes-jsf-editor/themeSelector.faces"
+          controlledBy="editor perspectives,theme switcher"
+          visibleInPerspectives="add fragments,edit canvas,edit element" />
+      </div>
 
-      <nxthemes:button identifier="exit"
-        link="/nxthemes/select?engine=&amp;perspective=&amp;theme="
-        label="Exit" />
+      <div id="canvasModeArea">
+        <!-- canvas mode selector -->
+        <nxthemes:panel identifier="canvas mode selector"
+          url="/nxthemes-jsf-editor/canvasModeSelector.faces"
+          controlledBy="editor perspectives,canvas mode selector"
+          visibleInPerspectives="add fragments,edit canvas,edit element" />
+      </div>
 
     </div>
 
     <div id="editorArea">
 
-      <nxthemes:controller resource="layout-editor-actions.json" />
-
       <!--  fragment factory -->
       <nxthemes:panel identifier="fragment factory"
         url="/nxthemes-jsf-editor/fragmentFactory.faces"
         controlledBy="editor perspectives,fragment factory expander,toolbox mover"
         visibleInPerspectives="add fragments" />
 
-      <!--  theme selector -->
-      <div id="themeSelectorArea">
-        <nxthemes:panel identifier="theme selector"
-          url="/nxthemes-jsf-editor/themeSelector.faces"
-          controlledBy="editor perspectives,theme switcher"
-          visibleInPerspectives="add fragments,edit canvas,edit element" />
-      </div>
+      <div id="canvasArea">[markup]</div>
 
-      <!-- context menu for tabs -->
-      <nxthemes:view resource="tab-context-menu.json" />
+    </div>
 
-      <!-- canvas mode selector -->
-      <nxthemes:panel identifier="canvas mode selector"
-        url="/nxthemes-jsf-editor/canvasModeSelector.faces"
-        controlledBy="editor perspectives,canvas mode selector"
-        visibleInPerspectives="add fragments,edit canvas,edit element" />
-
-      <nxthemes:controller
-        resource="fragment-factory-expander.json" />
-      <nxthemes:controller resource="toolbox-mover.json" />
-      <nxthemes:controller resource="fragment-inserter.json" />
+    <!-- perspective selector -->
+    <nxthemes:controller
+      resource="perspective-selector.json" />
 
-      <nxthemes:controller resource="theme-switcher.json" />
+    <nxthemes:controller resource="editor-perspectives.json" />
+    <nxthemes:view resource="editor-area.json" />
+    <nxthemes:controller resource="editor-buttons.json" />
 
-      <nxthemes:controller resource="link-disabler.json" />
+    <nxthemes:controller resource="canvas-mode-selector.json" />
 
-      <div id="canvasArea">[markup]</div>
+    <nxthemes:controller resource="layout-editor-actions.json" />
 
-      <!-- element drag-and-drop -->
-      <nxthemes:controller resource="element-mover.json" />
+    <!-- context menu for tabs -->
+    <nxthemes:view resource="tab-context-menu.json" />
 
-      <!-- contextual menu -->
-      <nxthemes:controller resource="context-menu-actions.json" />
-      <nxthemes:controller resource="toggle-context-menu.json" />
-      <nxthemes:view resource="context-menu.json" />
+    <nxthemes:controller
+      resource="fragment-factory-expander.json" />
+    <nxthemes:controller resource="toolbox-mover.json" />
+    <nxthemes:controller resource="fragment-inserter.json" />
 
-    </div>
+    <nxthemes:controller resource="theme-switcher.json" />
+
+    <nxthemes:controller resource="link-disabler.json" />
+
+    <!-- element drag-and-drop -->
+    <nxthemes:controller resource="element-mover.json" />
+
+    <!-- contextual menu -->
+    <nxthemes:controller resource="context-menu-actions.json" />
+    <nxthemes:controller resource="toggle-context-menu.json" />
+    <nxthemes:view resource="context-menu.json" />
 
     <!--  Status message -->
     <div id="nxthemesStatusMessage" style="display:none"></div>

Modified: org.nuxeo.theme/trunk/jsf-editor/web/icons/copy-16.png
==============================================================================
Binary files. No diff available.

Modified: org.nuxeo.theme/trunk/jsf-editor/web/icons/delete-16.png
==============================================================================
Binary files. No diff available.

Modified: org.nuxeo.theme/trunk/jsf-editor/web/icons/duplicate-16.png
==============================================================================
Binary files. No diff available.

Modified: org.nuxeo.theme/trunk/jsf-editor/web/icons/edit-16.png
==============================================================================
Binary files. No diff available.

Modified: org.nuxeo.theme/trunk/jsf-editor/web/img/header-bg.png
==============================================================================
Binary files. No diff available.

Modified: org.nuxeo.theme/trunk/jsf-editor/web/themeSelector.xhtml
==============================================================================
--- org.nuxeo.theme/trunk/jsf-editor/web/themeSelector.xhtml	(original)
+++ org.nuxeo.theme/trunk/jsf-editor/web/themeSelector.xhtml	Sun Feb  4 21:07:53 2007
@@ -20,7 +20,8 @@
   </tr>
 </table>
 
-<ul class="nxthemesTabs nxthemesPageTabs">
+
+<ul class="nxthemesPageTabs">
   <ui:repeat value="#{nxthemesUiManager.availablePages}" var="page">
     <li class='#{(page.name == nxthemesUiStates.currentPage.name) ? "selected" : ""}'><a class="switcher" href="javascript:void(0)"
       name="#{nxthemesUiStates.currentTheme.name}/#{page.name}"

Modified: org.nuxeo.theme/trunk/jsf/resources/nxthemes/jsf/styles/nxthemes-widgets.css
==============================================================================
--- org.nuxeo.theme/trunk/jsf/resources/nxthemes/jsf/styles/nxthemes-widgets.css	(original)
+++ org.nuxeo.theme/trunk/jsf/resources/nxthemes/jsf/styles/nxthemes-widgets.css	Sun Feb  4 21:07:53 2007
@@ -133,16 +133,11 @@
 }
 
 /* Tabs */
-.nxthemesTabs {
-  text-align: left;
-  text-decoration: none;
-  padding-left: 1px;
-  margin: 0;
-}
-
 .nxthemesTabs ul {
   padding: 0;
   margin: 0;
+  text-align: left;
+  text-decoration: none;
 }
 
 .nxthemesTabs li {

Modified: org.nuxeo.theme/trunk/jsf/resources/nxthemes/jsf/styles/nxthemes.css
==============================================================================
--- org.nuxeo.theme/trunk/jsf/resources/nxthemes/jsf/styles/nxthemes.css	(original)
+++ org.nuxeo.theme/trunk/jsf/resources/nxthemes/jsf/styles/nxthemes.css	Sun Feb  4 21:07:53 2007
@@ -17,12 +17,14 @@
 /* select frame */
 div.nxthemesSelectVert {
   background-image: url(/nxthemes/img/select-v.gif);
+  background-repeat: repeat-y;
   width: 1px;
   position: absolute;
 }
 
 div.nxthemesSelectHor {
   background-image: url(/nxthemes/img/select-h.gif);
+  background-repeat: repeat-x;
   height: 1px;
   position: absolute;
 }