[IMP] sass/compass use in website.sass

bzr revid: xmo@openerp.com-20131120124451-25m26kao051x6tam

6 files changed, 47 insertions, 39 deletions

diff --git a/addons/website/static/src/css/common.css b/addons/website/static/src/css/common.css
new file mode 100644
index 00000000000..e69de29bb2d
--- /dev/null
+++ b/addons/website/static/src/css/common.css
diff --git a/addons/website/static/src/css/common.sass b/addons/website/static/src/css/common.sass
new file mode 100644
index 00000000000..86e1f6655ef
--- /dev/null
+++ b/addons/website/static/src/css/common.sass
@@ -0,0 +1,25 @@
+@import "compass/css3"
+@import "compass/css3/user-interface"
+@import "compass/css3/transition"
+
+//smartphones, iPhone, portrait 480x320 phones
+$smart_phone: 320px
+//portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide.*/
+$small-tablet: 481px
+//portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones
+$portrait-tablet: 641px
+//tablet, landscape iPad, lo-res laptops ands desktops
+$tablet: 961px
+//big landscape tablets, laptops, and desktops
+$desktop: 1025px
+
+@mixin editor-font
+    font-size: 14px
+    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace
+    line-height: normal
+
+@mixin selection()
+    ::-moz-selection
+        @content
+    ::selection
+        @content
diff --git a/addons/website/static/src/css/editor.css b/addons/website/static/src/css/editor.css
index 8aada166018..7a71740671b 100644
--- a/addons/website/static/src/css/editor.css
+++ b/addons/website/static/src/css/editor.css
@@ -1,4 +1,3 @@
-@charset "utf-8";
 /* ---- CKEditor Minimal Reset ---- */
 .navbar.navbar-inverse .cke_chrome {
   border: none;
@@ -380,6 +379,10 @@ ul.oe_menu_editor .disclose {
   margin: 0px -24px !important;
 }
 .oe_drop_zone.oe_insert.oe_overlay {
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  -ms-border-radius: 3px;
+  -o-border-radius: 3px;
   border-radius: 3px;
   background: rgba(153, 0, 255, 0.5);
 }
diff --git a/addons/website/static/src/css/editor.sass b/addons/website/static/src/css/editor.sass
index 3896ced8648..ea7bbb1480a 100644
--- a/addons/website/static/src/css/editor.sass
+++ b/addons/website/static/src/css/editor.sass
@@ -1,19 +1,6 @@
 @charset "utf-8"
 
-@import "compass/css3"
-@import "compass/css3/user-interface"
-@import "compass/css3/transition"
-
-//smartphones, iPhone, portrait 480x320 phones
-$smart_phone: 320px
-//portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide.*/
-$small-tablet: 481px
-//portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones
-$portrait-tablet: 641px
-//tablet, landscape iPad, lo-res laptops ands desktops
-$tablet: 961px
-//big landscape tablets, laptops, and desktops
-$desktop: 1025px
+@import "common"
 
 /* ---- CKEditor Minimal Reset ---- */
 
@@ -303,7 +290,7 @@ ul.oe_menu_editor
         position: relative
         margin: 0px -24px !important
     &.oe_overlay
-        border-radius: 3px
+        +border-radius(3px)
         //@include background-image( repeating-linear-gradient(45deg, rgba(255,255,255,.1) ,rgba(255,255,255,.1) 35px, rgba(0,0,0,.1) 35px, rgba(0,0,0,.1) 75px))
         //background-size: 100px 100px
         background: rgba(153, 0, 255,.5)
@@ -507,10 +494,6 @@ $editorbar_height: 30px
 // TODO Fix => might break with themes
 $navbar_height: 51px
 
-@mixin editor-font
-    font-size: 14px
-    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace
-    line-height: normal
 .oe_ace_view_editor
     position: fixed
     top: $navbar_height
diff --git a/addons/website/static/src/css/website.css b/addons/website/static/src/css/website.css
index 41c04e6b702..68e40e9118b 100644
--- a/addons/website/static/src/css/website.css
+++ b/addons/website/static/src/css/website.css
@@ -1,4 +1,3 @@
-@charset "utf-8";
 /*       THIS CSS FILE IS FOR WEBSITE THEMING CUSTOMIZATION ONLY
  *
  * css for editor buttons, openerp widget included in the website and other
@@ -192,6 +191,8 @@ h1.text-muted, h2.text-muted, h3.text-muted {
 
 /* ----- BOOTSTRAP HACK FOR STICKY FOOTER ----- */
 html, body, #wrapwrap {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
   box-sizing: border-box;
   height: 100%;
 }
