UNPKG

10.1 kBCSSView Raw
1@font-face {
2 font-family: 'FontAwesome';
3 src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/fonts/fontawesome-webfont.eot');
4 src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/fonts/fontawesome-webfont.eot?#iefix') format('embedded-opentype'), url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/fonts/fontawesome-webfont.woff') format('woff'), url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/fonts/fontawesome-webfont.ttf') format('truetype'), url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/fonts/fontawesome-webfont.svg?#fontawesomeregular') format('svg');
5 font-weight: normal;
6 font-style: normal;
7}
8.rc-menu {
9 outline: none;
10 margin-bottom: 0;
11 padding-left: 0;
12 padding-right: 0;
13 list-style: none;
14 border: 1px solid #d9d9d9;
15 box-shadow: 0 0 4px #d9d9d9;
16 border-radius: 3px;
17 color: #666;
18}
19.rc-menu-rtl {
20 direction: rtl;
21}
22.rc-menu-hidden {
23 display: none;
24}
25.rc-menu-collapse {
26 overflow: hidden;
27 transition: height 0.3s ease-out;
28}
29.rc-menu-item-group-list {
30 margin: 0;
31 padding: 0;
32}
33.rc-menu-item-group-title {
34 color: #999;
35 line-height: 1.5;
36 padding: 8px 10px;
37 border-bottom: 1px solid #dedede;
38}
39.rc-menu-item-active,
40.rc-menu-submenu-active > .rc-menu-submenu-title {
41 background-color: #eaf8fe;
42}
43.rc-menu-item-selected {
44 background-color: #eaf8fe;
45 transform: translateZ(0);
46}
47.rc-menu-submenu-selected {
48 background-color: #eaf8fe;
49}
50.rc-menu > li.rc-menu-submenu {
51 padding: 0;
52}
53.rc-menu-horizontal.rc-menu-sub,
54.rc-menu-vertical.rc-menu-sub,
55.rc-menu-vertical-left.rc-menu-sub,
56.rc-menu-vertical-right.rc-menu-sub {
57 min-width: 160px;
58 margin-top: 0;
59}
60.rc-menu-item,
61.rc-menu-submenu-title {
62 margin: 0;
63 position: relative;
64 display: block;
65 padding: 7px 7px 7px 16px;
66 white-space: nowrap;
67}
68.rc-menu-rtl .rc-menu-item,
69.rc-menu-rtl .rc-menu-submenu-title {
70 padding: 7px 16px 7px 7px;
71}
72.rc-menu-item.rc-menu-item-disabled,
73.rc-menu-submenu-title.rc-menu-item-disabled,
74.rc-menu-item.rc-menu-submenu-disabled,
75.rc-menu-submenu-title.rc-menu-submenu-disabled {
76 color: #777 !important;
77}
78.rc-menu > .rc-menu-item-divider {
79 height: 1px;
80 margin: 1px 0;
81 overflow: hidden;
82 padding: 0;
83 line-height: 0;
84 background-color: #e5e5e5;
85}
86.rc-menu-submenu-popup {
87 position: absolute;
88}
89.rc-menu-submenu-popup .submenu-title-wrapper {
90 padding-right: 20px;
91}
92.rc-menu-submenu-rtl.rc-menu-submenu-popup .submenu-title-wrapper,
93.rc-menu-submenu-rtl .rc-menu-submenu-popup .submenu-title-wrapper {
94 padding-right: 0;
95 padding-left: 20px;
96}
97.rc-menu-submenu > .rc-menu {
98 background-color: #fff;
99}
100.rc-menu .rc-menu-submenu-title .anticon,
101.rc-menu .rc-menu-item .anticon {
102 width: 14px;
103 height: 14px;
104 margin-right: 8px;
105 top: -1px;
106}
107.rc-menu-rtl .rc-menu .rc-menu-submenu-title .anticon,
108.rc-menu-rtl .rc-menu .rc-menu-item .anticon {
109 margin-right: 0;
110 margin-left: 8px;
111}
112.rc-menu-horizontal {
113 background-color: #f3f5f7;
114 border: none;
115 border-bottom: 1px solid #d9d9d9;
116 box-shadow: none;
117 white-space: nowrap;
118 overflow: hidden;
119}
120.rc-menu-horizontal > .rc-menu-item,
121.rc-menu-horizontal > .rc-menu-submenu > .rc-menu-submenu-title {
122 padding: 15px 20px;
123}
124.rc-menu-horizontal > .rc-menu-submenu,
125.rc-menu-horizontal > .rc-menu-item {
126 border-bottom: 2px solid transparent;
127 display: inline-block;
128 vertical-align: bottom;
129}
130.rc-menu-horizontal > .rc-menu-submenu-active,
131.rc-menu-horizontal > .rc-menu-item-active {
132 border-bottom: 2px solid #2db7f5;
133 background-color: #f3f5f7;
134 color: #2baee9;
135}
136.rc-menu-horizontal:after {
137 content: '\20';
138 display: block;
139 height: 0;
140 clear: both;
141}
142.rc-menu-vertical,
143.rc-menu-vertical-left,
144.rc-menu-vertical-right,
145.rc-menu-inline {
146 padding: 12px 0;
147}
148.rc-menu-vertical > .rc-menu-item,
149.rc-menu-vertical-left > .rc-menu-item,
150.rc-menu-vertical-right > .rc-menu-item,
151.rc-menu-inline > .rc-menu-item,
152.rc-menu-vertical > .rc-menu-submenu > .rc-menu-submenu-title,
153.rc-menu-vertical-left > .rc-menu-submenu > .rc-menu-submenu-title,
154.rc-menu-vertical-right > .rc-menu-submenu > .rc-menu-submenu-title,
155.rc-menu-inline > .rc-menu-submenu > .rc-menu-submenu-title {
156 padding: 12px 8px 12px 24px;
157}
158.rc-menu-rtl.rc-menu-vertical > .rc-menu-item,
159.rc-menu-rtl.rc-menu-vertical-left > .rc-menu-item,
160.rc-menu-rtl.rc-menu-vertical-right > .rc-menu-item,
161.rc-menu-rtl.rc-menu-inline > .rc-menu-item,
162.rc-menu-rtl.rc-menu-vertical > .rc-menu-submenu > .rc-menu-submenu-title,
163.rc-menu-rtl.rc-menu-vertical-left > .rc-menu-submenu > .rc-menu-submenu-title,
164.rc-menu-rtl.rc-menu-vertical-right > .rc-menu-submenu > .rc-menu-submenu-title,
165.rc-menu-rtl.rc-menu-inline > .rc-menu-submenu > .rc-menu-submenu-title {
166 padding: 12px 24px 12px 8px;
167}
168.rc-menu-vertical .rc-menu-submenu-arrow,
169.rc-menu-vertical-left .rc-menu-submenu-arrow,
170.rc-menu-vertical-right .rc-menu-submenu-arrow,
171.rc-menu-inline .rc-menu-submenu-arrow {
172 display: inline-block;
173 font: normal normal normal 14px/1 FontAwesome;
174 font-size: inherit;
175 vertical-align: baseline;
176 text-align: center;
177 text-transform: none;
178 text-rendering: auto;
179 position: absolute;
180 right: 16px;
181 line-height: 1.5em;
182}
183.rc-menu-vertical .rc-menu-submenu-arrow:before,
184.rc-menu-vertical-left .rc-menu-submenu-arrow:before,
185.rc-menu-vertical-right .rc-menu-submenu-arrow:before,
186.rc-menu-inline .rc-menu-submenu-arrow:before {
187 content: '\f0da';
188}
189.rc-menu-rtl.rc-menu-vertical .rc-menu-submenu-arrow:before,
190.rc-menu-rtl.rc-menu-vertical-left .rc-menu-submenu-arrow:before,
191.rc-menu-rtl.rc-menu-vertical-right .rc-menu-submenu-arrow:before,
192.rc-menu-rtl.rc-menu-inline .rc-menu-submenu-arrow:before,
193.rc-menu-submenu-rtl .rc-menu-vertical .rc-menu-submenu-arrow:before,
194.rc-menu-submenu-rtl .rc-menu-vertical-left .rc-menu-submenu-arrow:before,
195.rc-menu-submenu-rtl .rc-menu-vertical-right .rc-menu-submenu-arrow:before,
196.rc-menu-submenu-rtl .rc-menu-inline .rc-menu-submenu-arrow:before {
197 content: '\f0d9';
198}
199.rc-menu-rtl.rc-menu-vertical .rc-menu-submenu-arrow,
200.rc-menu-rtl.rc-menu-vertical-left .rc-menu-submenu-arrow,
201.rc-menu-rtl.rc-menu-vertical-right .rc-menu-submenu-arrow,
202.rc-menu-rtl.rc-menu-inline .rc-menu-submenu-arrow,
203.rc-menu-submenu-rtl .rc-menu-vertical .rc-menu-submenu-arrow,
204.rc-menu-submenu-rtl .rc-menu-vertical-left .rc-menu-submenu-arrow,
205.rc-menu-submenu-rtl .rc-menu-vertical-right .rc-menu-submenu-arrow,
206.rc-menu-submenu-rtl .rc-menu-inline .rc-menu-submenu-arrow {
207 right: auto;
208 left: 16px;
209}
210.rc-menu-inline .rc-menu-submenu-arrow {
211 transform: rotate(90deg);
212 transition: transform 0.3s;
213}
214.rc-menu-inline .rc-menu-submenu-open > .rc-menu-submenu-title .rc-menu-submenu-arrow {
215 transform: rotate(-90deg);
216}
217.rc-menu-vertical.rc-menu-sub,
218.rc-menu-vertical-left.rc-menu-sub,
219.rc-menu-vertical-right.rc-menu-sub {
220 padding: 0;
221}
222.rc-menu-submenu-rtl .rc-menu-vertical.rc-menu-sub,
223.rc-menu-submenu-rtl .rc-menu-vertical-left.rc-menu-sub,
224.rc-menu-submenu-rtl .rc-menu-vertical-right.rc-menu-sub {
225 direction: rtl;
226}
227.rc-menu-sub.rc-menu-inline {
228 padding: 0;
229 border: none;
230 border-radius: 0;
231 box-shadow: none;
232}
233.rc-menu-sub.rc-menu-inline > .rc-menu-item,
234.rc-menu-sub.rc-menu-inline > .rc-menu-submenu > .rc-menu-submenu-title {
235 padding-top: 8px;
236 padding-bottom: 8px;
237 padding-right: 0;
238}
239.rc-menu-rtl .rc-menu-sub.rc-menu-inline > .rc-menu-item,
240.rc-menu-rtl .rc-menu-sub.rc-menu-inline > .rc-menu-submenu > .rc-menu-submenu-title {
241 padding-left: 0;
242}
243.rc-menu-open-slide-up-enter,
244.rc-menu-open-slide-up-appear {
245 animation-duration: 0.3s;
246 animation-fill-mode: both;
247 transform-origin: 0 0;
248 opacity: 0;
249 animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
250 animation-play-state: paused;
251}
252.rc-menu-open-slide-up-leave {
253 animation-duration: 0.3s;
254 animation-fill-mode: both;
255 transform-origin: 0 0;
256 opacity: 1;
257 animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);
258 animation-play-state: paused;
259}
260.rc-menu-open-slide-up-enter.rc-menu-open-slide-up-enter-active,
261.rc-menu-open-slide-up-appear.rc-menu-open-slide-up-appear-active {
262 animation-name: rcMenuOpenSlideUpIn;
263 animation-play-state: running;
264}
265.rc-menu-open-slide-up-leave.rc-menu-open-slide-up-leave-active {
266 animation-name: rcMenuOpenSlideUpOut;
267 animation-play-state: running;
268}
269@keyframes rcMenuOpenSlideUpIn {
270 0% {
271 opacity: 0;
272 transform-origin: 0% 0%;
273 transform: scaleY(0);
274 }
275 100% {
276 opacity: 1;
277 transform-origin: 0% 0%;
278 transform: scaleY(1);
279 }
280}
281@keyframes rcMenuOpenSlideUpOut {
282 0% {
283 opacity: 1;
284 transform-origin: 0% 0%;
285 transform: scaleY(1);
286 }
287 100% {
288 opacity: 0;
289 transform-origin: 0% 0%;
290 transform: scaleY(0);
291 }
292}
293.rc-menu-open-zoom-enter,
294.rc-menu-open-zoom-appear {
295 opacity: 0;
296 animation-duration: 0.3s;
297 animation-fill-mode: both;
298 transform-origin: 0 0;
299 animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
300 animation-play-state: paused;
301}
302.rc-menu-open-zoom-leave {
303 animation-duration: 0.3s;
304 animation-fill-mode: both;
305 transform-origin: 0 0;
306 animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);
307 animation-play-state: paused;
308}
309.rc-menu-open-zoom-enter.rc-menu-open-zoom-enter-active,
310.rc-menu-open-zoom-appear.rc-menu-open-zoom-appear-active {
311 animation-name: rcMenuOpenZoomIn;
312 animation-play-state: running;
313}
314.rc-menu-open-zoom-leave.rc-menu-open-zoom-leave-active {
315 animation-name: rcMenuOpenZoomOut;
316 animation-play-state: running;
317}
318.rc-menu-submenu-rtl.rc-menu-open-zoom-enter,
319.rc-menu-submenu-rtl.rc-menu-open-zoom-appear,
320.rc-menu-submenu-rtl.rc-menu-open-zoom-leave,
321.rc-menu-submenu-rtl .rc-menu-open-zoom-enter,
322.rc-menu-submenu-rtl .rc-menu-open-zoom-appear,
323.rc-menu-submenu-rtl .rc-menu-open-zoom-leave {
324 transform-origin: top right !important;
325}
326@keyframes rcMenuOpenZoomIn {
327 0% {
328 opacity: 0;
329 transform: scale(0, 0);
330 }
331 100% {
332 opacity: 1;
333 transform: scale(1, 1);
334 }
335}
336@keyframes rcMenuOpenZoomOut {
337 0% {
338 transform: scale(1, 1);
339 }
340 100% {
341 opacity: 0;
342 transform: scale(0, 0);
343 }
344}