[Kimchi-devel] [PATCH] [Kimchi] Fixed some issues with SCSS after adding compact() mixin to Wok

[sguimaraes943 at gmail.com]

From: Samuel Guimarães <sguimaraes943 at gmail.com>

After compact() function was added to Wok, some CSS pseudo-elements were mistaken by Sass functions, generating a wrong output with invalid code such as ":nth-child(even, even)" in _edit-guests.scss.

Signed-off-by: Samuel Guimarães <sguimaraes943 at gmail.com>
---
 ui/css/kimchi.css                    | 38 ++++++++++++++++++------------------
 ui/css/src/kimchi.scss               |  2 ++
 ui/css/src/modules/_edit-guests.scss | 25 +++++++++++++++---------
 3 files changed, 37 insertions(+), 28 deletions(-)

diff --git a/ui/css/kimchi.css b/ui/css/kimchi.css
index 27f7787..5afa55d 100644
--- a/ui/css/kimchi.css
+++ b/ui/css/kimchi.css
@@ -1041,12 +1041,6 @@ body.wok-gallery {
   overflow: hidden;
 }
 
-#guest-edit-window form .header .cell.column-network .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
-#guest-edit-window form .task .cell.column-network .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
-#guest-edit-window form .body .cell.column-network .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
-  width: 180px;
-}
-
 #guest-edit-window form .header .cell.column-type,
 #guest-edit-window form .task .cell.column-type,
 #guest-edit-window form .body .cell.column-type {
@@ -1155,16 +1149,6 @@ body.wok-gallery {
   border-top: 0;
 }
 
-#guest-edit-window form .body .item:nth-child(even),
-#guest-edit-window form .task .item:nth-child(even) {
-  background-color: #fcfcfc;
-}
-
-#guest-edit-window form .body .item:nth-child(odd),
-#guest-edit-window form .task .item:nth-child(odd) {
-  background-color: #fff;
-}
-
 #guest-edit-window form .body .item > span,
 #guest-edit-window form .task .item > span {
   padding: 6px 2px;
@@ -1195,6 +1179,22 @@ body.wok-gallery {
   width: 100%;
 }
 
+#guest-edit-window form .body .item:nth-child(even),
+#guest-edit-window form .task .item:nth-child(even) {
+  background-color: #fcfcfc;
+}
+
+#guest-edit-window form .body .item:nth-child(odd),
+#guest-edit-window form .task .item:nth-child(odd) {
+  background-color: #fff;
+}
+
+#guest-edit-window form .header .cell.column-network .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
+#guest-edit-window form .task .cell.column-network .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
+#guest-edit-window form .body .cell.column-network .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
+  width: 180px;
+}
+
 .guest-edit-snapshot .hide,
 .guest-edit-interface .hide {
   display: none !important;
@@ -2397,9 +2397,9 @@ body.wok-gallery {
   border: 1px solid #ccc;
   border: 1px solid #ccc;
   border-radius: 3px;
-  -webkit-box-shadow: compact(0 6px 12px rgba(0, 0, 0, 0.175));
-  -moz-box-shadow: compact(0 6px 12px rgba(0, 0, 0, 0.175));
-  box-shadow: compact(0 6px 12px rgba(0, 0, 0, 0.175));
+  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+  -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
   background-clip: padding-box;
 }
 
diff --git a/ui/css/src/kimchi.scss b/ui/css/src/kimchi.scss
index cdb0222..89904e0 100644
--- a/ui/css/src/kimchi.scss
+++ b/ui/css/src/kimchi.scss
@@ -18,6 +18,8 @@
 
 // Core variables
 @import "../../../../../../../ui/css/src/modules/wok-variables";
+// Core functions
+ at import "../../../../../../../ui/css/src/modules/compact";
 // Compass Mixins
 @import "../../../../../../../ui/css/src/vendor/compass-mixins/lib/compass";
 // Bootstrap Mixins
diff --git a/ui/css/src/modules/_edit-guests.scss b/ui/css/src/modules/_edit-guests.scss
index 2b29631..6196ed9 100644
--- a/ui/css/src/modules/_edit-guests.scss
+++ b/ui/css/src/modules/_edit-guests.scss
@@ -88,9 +88,6 @@
                     text-overflow: ellipsis;
                     overflow: hidden;
                 }
-                .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
-                    width: 180px;
-                }
             }
             .cell.column-type {
                 width: 11.35%;
@@ -161,12 +158,6 @@
                 &:first-child {
                     border-top: 0;
                 }
-                &:nth-child(even) {
-                    background-color: $table-bg-accent;
-                }
-                &:nth-child(odd) {
-                    background-color: $table-bg;
-                }
                 > span {
                     padding: $table-cell-padding;
                     display: inline-block;
@@ -193,6 +184,22 @@
     }
 }
 
+#guest-edit-window form .body .item:nth-child(even),
+#guest-edit-window form .task .item:nth-child(even) {
+    background-color: $table-bg-accent;
+}
+
+#guest-edit-window form .body .item:nth-child(odd),
+#guest-edit-window form .task .item:nth-child(odd) {
+    background-color: $table-bg;
+}
+
+#guest-edit-window form .header .cell.column-network .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
+#guest-edit-window form .task .cell.column-network .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
+#guest-edit-window form .body .cell.column-network .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
+  width: 180px;
+}
+
 .guest-edit-snapshot .hide,
 .guest-edit-interface .hide {
     display: none !important;
-- 
1.9.3