@@ -290,10 +291,15 @@ ul.nav-stacked > li > a {
 }
 
 [data-publish='off'] {
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
   opacity: 0.5;
 }
 
 /* ---- END of PUBLISH ---- */
+::-moz-selection {
+  background: rgba(150, 150, 220, 0.3);
+}
+
 ::selection {
   background: rgba(150, 150, 220, 0.3);
 }
@@ -428,10 +434,10 @@ ul.nav-stacked > li > a {
 .oe_dark {
   background: #eff8f8;
   background: rgba(100, 200, 200, 0.14);
+  background-image: none !important;
   -webkit-box-shadow: 0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset;
   -moz-box-shadow: 0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset;
   box-shadow: 0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset;
-  background-image: none !important;
 }
 
 .oe_black {
diff --git a/addons/website/static/src/css/website.sass b/addons/website/static/src/css/website.sass
index cd1c99dda27..ec992256d6e 100644
--- a/addons/website/static/src/css/website.sass
+++ b/addons/website/static/src/css/website.sass
@@ -1,5 +1,7 @@
 @charset "utf-8"
 
+@import "common"
+
 /*
  *       THIS CSS FILE IS FOR WEBSITE THEMING CUSTOMIZATION ONLY
  *
@@ -103,14 +105,8 @@
 /* Extra Styles */
 
 img.shadow
-    -webkit-border-radius: 3px
-    -moz-border-radius: 3px
-    -ms-border-radius: 3px
-    -o-border-radius: 3px
-    border-radius: 3px
-    -webkit-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2)
-    -moz-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2)
-    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2)
+    +border-radius(3px)
+    +box-shadow(0px 3px 8px rgba(0, 0, 0, 0.2))
     margin: 0 auto
 
 h1.text-muted, h2.text-muted, h3.text-muted
@@ -124,7 +120,7 @@ h1.text-muted, h2.text-muted, h3.text-muted
 /* ----- BOOTSTRAP HACK FOR STICKY FOOTER ----- */
 
 html,body, #wrapwrap
-    box-sizing: border-box
+    +box-sizing(border-box)
     height: 100%
 
 #wrapwrap
@@ -212,13 +208,11 @@ ul.nav-stacked > li > a
     display: block
 
 [data-publish='off']
-    opacity: 0.5
+    +opacity(0.5)
 
 /* ---- END of PUBLISH ---- */
 
-
-
-::selection
+@include selection
     background: rgba(150, 150, 220, 0.3)
 
 .logo-img
@@ -242,7 +236,6 @@ ul.nav-stacked > li > a
         a
             color: white
 
-
 /* ---- SNIPPETS --- */
 
 .carousel-inner .item
@@ -335,10 +328,8 @@ ul.nav-stacked > li > a
 .oe_dark
     background: #eff8f8
     background: rgba(100, 200, 200, 0.14)
-    -webkit-box-shadow: 0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset
-    -moz-box-shadow: 0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset
-    box-shadow: 0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset
     background-image: none !important
+    +box-shadow(0px 5px 9px -7px rgba(0, 0, 255, 0.5) inset, 0px -3px 9px -7px rgba(0, 0, 255, 0.5) inset)
 .oe_black
     background-color: rgba(0, 0, 0, 0.9)
     background-image: none !important