← Back to branch summary

~johnsca/charms/trusty/cloudfoundry/better-basic-reconciler-status

« back to all changes in this revision

Viewing changes to reconciler/ui/static/semantic/uncompressed/modules/dropdown.css

  • Committer: Whit Morriss
  • Date: 2014-10-13 06:50:17 UTC
  • mto: (132.2.1 reconciler) (145.1.1 trunk)
  • mto: This revision was merged to the branch mainline in revision 156.
  • Revision ID: whit.morriss@canonical.com-20141013065017-0feo2ku3yllymkol
reorg reconciler

Show diffs side-by-side

added added

removed removed

Lines of Context:
reconciler/ui/static/semantic/uncompressed/modules/dropdown.css
 
1
/*
 
2
 * # Semantic - Dropdown
 
3
 * http://github.com/jlukic/semantic-ui/
 
4
 *
 
5
 *
 
6
 * Copyright 2014 Contributors
 
7
 * Released under the MIT license
 
8
 * http://opensource.org/licenses/MIT
 
9
 *
 
10
 */
 
11
/*******************************
 
12
            Dropdown
 
13
*******************************/
 
14
.ui.dropdown {
 
15
  cursor: pointer;
 
16
  position: relative;
 
17
  display: inline-block;
 
18
  line-height: 1;
 
19
  -webkit-transition: border-radius 0.1s ease, width 0.2s ease;
 
20
  -moz-transition: border-radius 0.1s ease, width 0.2s ease;
 
21
  transition: border-radius 0.1s ease, width 0.2s ease;
 
22
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 
23
  -moz-tap-highlight-color: rgba(0, 0, 0, 0);
 
24
  tap-highlight-color: rgba(0, 0, 0, 0);
 
25
}
 
26
/*******************************
 
27
            Content
 
28
*******************************/
 
29
/*--------------
 
30
     Menu
 
31
---------------*/
 
32
.ui.dropdown .menu {
 
33
  cursor: auto;
 
34
  position: absolute;
 
35
  display: none;
 
36
  top: 100%;
 
37
  margin: 0em;
 
38
  background-color: #FFFFFF;
 
39
  min-width: 100%;
 
40
  white-space: nowrap;
 
41
  font-size: 0.875em;
 
42
  text-shadow: none;
 
43
  -webkit-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1);
 
44
  box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1);
 
45
  border-radius: 0px 0px 0.325em 0.325em;
 
46
  -webkit-transition: opacity 0.2s ease;
 
47
  -moz-transition: opacity 0.2s ease;
 
48
  transition: opacity 0.2s ease;
 
49
  z-index: 11;
 
50
}
 
51
/*--------------
 
52
      Icon
 
53
---------------*/
 
54
.ui.dropdown > .dropdown.icon {
 
55
  width: auto;
 
56
  margin: 0em 0em 0em 1em;
 
57
}
 
58
.ui.dropdown > .dropdown.icon:before {
 
59
  content: "\f0d7";
 
60
}
 
61
.ui.dropdown .menu .item .dropdown.icon {
 
62
  width: auto;
 
63
  float: right;
 
64
  margin: 0em 0em 0em 0.5em;
 
65
}
 
66
.ui.dropdown .menu .item .dropdown.icon:before {
 
67
  content: "\f0da" /*rtl:"\f0d9"*/;
 
68
}
 
69
/*--------------
 
70
      Text
 
71
---------------*/
 
72
.ui.dropdown > .text {
 
73
  display: inline-block;
 
74
  -webkit-transition: color 0.2s ease;
 
75
  -moz-transition: color 0.2s ease;
 
76
  transition: color 0.2s ease;
 
77
}
 
78
/* Flyout Direction */
 
79
.ui.dropdown .menu {
 
80
  left: 0px;
 
81
}
 
82
/*--------------
 
83
    Sub Menu
 
84
---------------*/
 
85
.ui.dropdown .menu .menu {
 
86
  top: 0% !important;
 
87
  left: 100% !important;
 
88
  margin: 0em !important;
 
89
  border-radius: 0 0.325em 0.325em 0em !important;
 
90
}
 
91
.ui.dropdown .menu .menu:after {
 
92
  display: none;
 
93
}
 
