clear button added

Dogfalo · Jan 7, 2015 · c2cd30f · c2cd30f
1 parent db0629d
commit c2cd30f
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 15 deletions.
diff --git a/bin/materialize.css b/bin/materialize.css
@@ -7178,7 +7178,10 @@ ul.side-nav.fixed {
  * The footer containing the "today", "clear", and "close" buttons.
  */
 .picker__footer {
-  text-align: center; }
+  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: space-between; }
 
 .picker__button--today, .picker__button--clear, .picker__button--close {
   border: 1px solid #ffffff;
@@ -7313,6 +7316,7 @@ ul.side-nav.fixed {
 
 .picker__close, .picker__today {
   font-size: 1.1rem;
+  padding: 0 1rem;
   color: #26a69a; }
 
 .picker__nav--prev:before, .picker__nav--next:before {

diff --git a/bin/materialize.js b/bin/materialize.js
diff --git a/css/ghpages-materialize.css b/css/ghpages-materialize.css
@@ -7178,7 +7178,10 @@ ul.side-nav.fixed {
  * The footer containing the "today", "clear", and "close" buttons.
  */
 .picker__footer {
-  text-align: center; }
+  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: space-between; }
 
 .picker__button--today, .picker__button--clear, .picker__button--close {
   border: 1px solid #ffffff;
@@ -7313,6 +7316,7 @@ ul.side-nav.fixed {
 
 .picker__close, .picker__today {
   font-size: 1.1rem;
+  padding: 0 1rem;
   color: #26a69a; }
 
 .picker__nav--prev:before, .picker__nav--next:before {

diff --git a/js/date_picker/picker.date.js b/js/date_picker/picker.date.js
@@ -1318,10 +1318,10 @@ return _.node(
             'type=button data-pick=' + nowObject.pick +
             ( isOpen && !calendar.disabled(nowObject) ? '' : ' disabled' ) + ' ' +
             _.ariaAttr({ controls: calendar.$node[0].id }) ) +
-        // _.node( 'button', settings.clear, settings.klass.buttonClear,
-        //     'type=button data-clear=1' +
-        //     ( isOpen ? '' : ' disabled' ) + ' ' +
-        //     _.ariaAttr({ controls: calendar.$node[0].id }) ) +
+        _.node( 'button', settings.clear, "btn-flat picker__clear",
+            'type=button data-clear=1' +
+            ( isOpen ? '' : ' disabled' ) + ' ' +
+            _.ariaAttr({ controls: calendar.$node[0].id }) ) +
         _.node('button', settings.close, "btn-flat picker__close",
             'type=button data-close=true ' +
             ( isOpen ? '' : ' disabled' ) + ' ' +

diff --git a/sass/components/date_picker/_default.date.scss b/sass/components/date_picker/_default.date.scss
@@ -30,10 +30,10 @@
  */
 .picker__select--month,
 .picker__select--year {
-  
+
 
 //  border: 1px solid #b7b7b7;
-  
+
   height: 2em;
   padding: .5em;
   margin-left: .25em;
@@ -163,7 +163,7 @@
   padding: .75rem 0;
   font-weight: 400;
   border: 1px solid transparent;
-  
+
 }
 
 //.picker__day--today:before {
@@ -213,12 +213,12 @@
 .picker__day--selected:hover,
 .picker--focused .picker__day--selected {
 
-  
+
 //  Circle background
    border-radius: 50%;
   @include transform(scale(.75));
-  
-  
+
+
   background: #0089ec;
   color: #ffffff;
 }
@@ -239,6 +239,9 @@
  */
 .picker__footer {
   text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
 }
 .picker__button--today,
 .picker__button--clear,
@@ -341,7 +344,7 @@
 .picker__day-display {
 
   font-size: 4.5rem;
-  font-weight: 400; 
+  font-weight: 400;
 }
 .picker__year-display {
   font-size: 1.8rem;
@@ -353,7 +356,7 @@
 }
 .picker__calendar-container {
   padding: 0 1rem;
-  
+
   thead {
     border: none;
   }
@@ -397,8 +400,10 @@
   padding: 5px 10px;
 }
 
+// Materialize modified
 .picker__close, .picker__today {
   font-size: 1.1rem;
+  padding: 0 1rem;
   color: color("teal", "lighten-1");
 }