DE2885 - Use Inline SVGs

Update datepicker and button-form-group for latest SVG implementation
crdschurch · Mar 9, 2017 · e409de7 · e409de7
1 parent db171fd
commit e409de7
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 25 deletions.
diff --git a/assets/stylesheets/components/_button-form-group.scss b/assets/stylesheets/components/_button-form-group.scss
@@ -6,10 +6,6 @@
           background: $cr-teal;
           border-color: $cr-teal;
           color: $cr-white;
-
-          .icon {
-            filter: invert(100%);
-          }
         }
 
         .icon.check-circle {
@@ -19,7 +15,6 @@
         &.active {
           .icon.check-circle {
             display: inline-block;
-            filter: invert(100%);
           }
 
           .icon.circle-thin {
@@ -38,14 +33,7 @@
 
     .custom-input-icon {
       padding: 10px;
-
-      i {
-        filter: invert(55%);
-
-        .dark-theme & {
-          filter: invert(45%);
-        }
-      }
+      color: $cr-gray-light;
     }
 
     .custom-input-field {
@@ -62,9 +50,7 @@
 
     .btn-group-icons {
       padding-right: .5rem;
-
       .icon {
-        filter: invert(55%);
         vertical-align: middle;
       }
     }

diff --git a/assets/stylesheets/components/_datepicker.scss b/assets/stylesheets/components/_datepicker.scss
@@ -70,21 +70,18 @@ datepicker {
   }
 
   .glyphicon {
+    @extend .icon;
+    @extend .icon-1;
+
     &.glyphicon-chevron-left {
-      @extend .icon.chevron-left;
-    }
-    &.glyphicon-chevron-right {
-      @extend .icon.chevron-right;
+      @extend .chevron-left;
     }
-  }
-  datepicker-inner .glyphicon {
-    &.glyphicon-chevron-left,
     &.glyphicon-chevron-right {
-      @extend .icon;
-      @extend .icon-1;
+      @extend .chevron-right;
     }
-  }
 
+    background-size: cover;
+  }
 
   tbody {
     .btn {

diff --git a/assets/stylesheets/components/_forms.scss b/assets/stylesheets/components/_forms.scss
@@ -67,6 +67,10 @@ textarea {
   position: relative;
   display: block;
 
+  .input-group-addon {
+    color: $cr-gray;
+  }
+
   &.input-group-left {
     input.form-control {
       padding-right: 10px;