]> git.immae.eu Git - github/fretlink/time-picker.git/commitdiff
Merge pull request #72 from marekpiechut/picker-step
author偏右 <afc163@gmail.com>
Sun, 22 Oct 2017 08:53:32 +0000 (16:53 +0800)
committerGitHub <noreply@github.com>
Sun, 22 Oct 2017 08:53:32 +0000 (16:53 +0800)
Add hourStep, minuteStep and secondStep props to control intervals in picker

assets/index/Picker.less
assets/index/Select.less
examples/disabled.js

index 76bf834acd5633d966d8971d6de80aaeb16d286f..610c2b0a45bc9231ac4c8d6eecf971579a7e6131 100644 (file)
     background-color: #fff;
     background-image: none;
     border: 1px solid #d9d9d9;
-    border-radius: 6px;
+    border-radius: 4px;
     transition: border .2s cubic-bezier(0.645, 0.045, 0.355, 1), background .2s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow .2s cubic-bezier(0.645, 0.045, 0.355, 1);
+    &[disabled] {
+      color: #ccc;
+      background: #f7f7f7;
+      cursor: not-allowed;
+    }
   }
 }
index ecef8a85fd8e2538a4cde820141775a08276e3d4..86c73c1094a570dbcd055219c0dc344b112e78c2 100644 (file)
   }
 
   li&-option-selected {
-    background: #edfaff;
-    color: #2db7f5;
+    background: #f7f7f7;
+    font-weight: bold;
   }
 
   li&-option-disabled {
-    color: #bfbfbf;
+    color: #ccc;
     &:hover {
       background: transparent;
       cursor: not-allowed;
index 9d740021aab0bd56bc888a4ed485934f965133df..a38ce160611df57c35098b357dfcac13443ea7c8 100644 (file)
@@ -48,14 +48,22 @@ function disabledSeconds(h, m) {
 }
 
 ReactDom.render(
-  <TimePicker
-    showSecond={showSecond}
-    defaultValue={now}
-    className="xxx"
-    onChange={onChange}
-    disabledHours={disabledHours}
-    disabledMinutes={disabledMinutes}
-    disabledSeconds={disabledSeconds}
-  />,
-  document.getElementById('__react-content')
-);
+  <div>
+    <h3>Disabled picker</h3>
+    <TimePicker
+      defaultValue={now}
+      disabled
+      onChange={onChange}
+    />
+    <h3>Disabled options</h3>
+    <TimePicker
+      showSecond={showSecond}
+      defaultValue={now}
+      className="xxx"
+      onChange={onChange}
+      disabledHours={disabledHours}
+      disabledMinutes={disabledMinutes}
+      disabledSeconds={disabledSeconds}
+    />
+  </div>
+, document.getElementById('__react-content'));