source: pro-violet-viettel/sourcecode/assets/css/bootstrap-editable.css @ 883

Last change on this file since 883 was 294, checked in by dungnv, 11 years ago
  • Property svn:mime-type set to text/plain
File size: 20.5 KB
Line 
1/*! X-editable - v1.4.6
2* In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
3* http://github.com/vitalets/x-editable
4* Copyright (c) 2013 Vitaliy Potapov; Licensed MIT */
5
6.editableform {
7    margin-bottom: 0; /* overwrites bootstrap margin */
8}
9
10.editableform .control-group {
11    margin-bottom: 0; /* overwrites bootstrap margin */
12    white-space: nowrap; /* prevent wrapping buttons on new line */
13    line-height: 20px; /* overwriting bootstrap line-height. See #133 */
14}
15
16.editable-buttons {
17   display: inline-block; /* should be inline to take effect of parent's white-space: nowrap */
18   vertical-align: top;
19   margin-left: 7px;
20   /* inline-block emulation for IE7*/
21   zoom: 1;
22   *display: inline;
23}
24
25.editable-buttons.editable-buttons-bottom {
26   display: block;
27   margin-top: 7px;
28   margin-left: 0;
29}
30
31.editable-input {
32    vertical-align: top;
33    display: inline-block; /* should be inline to take effect of parent's white-space: nowrap */
34    width: auto; /* bootstrap-responsive has width: 100% that breakes layout */
35    white-space: normal; /* reset white-space decalred in parent*/
36   /* display-inline emulation for IE7*/
37   zoom: 1;
38   *display: inline;   
39}
40
41.editable-buttons .editable-cancel {
42   margin-left: 7px;
43}
44
45/*for jquery-ui buttons need set height to look more pretty*/
46.editable-buttons button.ui-button-icon-only {
47   height: 24px;
48   width: 30px;
49}
50
51.editableform-loading {
52    background: url('../img/loading.gif') center center no-repeat; 
53    height: 25px;
54    width: auto;
55    min-width: 25px;
56}
57
58.editable-inline .editableform-loading {
59    background-position: left 5px;     
60}
61
62 .editable-error-block {
63    max-width: 300px;
64    margin: 5px 0 0 0;
65    width: auto;
66    white-space: normal;
67}
68
69/*add padding for jquery ui*/
70.editable-error-block.ui-state-error {
71    padding: 3px; 
72
73
74.editable-error {
75   color: red; 
76}
77
78/* ---- For specific types ---- */
79
80.editableform .editable-date {
81    padding: 0;
82    margin: 0;
83    float: left;
84}
85
86/* move datepicker icon to center of add-on button. See https://github.com/vitalets/x-editable/issues/183 */
87.editable-inline .add-on .icon-th {
88   margin-top: 3px;
89   margin-left: 1px;
90}
91
92
93/* checklist vertical alignment */
94.editable-checklist label input[type="checkbox"],
95.editable-checklist label span {
96    vertical-align: middle;
97    margin: 0;
98}
99
100.editable-checklist label {
101    white-space: nowrap;
102}
103
104/* set exact width of textarea to fit buttons toolbar */
105.editable-wysihtml5 {
106    width: 566px;
107    height: 250px;
108}
109
110/* clear button shown as link in date inputs */
111.editable-clear {
112   clear: both;
113   font-size: 0.9em;
114   text-decoration: none;
115   text-align: right;
116}
117
118/* IOS-style clear button for text inputs */
119.editable-clear-x {
120   background: url('../img/clear.png') center center no-repeat;
121   display: block;
122   width: 13px;   
123   height: 13px;
124   position: absolute;
125   opacity: 0.6;
126   z-index: 100;
127   
128   top: 50%;
129   right: 6px;
130   margin-top: -6px;
131   
132}
133
134.editable-clear-x:hover {
135   opacity: 1;
136}
137
138.editable-pre-wrapped {
139   white-space: pre-wrap;
140}
141.editable-container.editable-popup {
142    max-width: none !important; /* without this rule poshytip/tooltip does not stretch */
143
144
145.editable-container.popover {
146    width: auto; /* without this rule popover does not stretch */
147}
148
149.editable-container.editable-inline {
150    display: inline-block;
151    vertical-align: middle;
152    width: auto;
153    /* inline-block emulation for IE7*/
154    zoom: 1;
155    *display: inline;   
156}
157
158.editable-container.ui-widget {
159   font-size: inherit;  /* jqueryui widget font 1.1em too big, overwrite it */
160   z-index: 9990; /* should be less than select2 dropdown z-index to close dropdown first when click */
161}
162.editable-click,
163a.editable-click,
164a.editable-click:hover {
165    text-decoration: none;
166    border-bottom: dashed 1px #0088cc;
167}
168
169.editable-click.editable-disabled,
170a.editable-click.editable-disabled,
171a.editable-click.editable-disabled:hover {
172   color: #585858; 
173   cursor: default;
174   border-bottom: none;
175}
176
177.editable-empty, .editable-empty:hover, .editable-empty:focus{
178  font-style: italic;
179  color: #DD1144; 
180  /* border-bottom: none; */
181  text-decoration: none;
182}
183
184.editable-unsaved {
185  font-weight: bold;
186}
187
188.editable-unsaved:after {
189/*    content: '*'*/
190}
191
192.editable-bg-transition {
193  -webkit-transition: background-color 1400ms ease-out;
194  -moz-transition: background-color 1400ms ease-out;
195  -o-transition: background-color 1400ms ease-out;
196  -ms-transition: background-color 1400ms ease-out;
197  transition: background-color 1400ms ease-out; 
198}
199
200/*see https://github.com/vitalets/x-editable/issues/139 */
201.form-horizontal .editable
202{
203    padding-top: 5px;
204    display:inline-block;
205}
206
207
208/*!
209 * Datepicker for Bootstrap
210 *
211 * Copyright 2012 Stefan Petre
212 * Improvements by Andrew Rowls
213 * Licensed under the Apache License v2.0
214 * http://www.apache.org/licenses/LICENSE-2.0
215 *
216 */
217.datepicker {
218  padding: 4px;
219  -webkit-border-radius: 4px;
220  -moz-border-radius: 4px;
221  border-radius: 4px;
222  direction: ltr;
223  /*.dow {
224                border-top: 1px solid #ddd !important;
225        }*/
226
227}
228.datepicker-inline {
229  width: 220px;
230}
231.datepicker.datepicker-rtl {
232  direction: rtl;
233}
234.datepicker.datepicker-rtl table tr td span {
235  float: right;
236}
237.datepicker-dropdown {
238  top: 0;
239  left: 0;
240}
241.datepicker-dropdown:before {
242  content: '';
243  display: inline-block;
244  border-left: 7px solid transparent;
245  border-right: 7px solid transparent;
246  border-bottom: 7px solid #ccc;
247  border-bottom-color: rgba(0, 0, 0, 0.2);
248  position: absolute;
249  top: -7px;
250  left: 6px;
251}
252.datepicker-dropdown:after {
253  content: '';
254  display: inline-block;
255  border-left: 6px solid transparent;
256  border-right: 6px solid transparent;
257  border-bottom: 6px solid #ffffff;
258  position: absolute;
259  top: -6px;
260  left: 7px;
261}
262.datepicker > div {
263  display: none;
264}
265.datepicker.days div.datepicker-days {
266  display: block;
267}
268.datepicker.months div.datepicker-months {
269  display: block;
270}
271.datepicker.years div.datepicker-years {
272  display: block;
273}
274.datepicker table {
275  margin: 0;
276}
277.datepicker td,
278.datepicker th {
279  text-align: center;
280  width: 20px;
281  height: 20px;
282  -webkit-border-radius: 4px;
283  -moz-border-radius: 4px;
284  border-radius: 4px;
285  border: none;
286}
287.table-striped .datepicker table tr td,
288.table-striped .datepicker table tr th {
289  background-color: transparent;
290}
291.datepicker table tr td.day:hover {
292  background: #eeeeee;
293  cursor: pointer;
294}
295.datepicker table tr td.old,
296.datepicker table tr td.new {
297  color: #999999;
298}
299.datepicker table tr td.disabled,
300.datepicker table tr td.disabled:hover {
301  background: none;
302  color: #999999;
303  cursor: default;
304}
305.datepicker table tr td.today,
306.datepicker table tr td.today:hover,
307.datepicker table tr td.today.disabled,
308.datepicker table tr td.today.disabled:hover {
309  background-color: #fde19a;
310  background-image: -moz-linear-gradient(top, #fdd49a, #fdf59a);
311  background-image: -ms-linear-gradient(top, #fdd49a, #fdf59a);
312  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fdd49a), to(#fdf59a));
313  background-image: -webkit-linear-gradient(top, #fdd49a, #fdf59a);
314  background-image: -o-linear-gradient(top, #fdd49a, #fdf59a);
315  background-image: linear-gradient(top, #fdd49a, #fdf59a);
316  background-repeat: repeat-x;
317  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdd49a', endColorstr='#fdf59a', GradientType=0);
318  border-color: #fdf59a #fdf59a #fbed50;
319  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
320  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
321  color: #000;
322}
323.datepicker table tr td.today:hover,
324.datepicker table tr td.today:hover:hover,
325.datepicker table tr td.today.disabled:hover,
326.datepicker table tr td.today.disabled:hover:hover,
327.datepicker table tr td.today:active,
328.datepicker table tr td.today:hover:active,
329.datepicker table tr td.today.disabled:active,
330.datepicker table tr td.today.disabled:hover:active,
331.datepicker table tr td.today.active,
332.datepicker table tr td.today:hover.active,
333.datepicker table tr td.today.disabled.active,
334.datepicker table tr td.today.disabled:hover.active,
335.datepicker table tr td.today.disabled,
336.datepicker table tr td.today:hover.disabled,
337.datepicker table tr td.today.disabled.disabled,
338.datepicker table tr td.today.disabled:hover.disabled,
339.datepicker table tr td.today[disabled],
340.datepicker table tr td.today:hover[disabled],
341.datepicker table tr td.today.disabled[disabled],
342.datepicker table tr td.today.disabled:hover[disabled] {
343  background-color: #fdf59a;
344}
345.datepicker table tr td.today:active,
346.datepicker table tr td.today:hover:active,
347.datepicker table tr td.today.disabled:active,
348.datepicker table tr td.today.disabled:hover:active,
349.datepicker table tr td.today.active,
350.datepicker table tr td.today:hover.active,
351.datepicker table tr td.today.disabled.active,
352.datepicker table tr td.today.disabled:hover.active {
353  background-color: #fbf069 \9;
354}
355.datepicker table tr td.today:hover:hover {
356  color: #000;
357}
358.datepicker table tr td.today.active:hover {
359  color: #fff;
360}
361.datepicker table tr td.range,
362.datepicker table tr td.range:hover,
363.datepicker table tr td.range.disabled,
364.datepicker table tr td.range.disabled:hover {
365  background: #eeeeee;
366  -webkit-border-radius: 0;
367  -moz-border-radius: 0;
368  border-radius: 0;
369}
370.datepicker table tr td.range.today,
371.datepicker table tr td.range.today:hover,
372.datepicker table tr td.range.today.disabled,
373.datepicker table tr td.range.today.disabled:hover {
374  background-color: #f3d17a;
375  background-image: -moz-linear-gradient(top, #f3c17a, #f3e97a);
376  background-image: -ms-linear-gradient(top, #f3c17a, #f3e97a);
377  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f3c17a), to(#f3e97a));
378  background-image: -webkit-linear-gradient(top, #f3c17a, #f3e97a);
379  background-image: -o-linear-gradient(top, #f3c17a, #f3e97a);
380  background-image: linear-gradient(top, #f3c17a, #f3e97a);
381  background-repeat: repeat-x;
382  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3c17a', endColorstr='#f3e97a', GradientType=0);
383  border-color: #f3e97a #f3e97a #edde34;
384  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
385  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
386  -webkit-border-radius: 0;
387  -moz-border-radius: 0;
388  border-radius: 0;
389}
390.datepicker table tr td.range.today:hover,
391.datepicker table tr td.range.today:hover:hover,
392.datepicker table tr td.range.today.disabled:hover,
393.datepicker table tr td.range.today.disabled:hover:hover,
394.datepicker table tr td.range.today:active,
395.datepicker table tr td.range.today:hover:active,
396.datepicker table tr td.range.today.disabled:active,
397.datepicker table tr td.range.today.disabled:hover:active,
398.datepicker table tr td.range.today.active,
399.datepicker table tr td.range.today:hover.active,
400.datepicker table tr td.range.today.disabled.active,
401.datepicker table tr td.range.today.disabled:hover.active,
402.datepicker table tr td.range.today.disabled,
403.datepicker table tr td.range.today:hover.disabled,
404.datepicker table tr td.range.today.disabled.disabled,
405.datepicker table tr td.range.today.disabled:hover.disabled,
406.datepicker table tr td.range.today[disabled],
407.datepicker table tr td.range.today:hover[disabled],
408.datepicker table tr td.range.today.disabled[disabled],
409.datepicker table tr td.range.today.disabled:hover[disabled] {
410  background-color: #f3e97a;
411}
412.datepicker table tr td.range.today:active,
413.datepicker table tr td.range.today:hover:active,
414.datepicker table tr td.range.today.disabled:active,
415.datepicker table tr td.range.today.disabled:hover:active,
416.datepicker table tr td.range.today.active,
417.datepicker table tr td.range.today:hover.active,
418.datepicker table tr td.range.today.disabled.active,
419.datepicker table tr td.range.today.disabled:hover.active {
420  background-color: #efe24b \9;
421}
422.datepicker table tr td.selected,
423.datepicker table tr td.selected:hover,
424.datepicker table tr td.selected.disabled,
425.datepicker table tr td.selected.disabled:hover {
426  background-color: #9e9e9e;
427  background-image: -moz-linear-gradient(top, #b3b3b3, #808080);
428  background-image: -ms-linear-gradient(top, #b3b3b3, #808080);
429  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b3b3b3), to(#808080));
430  background-image: -webkit-linear-gradient(top, #b3b3b3, #808080);
431  background-image: -o-linear-gradient(top, #b3b3b3, #808080);
432  background-image: linear-gradient(top, #b3b3b3, #808080);
433  background-repeat: repeat-x;
434  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3b3b3', endColorstr='#808080', GradientType=0);
435  border-color: #808080 #808080 #595959;
436  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
437  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
438  color: #fff;
439  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
440}
441.datepicker table tr td.selected:hover,
442.datepicker table tr td.selected:hover:hover,
443.datepicker table tr td.selected.disabled:hover,
444.datepicker table tr td.selected.disabled:hover:hover,
445.datepicker table tr td.selected:active,
446.datepicker table tr td.selected:hover:active,
447.datepicker table tr td.selected.disabled:active,
448.datepicker table tr td.selected.disabled:hover:active,
449.datepicker table tr td.selected.active,
450.datepicker table tr td.selected:hover.active,
451.datepicker table tr td.selected.disabled.active,
452.datepicker table tr td.selected.disabled:hover.active,
453.datepicker table tr td.selected.disabled,
454.datepicker table tr td.selected:hover.disabled,
455.datepicker table tr td.selected.disabled.disabled,
456.datepicker table tr td.selected.disabled:hover.disabled,
457.datepicker table tr td.selected[disabled],
458.datepicker table tr td.selected:hover[disabled],
459.datepicker table tr td.selected.disabled[disabled],
460.datepicker table tr td.selected.disabled:hover[disabled] {
461  background-color: #808080;
462}
463.datepicker table tr td.selected:active,
464.datepicker table tr td.selected:hover:active,
465.datepicker table tr td.selected.disabled:active,
466.datepicker table tr td.selected.disabled:hover:active,
467.datepicker table tr td.selected.active,
468.datepicker table tr td.selected:hover.active,
469.datepicker table tr td.selected.disabled.active,
470.datepicker table tr td.selected.disabled:hover.active {
471  background-color: #666666 \9;
472}
473.datepicker table tr td.active,
474.datepicker table tr td.active:hover,
475.datepicker table tr td.active.disabled,
476.datepicker table tr td.active.disabled:hover {
477  background-color: #006dcc;
478  background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
479  background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
480  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
481  background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
482  background-image: -o-linear-gradient(top, #0088cc, #0044cc);
483  background-image: linear-gradient(top, #0088cc, #0044cc);
484  background-repeat: repeat-x;
485  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
486  border-color: #0044cc #0044cc #002a80;
487  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
488  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
489  color: #fff;
490  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
491}
492.datepicker table tr td.active:hover,
493.datepicker table tr td.active:hover:hover,
494.datepicker table tr td.active.disabled:hover,
495.datepicker table tr td.active.disabled:hover:hover,
496.datepicker table tr td.active:active,
497.datepicker table tr td.active:hover:active,
498.datepicker table tr td.active.disabled:active,
499.datepicker table tr td.active.disabled:hover:active,
500.datepicker table tr td.active.active,
501.datepicker table tr td.active:hover.active,
502.datepicker table tr td.active.disabled.active,
503.datepicker table tr td.active.disabled:hover.active,
504.datepicker table tr td.active.disabled,
505.datepicker table tr td.active:hover.disabled,
506.datepicker table tr td.active.disabled.disabled,
507.datepicker table tr td.active.disabled:hover.disabled,
508.datepicker table tr td.active[disabled],
509.datepicker table tr td.active:hover[disabled],
510.datepicker table tr td.active.disabled[disabled],
511.datepicker table tr td.active.disabled:hover[disabled] {
512  background-color: #0044cc;
513}
514.datepicker table tr td.active:active,
515.datepicker table tr td.active:hover:active,
516.datepicker table tr td.active.disabled:active,
517.datepicker table tr td.active.disabled:hover:active,
518.datepicker table tr td.active.active,
519.datepicker table tr td.active:hover.active,
520.datepicker table tr td.active.disabled.active,
521.datepicker table tr td.active.disabled:hover.active {
522  background-color: #003399 \9;
523}
524.datepicker table tr td span {
525  display: block;
526  width: 23%;
527  height: 54px;
528  line-height: 54px;
529  float: left;
530  margin: 1%;
531  cursor: pointer;
532  -webkit-border-radius: 4px;
533  -moz-border-radius: 4px;
534  border-radius: 4px;
535}
536.datepicker table tr td span:hover {
537  background: #eeeeee;
538}
539.datepicker table tr td span.disabled,
540.datepicker table tr td span.disabled:hover {
541  background: none;
542  color: #999999;
543  cursor: default;
544}
545.datepicker table tr td span.active,
546.datepicker table tr td span.active:hover,
547.datepicker table tr td span.active.disabled,
548.datepicker table tr td span.active.disabled:hover {
549  background-color: #006dcc;
550  background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
551  background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
552  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
553  background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
554  background-image: -o-linear-gradient(top, #0088cc, #0044cc);
555  background-image: linear-gradient(top, #0088cc, #0044cc);
556  background-repeat: repeat-x;
557  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
558  border-color: #0044cc #0044cc #002a80;
559  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
560  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
561  color: #fff;
562  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
563}
564.datepicker table tr td span.active:hover,
565.datepicker table tr td span.active:hover:hover,
566.datepicker table tr td span.active.disabled:hover,
567.datepicker table tr td span.active.disabled:hover:hover,
568.datepicker table tr td span.active:active,
569.datepicker table tr td span.active:hover:active,
570.datepicker table tr td span.active.disabled:active,
571.datepicker table tr td span.active.disabled:hover:active,
572.datepicker table tr td span.active.active,
573.datepicker table tr td span.active:hover.active,
574.datepicker table tr td span.active.disabled.active,
575.datepicker table tr td span.active.disabled:hover.active,
576.datepicker table tr td span.active.disabled,
577.datepicker table tr td span.active:hover.disabled,
578.datepicker table tr td span.active.disabled.disabled,
579.datepicker table tr td span.active.disabled:hover.disabled,
580.datepicker table tr td span.active[disabled],
581.datepicker table tr td span.active:hover[disabled],
582.datepicker table tr td span.active.disabled[disabled],
583.datepicker table tr td span.active.disabled:hover[disabled] {
584  background-color: #0044cc;
585}
586.datepicker table tr td span.active:active,
587.datepicker table tr td span.active:hover:active,
588.datepicker table tr td span.active.disabled:active,
589.datepicker table tr td span.active.disabled:hover:active,
590.datepicker table tr td span.active.active,
591.datepicker table tr td span.active:hover.active,
592.datepicker table tr td span.active.disabled.active,
593.datepicker table tr td span.active.disabled:hover.active {
594  background-color: #003399 \9;
595}
596.datepicker table tr td span.old,
597.datepicker table tr td span.new {
598  color: #999999;
599}
600.datepicker th.datepicker-switch {
601  width: 145px;
602}
603.datepicker thead tr:first-child th,
604.datepicker tfoot tr th {
605  cursor: pointer;
606}
607.datepicker thead tr:first-child th:hover,
608.datepicker tfoot tr th:hover {
609  background: #eeeeee;
610}
611.datepicker .cw {
612  font-size: 10px;
613  width: 12px;
614  padding: 0 2px 0 5px;
615  vertical-align: middle;
616}
617.datepicker thead tr:first-child th.cw {
618  cursor: default;
619  background-color: transparent;
620}
621.input-append.date .add-on i,
622.input-prepend.date .add-on i {
623  display: block;
624  cursor: pointer;
625  width: 16px;
626  height: 16px;
627}
628.input-daterange input {
629  text-align: center;
630}
631.input-daterange input:first-child {
632  -webkit-border-radius: 3px 0 0 3px;
633  -moz-border-radius: 3px 0 0 3px;
634  border-radius: 3px 0 0 3px;
635}
636.input-daterange input:last-child {
637  -webkit-border-radius: 0 3px 3px 0;
638  -moz-border-radius: 0 3px 3px 0;
639  border-radius: 0 3px 3px 0;
640}
641.input-daterange .add-on {
642  display: inline-block;
643  width: auto;
644  min-width: 16px;
645  height: 18px;
646  padding: 4px 5px;
647  font-weight: normal;
648  line-height: 18px;
649  text-align: center;
650  text-shadow: 0 1px 0 #ffffff;
651  vertical-align: middle;
652  background-color: #eeeeee;
653  border: 1px solid #ccc;
654  margin-left: -5px;
655  margin-right: -5px;
656}
Note: See TracBrowser for help on using the repository browser.