diff options
author | afc163 <afc163@gmail.com> | 2015-12-08 16:43:06 +0800 |
---|---|---|
committer | afc163 <afc163@gmail.com> | 2015-12-08 16:43:06 +0800 |
commit | 5eeeb3ae2934caa65bcdea71d372f72dea7944c0 (patch) | |
tree | 6fcd32bc916bf25e6aca4ad571576b419dd78580 /examples/common.css | |
parent | b4ff5eb649faa3e6032c610e54d9bfdc77999886 (diff) | |
download | time-picker-5eeeb3ae2934caa65bcdea71d372f72dea7944c0.tar.gz time-picker-5eeeb3ae2934caa65bcdea71d372f72dea7944c0.tar.zst time-picker-5eeeb3ae2934caa65bcdea71d372f72dea7944c0.zip |
Updates
Diffstat (limited to 'examples/common.css')
-rw-r--r-- | examples/common.css | 142 |
1 files changed, 142 insertions, 0 deletions
diff --git a/examples/common.css b/examples/common.css new file mode 100644 index 0000000..0209823 --- /dev/null +++ b/examples/common.css | |||
@@ -0,0 +1,142 @@ | |||
1 | .rc-time-picker { | ||
2 | display: inline-block; | ||
3 | box-sizing: border-box; | ||
4 | } | ||
5 | .rc-time-picker * { | ||
6 | box-sizing: border-box; | ||
7 | } | ||
8 | .rc-time-picker-input { | ||
9 | width: 100%; | ||
10 | position: relative; | ||
11 | display: inline-block; | ||
12 | padding: 4px 7px; | ||
13 | height: 28px; | ||
14 | cursor: text; | ||
15 | font-size: 12px; | ||
16 | line-height: 1.5; | ||
17 | color: #666; | ||
18 | background-color: #fff; | ||
19 | background-image: none; | ||
20 | border: 1px solid #d9d9d9; | ||
21 | border-radius: 6px; | ||
22 | -webkit-transition: border 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); | ||
23 | transition: border 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); | ||
24 | } | ||
25 | .rc-time-picker-panel { | ||
26 | z-index: 1070; | ||
27 | width: 170px; | ||
28 | position: absolute; | ||
29 | box-sizing: border-box; | ||
30 | } | ||
31 | .rc-time-picker-panel * { | ||
32 | box-sizing: border-box; | ||
33 | } | ||
34 | .rc-time-picker-panel-inner { | ||
35 | display: inline-block; | ||
36 | position: relative; | ||
37 | outline: none; | ||
38 | list-style: none; | ||
39 | font-size: 12px; | ||
40 | text-align: left; | ||
41 | background-color: #fff; | ||
42 | border-radius: 3px; | ||
43 | box-shadow: 0 1px 5px #ccc; | ||
44 | background-clip: padding-box; | ||
45 | border: 1px solid #ccc; | ||
46 | line-height: 1.5; | ||
47 | } | ||
48 | .rc-time-picker-panel-input { | ||
49 | margin: 0; | ||
50 | padding: 0; | ||
51 | width: 100%; | ||
52 | cursor: auto; | ||
53 | line-height: 1.5; | ||
54 | outline: 0; | ||
55 | border: 1px solid transparent; | ||
56 | } | ||
57 | .rc-time-picker-panel-input-wrap { | ||
58 | box-sizing: border-box; | ||
59 | position: relative; | ||
60 | padding: 6px; | ||
61 | border-bottom: 1px solid #e9e9e9; | ||
62 | } | ||
63 | .rc-time-picker-panel-input-invalid { | ||
64 | border-color: red; | ||
65 | } | ||
66 | .rc-time-picker-panel-clear-btn { | ||
67 | position: absolute; | ||
68 | right: 6px; | ||
69 | cursor: pointer; | ||
70 | overflow: hidden; | ||
71 | width: 20px; | ||
72 | height: 20px; | ||
73 | text-align: center; | ||
74 | line-height: 20px; | ||
75 | top: 6px; | ||
76 | margin: 0; | ||
77 | } | ||
78 | .rc-time-picker-panel-clear-btn:after { | ||
79 | content: "x"; | ||
80 | font-size: 12px; | ||
81 | color: #aaa; | ||
82 | display: inline-block; | ||
83 | line-height: 1; | ||
84 | width: 20px; | ||
85 | -webkit-transition: color 0.3s ease; | ||
86 | transition: color 0.3s ease; | ||
87 | } | ||
88 | .rc-time-picker-panel-clear-btn:hover:after { | ||
89 | color: #666; | ||
90 | } | ||
91 | .rc-time-picker-panel-select { | ||
92 | float: left; | ||
93 | font-size: 12px; | ||
94 | border: 1px solid #e9e9e9; | ||
95 | border-width: 0 1px; | ||
96 | margin-left: -1px; | ||
97 | box-sizing: border-box; | ||
98 | width: 56px; | ||
99 | overflow: hidden; | ||
100 | } | ||
101 | .rc-time-picker-panel-select:hover { | ||
102 | overflow-y: auto; | ||
103 | } | ||
104 | .rc-time-picker-panel-select:first-child { | ||
105 | border-left: 0; | ||
106 | margin-left: 0; | ||
107 | } | ||
108 | .rc-time-picker-panel-select:last-child { | ||
109 | border-right: 0; | ||
110 | } | ||
111 | .rc-time-picker-panel-select ul { | ||
112 | list-style: none; | ||
113 | box-sizing: border-box; | ||
114 | margin: 0; | ||
115 | padding: 0; | ||
116 | width: 100%; | ||
117 | max-height: 144px; | ||
118 | } | ||
119 | .rc-time-picker-panel-select li { | ||
120 | list-style: none; | ||
121 | box-sizing: border-box; | ||
122 | margin: 0; | ||
123 | padding: 0 0 0 16px; | ||
124 | width: 100%; | ||
125 | height: 24px; | ||
126 | line-height: 24px; | ||
127 | text-align: left; | ||
128 | cursor: pointer; | ||
129 | -webkit-user-select: none; | ||
130 | -moz-user-select: none; | ||
131 | -ms-user-select: none; | ||
132 | user-select: none; | ||
133 | } | ||
134 | .rc-time-picker-panel-select li:hover { | ||
135 | background: #edfaff; | ||
136 | } | ||
137 | .rc-time-picker-panel-select-option-selected { | ||
138 | background: #edfaff; | ||
139 | color: #2db7f5; | ||
140 | } | ||
141 | |||
142 | /*# sourceMappingURL=common.css.map*/ \ No newline at end of file | ||