94
.ui.dropdown .menu .item {
 
95
  cursor: pointer;
 
96
  border: none;
 
97
  border-top: 1px solid rgba(0, 0, 0, 0.05);
 
98
  height: auto;
 
99
  font-size: 0.875em;
 
100
  display: block;
 
101
  color: rgba(0, 0, 0, 0.75);
 
102
  padding: 0.85em 1em !important;
 
103
  font-size: 0.875rem;
 
104
  text-transform: none;
 
105
  font-weight: normal;
 
106
  text-align: left;
 
107
  -webkit-touch-callout: none;
 
108
}
 
109
.ui.dropdown .menu .item:before {
 
110
  display: none;
 
111
}
 
112
.ui.dropdown .menu .item .icon {
 
113
  margin-right: 0.75em;
 
114
}
 
115
.ui.dropdown .menu .item:first-child {
 
116
  border-top: none;
 
117
}
 
118
/*******************************
 
119
            Coupling
 
120
*******************************/
 
121
/* Opposite on last menu on right */
 
122
.ui.menu .right.menu .dropdown:last-child .menu,
 
123
.ui.buttons > .ui.dropdown:last-child .menu {
 
124
  left: auto;
 
125
  right: 0px;
 
126
}
 
127
.ui.vertical.menu .dropdown.item > .dropdown.icon:before {
 
128
  content: "\f0da" /*rtl:"\f0d9"*/;
 
129
}
 
130
.ui.dropdown.icon.button > .dropdown.icon {
 
131
  margin: 0em;
 
132
}
 
133
/*******************************
 
134
            States
 
135
*******************************/
 
136
/* Dropdown Visible */
 
137
.ui.visible.dropdown > .menu {
 
138
  display: block;
 
139
}
 
140
/*--------------------
 
141
        Hover
 
142
----------------------*/
 
143
/* Menu Item Hover */
 
144
.ui.dropdown .menu .item:hover {
 
145
  background-color: rgba(0, 0, 0, 0.02);
 
146
  z-index: 12;
 
147
}
 
148
/*--------------------
 
149
        Selected
 
150
----------------------*/
 
151
/* Menu Item Selected */
 
152
.ui.dropdown .menu .item.selected {
 
153
  background-color: rgba(0, 0, 0, 0.02);
 
154
  z-index: 12;
 
155
}
 
156
/*--------------------
 
157
        Active
 
158
----------------------*/
 
159
/* Menu Item Active */
 
160
.ui.dropdown .menu .active.item {
 
161
  background-color: rgba(0, 0, 0, 0.06) !important;
 
162
  border-left: none;
 
163
  border-color: transparent !important;
 
164
  -webkit-box-shadow: none;
 
165
  -moz-shadow: none;
 
166
  -webkit-box-shadow: none;
 
167
          box-shadow: none;
 
168
  z-index: 12;
 
169
}
 
170
/*--------------------
 
171
     Default Text
 
172
----------------------*/
 
173
.ui.dropdown > .default.text,
 
174
.ui.default.dropdown > .text {
 
175
  color: rgba(0, 0, 0, 0.5);
 
176
}
 
177
.ui.dropdown:hover > .default.text,
 
178
.ui.default.dropdown:hover > .text {
 
179
  color: rgba(0, 0, 0, 0.8);
 
180
}
 
181
/*--------------------
 
182
        Error
 
183
----------------------*/
 
184
.ui.dropdown.error,
 
185
.ui.dropdown.error > .text,
 
186
.ui.dropdown.error > .default.text {
 
187
  color: #D95C5C !important;
 
188
}
 
189
.ui.selection.dropdown.error {
 
190
  background-color: #FFFAFA;
 
191
  -webkit-box-shadow: 0px 0px 0px 1px #e7bebe !important;
 
192
  box-shadow: 0px 0px 0px 1px #e7bebe !important;
 
193
}
 
194
.ui.selection.dropdown.error:hover {
 
195
  -webkit-box-shadow: 0px 0px 0px 1px #e7bebe !important;
 
196
  box-shadow: 0px 0px 0px 1px #e7bebe !important;
 
197
}
 
198
.ui.dropdown.error > .menu,
 
199
.ui.dropdown.error > .menu .menu {
 
200
  -webkit-box-shadow: 0px 0px 1px 1px #E7BEBE !important;
 
201
  box-shadow: 0px 0px 1px 1px #E7BEBE !important;
 
202
}
 
