Item12713:

* fixed sidebar modes * fixed box-sizing on firefox and webkits * moved sitemap css to base git-svn-id: http://svn.foswiki.org/trunk/NatSkin@17222 0b4bb1d4-4e5a-0410-9cc4-b2b747904278
foswiki · Jan 8, 2014 · f962ac6 · f962ac6
1 parent eed575c
commit f962ac6
Show file tree

Hide file tree

Showing 6 changed files with 71 additions and 31 deletions.
diff --git a/pub/System/CustomatoTheme/customato.uncompressed.css b/pub/System/CustomatoTheme/customato.uncompressed.css
@@ -193,31 +193,47 @@ h2.marked,
 /* layout */
 .natSideBarContents {
   margin-top:-1em;
-  padding:1em 1px 0 1.5em;
+}
+.natBodyRight .natSideBarContents {
   border-left:1px solid #D5D6DD;
+  padding:1em 1px 0 1.5em;
+}
+.natBodyLeft .natSideBarContents {
+  border-right:1px solid #D5D6DD;
+  padding:1em 1em 0 1px;
+}
+.natBodyBoth .natSideBarContents {
+  padding:1em 0 0 0;
 }
 .natMainHeaderContents,
 .natMainFooterContents {
   padding:0;
 }
 
 .natMainContents {
-  margin:1.5em 0 0;
+  margin-top:1.5em;
   padding:0;
 }
 .natMainFooterContents {
   padding:0;
 }
+.natBodyBoth .natMainHeaderContents,
+.natBodyBoth .natMainFooterContents,
+.natBodyBoth .natMainContents,
 .natBodyRight .natMainHeaderContents,
 .natBodyRight .natMainFooterContents,
 .natBodyRight .natMainContents {
   margin-right:1.5em;
 }
+.natBodyBoth .natMainHeaderContents,
+.natBodyBoth .natMainFooterContents,
+.natBodyBoth .natMainContents,
 .natBodyLeft .natMainHeaderContents,
 .natBodyLeft .natMainFooterContents,
 .natBodyLeft .natMainContents {
   margin-left:1.5em;
 }
+.natBodyFixed .natTopPanelContents,
 .natBodyFixed .natBottomBarContents,
 .natBodyFixed .natBodyContents {
   width:80em;
@@ -274,14 +290,6 @@ h2.marked,
   padding:2em 0;
 }
 
-.natSiteMap .natSiteMapItem {
-  float:left;
-  width:33%;
-}
-.natSiteMap .natSiteMapItem:nth-child(10) {
-   clear; 
-}
-
 .natBottomBar .natPageCacheBanner {
   margin:0.5em 0 0 0;
 }
@@ -407,6 +415,9 @@ fieldset,
   height:30px;
 }
 
