[deltacloud-devel] [PATCH aggregator 2/4] Add the "base" Compass partial

[Tomas Sedovic]

From: Tomas Sedovic

This adds a stylesheet whose definitions will be available across all our
other stylesheets.

It contains one mixin that provides cross-browser rounded corners.
---
 src/app/stylesheets/_base.scss      |    5 +++++
 src/app/stylesheets/components.scss |   29 ++++++++++-------------------
 src/app/stylesheets/dcloud.scss     |   10 +++++-----
 src/app/stylesheets/layout.scss     |    1 +
 4 files changed, 21 insertions(+), 24 deletions(-)
 create mode 100644 src/app/stylesheets/_base.scss

diff --git a/src/app/stylesheets/_base.scss b/src/app/stylesheets/_base.scss
new file mode 100644
index 0000000..6c86b0f
--- /dev/null
+++ b/src/app/stylesheets/_base.scss
@@ -0,0 +1,5 @@
+@mixin border-radius($radius) {
+  border-radius: $radius;
+  -moz-border-radius: $radius;
+  -webkit-border-radius: $radius;
+}
diff --git a/src/app/stylesheets/components.scss b/src/app/stylesheets/components.scss
index ba8cbfd..4f3ca4c 100644
--- a/src/app/stylesheets/components.scss
+++ b/src/app/stylesheets/components.scss
@@ -1,3 +1,4 @@
+@import "base";
 /* header style */

.header_logo {
@@ -30,16 +31,12 @@ ul.nav {
     }
     &.selected {
       background: #cbd6db !important;
-      border-radius: 16px;
-      -moz-border-radius: 16px;
-      -webkit-border-radius: 16px;
+      @include border-radius(16px);
       -moz-box-shadow: 0 1px 1px #efefef;
     }
     &:hover {
       background: #dedede;
-      border-radius: 16px;
-      -moz-border-radius: 16px;
-      -webkit-border-radius: 16px;
+      @include border-radius(16px);
     }
   }
 }
@@ -112,8 +109,7 @@ ul.nav {
   padding: 10px;
   margin: 10px 0px 10px 5px;
   border: 1px solid black;
-  -moz-border-radius: 5px;
-  -webkit-border-radius: 5px;
+  @include border-radius(5px);
   p {
     padding-bottom: 5px;
   }
@@ -147,8 +143,7 @@ ul.nav {
   border: 1px solid #dddddd;
   padding: 15px;
   margin: 5px 15px 15px 0px;
-  -moz-border-radius: 5px;
-  -webkit-border-radius: 5px;
+  @include border-radius(5px);
   -moz-box-shadow: 0 1px 3px #cccccc;
   h2 {
     padding: 0;
@@ -169,8 +164,7 @@ ul.nav {
   border: 1px solid #dddddd;
   padding: 15px;
   margin: 0 15px 15px 0px;
-  -moz-border-radius: 5px;
-  -webkit-border-radius: 5px;
+  @include border-radius(5px);
   -moz-box-shadow: 0 1px 3px #cccccc;
   h2 {
     padding: 0;
@@ -199,8 +193,7 @@ ul.nav {
   border: 1px solid #dddddd;
   padding: 15px;
   margin: 0 15px 15px 0px;
-  -moz-border-radius: 5px;
-  -webkit-border-radius: 5px;
+  @include border-radius(5px);
   -moz-box-shadow: 0 1px 3px #cccccc;
   h2 {
     padding: 0;
@@ -237,9 +230,7 @@ ul.nav {
   border: 1px solid #dddddd;
   padding: 15px;
   margin: 5px 15px 15px 0px;
-  -moz-border-radius: 5px;
-  -webkit-border-radius: 5px;
-  border-radius: 5px;
+  @include border-radius(5px);
   -moz-box-shadow: 0 1px 3px #cccccc;
   h2 {
     padding: 0;
@@ -366,7 +357,7 @@ ul.nav {
       border-bottom: 1px solid #7f7f7f;
       border-left: 1px solid black;
       border-right: 1px solid black;
-      -moz-border-radius: 4px;
+      @include border-radius(4px);
     }
   }
   .description {
@@ -391,7 +382,7 @@ ul.nav {
     overflow: auto;
     background-color: white;
     border: 2px solid #cccccc;
-    -moz-border-radius: 6px;
+    @include border-radius(6px);
   }
   .submit {
     padding-top: 20px;
diff --git a/src/app/stylesheets/dcloud.scss b/src/app/stylesheets/dcloud.scss
index 7636974..3bddd34 100644
--- a/src/app/stylesheets/dcloud.scss
+++ b/src/app/stylesheets/dcloud.scss
@@ -1,3 +1,5 @@
+@import "base";
+
 form {
   border: none;
   margin: 0;
@@ -48,7 +50,7 @@ input, select {
   padding: 9px;
   background: #fff7b2;
   color: #867a5e;
-  -moz-border-radius: 3px;
+  @include border-radius(3px);
 }

#errorExplanation h2 {
@@ -60,8 +62,7 @@ input, select {
 .dcloud_form {
   background: #e8e8e8;
   border: solid 8px #f5f5f5;
-  -moz-border-radius: 10px;
-  -webkit-border-radius: 10px;
+  @include border-radius(10px);
   margin-top: 54px;
   width: 550px;
   margin-left: auto;
@@ -275,8 +276,7 @@ a.button_link {
   display: block;
   background: #666666;
   color: white;
-  -moz-border-radius: 5px;
-  -webkit-border-radius: 5px;
+  @include border-radius(5px);
 }

#dashboard-tabs, #provider-tabs, #pool-tabs {
diff --git a/src/app/stylesheets/layout.scss b/src/app/stylesheets/layout.scss
index 9e00da6..b871a26 100644
--- a/src/app/stylesheets/layout.scss
+++ b/src/app/stylesheets/layout.scss
@@ -1,4 +1,5 @@
 @charset "UTF-8";
+@import "base";

html {
   font-size: small;