203
.ui.dropdown.error > .menu .item {
 
204
  color: #D95C5C !important;
 
205
}
 
206
/* Item Hover */
 
207
.ui.dropdown.error > .menu .item:hover {
 
208
  background-color: #FFF2F2 !important;
 
209
}
 
210
/* Item Active */
 
211
.ui.dropdown.error > .menu .active.item {
 
212
  background-color: #FDCFCF !important;
 
213
}
 
214
/*******************************
 
215
           Variations
 
216
*******************************/
 
217
/*--------------
 
218
     Simple
 
219
---------------*/
 
220
/* Displays without javascript */
 
221
.ui.simple.dropdown .menu:before,
 
222
.ui.simple.dropdown .menu:after {
 
223
  display: none;
 
224
}
 
225
.ui.simple.dropdown .menu {
 
226
  display: block;
 
227
  overflow: hidden;
 
228
  top: -9999px !important;
 
229
  position: absolute;
 
230
  opacity: 0;
 
231
  width: 0;
 
232
  height: 0;
 
233
  -webkit-transition: opacity 0.2s ease-out;
 
234
  -moz-transition: opacity 0.2s ease-out;
 
235
  transition: opacity 0.2s ease-out;
 
236
}
 
237
.ui.simple.active.dropdown,
 
238
.ui.simple.dropdown:hover {
 
239
  border-bottom-left-radius: 0em !important;
 
240
  border-bottom-right-radius: 0em !important;
 
241
}
 
242
.ui.simple.active.dropdown > .menu,
 
243
.ui.simple.dropdown:hover > .menu {
 
244
  overflow: visible;
 
245
  width: auto;
 
246
  height: auto;
 
247
  top: 100% !important;
 
248
  opacity: 1;
 
249
}
 
250
.ui.simple.dropdown > .menu .item:active > .menu,
 
251
.ui.simple.dropdown:hover > .menu .item:hover > .menu {
 
252
  overflow: visible;
 
253
  width: auto;
 
254
  height: auto;
 
255
  top: 0% !important;
 
256
  left: 100% !important;
 
257
  opacity: 1;
 
258
}
 
259
.ui.simple.disabled.dropdown:hover .menu {
 
260
  display: none;
 
261
  height: 0px;
 
262
  width: 0px;
 
263
  overflow: hidden;
 
264
}
 
265
/*--------------
 
266
    Selection
 
267
---------------*/
 
268
/* Displays like a select box */
 
269
.ui.selection.dropdown {
 
270
  cursor: pointer;
 
271
  display: inline-block;
 
272
  word-wrap: break-word;
 
273
  white-space: normal;
 
274
  background-color: #FFFFFF;
 
275
  padding: 0.65em 1em;
 
276
  line-height: 1.33;
 
277
  color: rgba(0, 0, 0, 0.8);
 
278
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) !important;
 
279
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) !important;
 
280
  border-radius: 0.3125em !important;
 
281
}
 
282
.ui.selection.dropdown select {
 
283
  display: none;
 
284
}
 
285
.ui.selection.dropdown > .dropdown.icon {
 
286
  opacity: 0.7;
 
287
  margin: 0.2em 0em 0.2em 1.25em;
 
288
  -webkit-transition: opacity 0.2s ease-out;
 
289
  -moz-transition: opacity 0.2s ease-out;
 
290
  transition: opacity 0.2s ease-out;
 
291
}
 
292
.ui.selection.dropdown,
 
293
.ui.selection.dropdown .menu {
 
294
  -webkit-transition: -webkit-box-shadow 0.2s ease-out;
 
295
  -moz-transition: box-shadow 0.2s ease-out;
 
296
  transition: box-shadow 0.2s ease-out;
 
297
}
 
298
.ui.selection.dropdown .menu {
 
299
  top: 100%;
 
300
  max-height: 312px;
 
301
  overflow-x: hidden;
 
302
  overflow-y: auto;
 
303
  -webkit-box-shadow: 0px 1px 0px 1px #E0E0E0;
 
304
  box-shadow: 0px 1px 0px 1px #E0E0E0;
 
305
  border-radius: 0px 0px 0.325em 0.325em;
 
306
}
 
307
.ui.selection.dropdown .menu:after,
 