+.natBodyLeft .natWebMenuContents {
+  margin-left:0;
+}
 .natWebMenu .natSearchBox {
   width:280px;
   float:right;
@@ -429,6 +440,9 @@ fieldset,
 
 
 /* topbar */
+.natTopPanel {
+  background-color:#f3f3f3;
+}
 .natTopLeft {
   padding:2em 0;
 }
@@ -572,14 +586,27 @@ fieldset,
 .natSideBar {
   width:20em; 
 }
+
+/* right */
+.natBodyBoth .natSideBar,
 .natBodyRight .natSideBar {
   margin-right:-20em;
 }
 .natBodyBoth .natMiddleContents,
 .natBodyRight .natMiddleContents {
   margin-right:20em;
-  zoom:1; /* IE7 hack */
 }
+
+/* left */
+.natBodyBoth .natSideBar,
+.natBodyLeft .natSideBar {
+  margin-left:-20em;
+}
+.natBodyBoth .natMiddleContents,
+.natBodyLeft .natMiddleContents {
+  margin-left:20em;
+}
+
 .natSideBar h2 {
   text-transform:uppercase;
   margin:2.5em 0 0.5em;

diff --git a/pub/System/JazzyNoteTheme/JazzyNoteStyle.uncompressed.css b/pub/System/JazzyNoteTheme/JazzyNoteStyle.uncompressed.css
@@ -63,6 +63,10 @@ h2 {
   padding-top:1.385em;
 }
 
+.natSiteMap {
+  margin-bottom:2em;
+}
+
 /* fluid layout */
 .natBodyFluid .natMiddle,
 .natBodyFluid .natMain {

diff --git a/pub/System/NatSkin/BaseStyle.uncompressed.css b/pub/System/NatSkin/BaseStyle.uncompressed.css
@@ -101,21 +101,19 @@ blockquote, q {
 }
 
 input, textarea, select, button {
-  box-sizing:border-box;
+          box-sizing:border-box;
+     -moz-box-sizing:border-box;
+  -webkit-box-sizing:border-box; 
 }
 
 /* address box sizing set to `content-box` in IE 8/9/10. */
 input[type="checkbox"],
 input[type="radio"] {
-  box-sizing: border-box; 
   padding: 0; 
 }
 
 /* appearance set to searchfield in Safari 5 and Chrome.  * box-sizing set to border-box in Safari 5 and Chrome.  */
 input[type="search"] {
-          box-sizing: content-box;
-     -moz-box-sizing: content-box;
-  -webkit-box-sizing: content-box; 
   -webkit-appearance: textfield; 
 }
 
@@ -1797,6 +1795,15 @@ a:active.natScrollTop {
 .natBottomActions h4 {
   margin:0px;
 }
+
+.natSiteMap .natSiteMapItem {
+  float:left;
+  width:33%;
+}
+.natSiteMap .natSiteMapItem:nth-child(10) {
+   clear; 
+}
+
 .natBottomBar ul {
   list-style-type:none;
   padding-left:0px;
@@ -1906,7 +1913,6 @@ a:active.natScrollTop {
 .natBodyLeft .natMain {
   float:right;
 }
-.natBodyLeft .natWebMenuContents,
 .natBodyBoth .natMiddleContents,
 .natBodyLeft .natMiddleContents {
   margin-left:16em;

diff --git a/templates/body.customato.nat.tmpl b/templates/body.customato.nat.tmpl
@@ -6,3 +6,5 @@
   </div>
   %CLEAR%
 </div>%TMPL:END%
+
+%TMPL:DEF{"beforebodycontents"}%%TMPL:P{"browsersupport"}%%TMPL:P{"broadcast"}%%TMPL:P{"toppanel"}%%TMPL:END%
diff --git a/templates/body.nat.tmpl b/templates/body.nat.tmpl
@@ -50,18 +50,19 @@
 </div>
 </div>%TMPL:END%
 
+%{ body contents ----------------------------------------------------------- }%
+%TMPL:DEF{"beforebodycontents"}%%TMPL:P{"browsersupport"}%%TMPL:P{"broadcast"}%%TMPL:END%
 
-%{ assembly stage ---------------------------------------------------------- }%
-%TMPL:DEF{"defaultbody"}%<!-- -->
-%TMPL:P{"browsersupport"}%<!-- -->
-%TMPL:P{"broadcast"}%<!-- -->
-<div class="natBodyContents" id="PageTop">
+%TMPL:DEF{"bodycontents"}%<div class="natBodyContents" id="PageTop">
 %TMPL:P{"topbar"}%<!-- -->
 %TMPL:P{context="natskin_menu_on" then="webmenu"}%<!-- -->
 %TMPL:P{"main"}%
 %TMPL:P{"bottombar_container"}%<!-- -->
 %TMPL:P{"scrolltop"}%<!-- -->
 <span id="PageBottom"></span>
-</div>
-%WEBCOMPONENT{"HtmlBottom"}%<!-- -->
-<!-- -->%TMPL:END%
+</div>%TMPL:END%
+
+%TMPL:DEF{"afterbodycontents"}%%WEBCOMPONENT{"HtmlBottom"}%%TMPL:END%
+
+%{ assembly stage ---------------------------------------------------------- }%
+%TMPL:DEF{"defaultbody"}%%TMPL:P{"beforebodycontents"}%%TMPL:P{"bodycontents"}%%TMPL:P{"aftercontents"}%%TMPL:END%
diff --git a/templates/topbar.customato.nat.tmpl b/templates/topbar.customato.nat.tmpl
@@ -2,7 +2,6 @@
 
 %{################################################################################ }%
 %TMPL:DEF{"topbar"}%<!-- -->
-%TMPL:P{"toppanel"}%<!-- -->
 <div class="natTopShadow"></div>
 %TMPL:P{"langswitcher"}%<!-- -->
 <span href="#" class="natNavToggle"></span>
@@ -43,10 +42,12 @@
 %TMPL:P{context="authenticated" then="toppanel::authenticated" else="toppanel::notauthenticated"}%<!-- -->
 </div>%TMPL:END%
 
+%TMPL:DEF{"toppanel::bulletsclass"}%foswikiNoBullets%TMPL:END%
+
 %{################################################################################ }%
 %TMPL:DEF{"toppanel::authenticated"}%<div class="natTopPanelContents">
 <div class="foswikiGrid">
-  <div class="foswikiRow foswikiOrangeBullets">
+  <div class="foswikiRow %TMPL:P{"toppanel::bulletsclass"}%">
     <div class="foswikiCol4">
       <h3 >My <nop>%WIKITOOLNAME%</h3>
       <ul>
@@ -81,9 +82,8 @@
 %{################################################################################ }%
 %TMPL:DEF{"toppanel::notauthenticated"}%<div class="natTopPanelContents">
 <div class="foswikiGrid">
-  <div class="foswikiRow foswikiOrangeBullets">
-    <div class="foswikiCol6">&nbsp;</div>
-    <div class="foswikiCol3">
+  <div class="foswikiRow %TMPL:P{"toppanel::bulletsclass"}%">
+    <div class="foswikiCol6">
       <h3 >%MAKETEXT{"Welcome"}%</h3>
       <ul>
        <li> [[%SYSTEMWEB%.UserRegistration][Register on %WIKITOOLNAME%]] </li>
@@ -92,7 +92,7 @@
        <li> [[%SYSTEMWEB%.ChangePassword][Change Password]] </li>
       </ul>
     </div>
-    <div class="foswikiCol3 border">
+    <div class="foswikiCol6 border">
       %TMPL:P{"toppanel::login"}%
     </div>
   </div>