[Kimchi-devel] [PATCH] [Wok] Minor CSS issues

sguimaraes943 at gmail.com sguimaraes943 at gmail.com
Wed Dec 16 21:35:44 UTC 2015


From: samhenri <samuel.guimaraes at eldorado.org.br>

Fixed even and odd styles with wok-datagrid widget.
Added color variable for Ginger texts (design spec).
Changed label font-size to 1.143em instead of 16px, added correct font-weight.

Signed-off-by: samhenri <samuel.guimaraes at eldorado.org.br>
---
 ui/css/src/modules/_datagrid.scss      | 21 +++++++++++++++++++--
 ui/css/src/modules/_validation.scss    |  6 ++++++
 ui/css/src/modules/_wok-forms.scss     | 12 ++++++++++++
 ui/css/src/modules/_wok-variables.scss |  1 +
 ui/css/src/wok.scss                    |  6 ------
 5 files changed, 38 insertions(+), 8 deletions(-)

diff --git a/ui/css/src/modules/_datagrid.scss b/ui/css/src/modules/_datagrid.scss
index 389b8b6..3232539 100644
--- a/ui/css/src/modules/_datagrid.scss
+++ b/ui/css/src/modules/_datagrid.scss
@@ -25,6 +25,17 @@
 
     .wok-datagrid {
         background: $table-bg;
+        padding: 0;
+        margin: 0;
+        list-style: none;
+
+        .wok-datagrid-header,
+        .wok-datagrid-body {
+            list-style: none;
+            padding: 0;
+            margin: 0;
+        }
+
         .wok-datagrid-header,
         .wok-datagrid-body > .wok-datagrid-row {
             display: block;
@@ -61,13 +72,19 @@
         .wok-datagrid-hybrid > .wok-datagrid-body > .wok-datagrid-row:first-child {
             border-color: $table-first-row-border-color;
         }
-        .wok-datagrid-row.odd {
+        .wok-datagrid-row.odd,
+        .wok-datagrid-row:nth-child(odd)  {
             background-color: $table-bg-accent;
         }
-        .wok-datagrid-row.even {
+        .wok-datagrid-row.even,
+        .wok-datagrid-row:nth-child(even) {
             background-color: $table-bg;
         }
         .wok-datagrid-body.wok-datagrid-row {
             border-top: 1px solid $table-bg-accent;
         }
+        .wok-datagrid-body.no-border > .wok-datagrid-row {
+            background-color: $table-bg !important;
+            border: 0 !important;
+        }
     }
diff --git a/ui/css/src/modules/_validation.scss b/ui/css/src/modules/_validation.scss
index 4410c4a..687b8a2 100644
--- a/ui/css/src/modules/_validation.scss
+++ b/ui/css/src/modules/_validation.scss
@@ -25,4 +25,10 @@
 }
 .has-error {
   @include form-control-validation(darken($state-danger-border,10%), darken($state-danger-border,10%), $state-danger-bg);
+}
+
+// Override forms
+.form-control.invalid-field {
+    border-color: darken($state-danger-border,10%);
+    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(217, 83, 79, 0.6);
 }
\ No newline at end of file
diff --git a/ui/css/src/modules/_wok-forms.scss b/ui/css/src/modules/_wok-forms.scss
index 3f6f99a..d5d2dc3 100644
--- a/ui/css/src/modules/_wok-forms.scss
+++ b/ui/css/src/modules/_wok-forms.scss
@@ -16,6 +16,18 @@
 // limitations under the License.
 //
 
+// Overriding Bootstrap styles
+
+.form-group {
+    font-size: 1em;
+}
+
+label {
+    font-size: 1.143em;
+    font-weight: 400;
+    font-family: $font-family-base;
+}
+
 // Custom check-boxes and radios
 input[type=checkbox].wok-checkbox,
 input[type=radio].wok-radio {
diff --git a/ui/css/src/modules/_wok-variables.scss b/ui/css/src/modules/_wok-variables.scss
index 52f4b3f..c7880c4 100644
--- a/ui/css/src/modules/_wok-variables.scss
+++ b/ui/css/src/modules/_wok-variables.scss
@@ -33,6 +33,7 @@ $gray-base:              #000 !default;
 $gray-darker:            #222 !default;
 $gray-dark:               $gray-darker !default;
 $gray:                      #444 !default;
+$gray-med:              #777 !default;
 $gray-light:               #999 !default;
 $gray-lighter:            #fff !default;
 
diff --git a/ui/css/src/wok.scss b/ui/css/src/wok.scss
index 30cea78..8d87168 100755
--- a/ui/css/src/wok.scss
+++ b/ui/css/src/wok.scss
@@ -46,12 +46,6 @@
     font-size: 21.5pt;
 }
 
-// Override forms
-.form-control.invalid-field {
-    border-color: $brand-danger;
-    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(217, 83, 79, 0.6);
-}
-
 // Login
 @import "modules/login";
 // Topbar and navigation
-- 
1.9.3




More information about the Kimchi-devel mailing list