308
.ui.selection.dropdown .menu:before {
 
309
  display: none;
 
310
}
 
311
.ui.selection.dropdown .menu img {
 
312
  height: 2.5em;
 
313
  display: inline-block;
 
314
  vertical-align: middle;
 
315
  margin-right: 0.5em;
 
316
}
 
317
/*--------------------
 
318
        Error
 
319
----------------------*/
 
320
.ui.selection.dropdown.error,
 
321
.ui.selection.dropdown.error .item {
 
322
  background-color: #FFFAFA;
 
323
  color: #D95C5C;
 
324
}
 
325
.ui.selection.dropdown.error {
 
326
  -webkit-box-shadow: 0px 0px 0px 1px #e7bebe !important;
 
327
  box-shadow: 0px 0px 0px 1px #e7bebe !important;
 
328
}
 
329
.ui.selection.dropdown.error .menu {
 
330
  -webkit-box-shadow: 0px 1px 0px 1px #E7BEBE;
 
331
  box-shadow: 0px 1px 0px 1px #E7BEBE;
 
332
  border-radius: 0px 0px 0.325em 0.325em;
 
333
}
 
334
/* Menu Item Active */
 
335
.ui.selection.dropdown.error .menu .active.item {
 
336
  background-color: #FDCFCF !important;
 
337
}
 
338
/* Hover */
 
339
.ui.selection.dropdown:hover {
 
340
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2) !important;
 
341
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2) !important;
 
342
}
 
343
.ui.selection.dropdown:hover .menu {
 
344
  -webkit-box-shadow: 0px 1px 0px 1px #D3D3D3;
 
345
  box-shadow: 0px 1px 0px 1px #D3D3D3;
 
346
}
 
347
.ui.selection.dropdown:hover > .dropdown.icon {
 
348
  opacity: 1;
 
349
}
 
350
.ui.selection.dropdown.error:hover {
 
351
  -webkit-box-shadow: 0px 0px 0px 1px #e7bebe !important;
 
352
  box-shadow: 0px 0px 0px 1px #e7bebe !important;
 
353
}
 
354
.ui.selection.dropdown.error:hover .menu {
 
355
  -webkit-box-shadow: 0px 1px 0px 1px #E7BEBE;
 
356
  box-shadow: 0px 1px 0px 1px #E7BEBE;
 
357
}
 
358
.ui.selection.dropdown.error .menu .item:hover {
 
359
  background-color: #FFF2F2;
 
360
}
 
361
/* Selected */
 
362
.ui.selection.dropdown.error .menu .item.selected {
 
363
  background-color: #FFF2F2;
 
364
}
 
365
/* Visible */
 
366
.ui.visible.selection.dropdown {
 
367
  border-bottom-left-radius: 0em !important;
 
368
  border-bottom-right-radius: 0em !important;
 
369
}
 
370
/* Active */
 
371
.ui.active.selection.dropdown {
 
372
  border-radius: 0.3125em 0.3125em 0em 0em !important;
 
373
}
 
374
.ui.active.selection.dropdown > .dropdown.icon {
 
375
  opacity: 1;
 
376
}
 
377
/*--------------
 
378
      Fluid
 
379
---------------*/
 
380
.ui.fluid.dropdown {
 
381
  display: block;
 
382
}
 
383
.ui.fluid.dropdown > .dropdown.icon {
 
384
  float: right;
 
385
}
 
386
/*--------------
 
387
     Inline
 
388
---------------*/
 
389
.ui.inline.dropdown {
 
390
  cursor: pointer;
 
391
  display: inline-block;
 
392
  color: inherit;
 
393
}
 
394
.ui.inline.dropdown .dropdown.icon {
 
395
  margin: 0em 0.5em 0em 0.25em;
 
396
}
 
397
.ui.inline.dropdown .text {
 
398
  font-weight: bold;
 
399
}
 
400
.ui.inline.dropdown .menu {
 
401
  cursor: auto;
 
402
  margin-top: 0.25em;
 
403
  border-radius: 0.325em;
 
404
}
 
405
/*--------------
 
406
    Floating
 
407
---------------*/
 
408
.ui.floating.dropdown .menu {
 
409
  left: 0;
 
410
  right: auto;
 
411
  margin-top: 0.5em !important;
 
412
  border-radius: 0.325em;
 
413
}
 
414
/*--------------
 
415
     Pointing
 
416
---------------*/
 
417
.ui.pointing.dropdown .menu {
 
418
  top: 100%;
 
419
  margin-top: 0.75em;
 
420
  border-radius: 0.325em;
 
421
}
 
422
.ui.pointing.dropdown .menu:after {
 
423
  display: block;
 
424
  position: absolute;
 
425
  pointer-events: none;
 
426
  content: " ";
 
427
  visibility: visible;
 
428
  width: 0.5em;
 
429
  height: 0.5em;
 
430
  -webkit-box-shadow: -1px -1px 0px 1px rgba(0, 0, 0, 0.05);
 
431
  box-shadow: -1px -1px 0px 1px rgba(0, 0, 0, 0.05);
 
432
  background-image: none;
 
433
  background-color: #FFFFFF;
 
434
  -webkit-transform: rotate(45deg);
 
435
  -moz-transform: rotate(45deg);
 
436
  -ms-transform: rotate(45deg);
 
437
      transform: rotate(45deg);
 
438
  z-index: 12;
 
439
}
 
440
.ui.pointing.dropdown .menu .active.item:first-child {
 
441
  background: transparent -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.03));
 
442
  background: transparent -moz-linear-gradient(transparent, rgba(0, 0, 0, 0.03));
 
443
  background: transparent -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.03)));
 
444
  background: transparent linear-gradient(transparent, rgba(0, 0, 0, 0.03));
 
445
}
 
446
/* Directions */
 
447
.ui.pointing.dropdown .menu:after {
 
448
  top: -0.25em;
 
449
  left: 50%;
 
450
  margin: 0em 0em 0em -0.25em;
 
451
}
 
452
.ui.top.left.pointing.dropdown .menu {
 
453
  top: 100%;
 
454
  bottom: auto;
 
455
  left: 0%;
 
456
  right: auto;
 
457
  margin: 0.75em 0em 0em;
 
458
}
 
459
.ui.top.left.pointing.dropdown .menu:after {
 
460
  top: -0.25em;
 
461
  left: 1.25em;
 
462
  right: auto;
 
463
  margin: 0em;
 
464
  -webkit-transform: rotate(45deg);
 
465
  -moz-transform: rotate(45deg);
 
466
  -ms-transform: rotate(45deg);
 
467
      transform: rotate(45deg);
 
468
}
 
469
.ui.top.right.pointing.dropdown .menu {
 
470
  top: 100%;
 
471
  bottom: auto;
 
472
  right: 0%;
 
473
  left: auto;
 
474
  margin: 0.75em 0em 0em;
 
475
}
 
476
.ui.top.right.pointing.dropdown .menu:after {
 
477
  top: -0.25em;
 
478
  left: auto;
 
479
  right: 1.25em;
 
480
  margin: 0em;
 
481
  -webkit-transform: rotate(45deg);
 
482
  -moz-transform: rotate(45deg);
 
483
  -ms-transform: rotate(45deg);
 
484
      transform: rotate(45deg);
 
485
}
 
486
.ui.left.pointing.dropdown .menu {
 
487
  top: 0%;
 
488
  left: 100%;
 
489
  right: auto;
 
490
  margin: 0em 0em 0em 0.75em;
 
491
}
 
492
.ui.left.pointing.dropdown .menu:after {
 
493
  top: 1em;
 
494
  left: -0.25em;
 
495
  margin: 0em 0em 0em 0em;
 
496
  -webkit-transform: rotate(-45deg);
 
497
  -moz-transform: rotate(-45deg);
 
498
  -ms-transform: rotate(-45deg);
 
499
      transform: rotate(-45deg);
 
500
}
 
501
.ui.right.pointing.dropdown .menu {
 
502
  top: 0%;
 
503
  left: auto;
 
504
  right: 100%;
 
505
  margin: 0em 0.75em 0em 0em;
 
506
}
 
507
.ui.right.pointing.dropdown .menu:after {
 
508
  top: 1em;
 
509
  left: auto;
 
510
  right: -0.25em;
 
511
  margin: 0em 0em 0em 0em;
 
512
  -webkit-transform: rotate(135deg);
 
513
  -moz-transform: rotate(135deg);
 
514
  -ms-transform: rotate(135deg);
 
515
      transform: rotate(135deg);
 
516
}