bootstrap-x-editable-rails 1.3.0 → 1.4.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,7 +1,7 @@
1
- /*! X-editable - v1.3.0
1
+ /*! X-editable - v1.4.0
2
2
  * In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
3
3
  * http://github.com/vitalets/x-editable
4
- * Copyright (c) 2012 Vitaliy Potapov; Licensed MIT */
4
+ * Copyright (c) 2013 Vitaliy Potapov; Licensed MIT */
5
5
 
6
6
  .editableform {
7
7
  margin-bottom: 0; /* overwrites bootstrap margin */
@@ -16,42 +16,42 @@
16
16
  display: inline-block; /* should be inline to take effect of parent's white-space: nowrap */
17
17
  vertical-align: top;
18
18
  margin-left: 7px;
19
- /* display-inline emulation for IE7*/
20
- zoom: 1;
19
+ /* inline-block emulation for IE7*/
20
+ zoom: 1;
21
21
  *display: inline;
22
22
  }
23
23
 
24
24
 
25
25
 
26
26
  .editable-input {
27
- vertical-align: top;
27
+ vertical-align: top;
28
28
  display: inline-block; /* should be inline to take effect of parent's white-space: nowrap */
29
29
  width: auto; /* bootstrap-responsive has width: 100% that breakes layout */
30
30
  white-space: normal; /* reset white-space decalred in parent*/
31
31
  /* display-inline emulation for IE7*/
32
- zoom: 1;
33
- *display: inline;
32
+ zoom: 1;
33
+ *display: inline;
34
34
  }
35
35
 
36
36
  .editable-buttons .editable-cancel {
37
- margin-left: 7px;
37
+ margin-left: 7px;
38
38
  }
39
39
 
40
40
  /*for jquery-ui buttons need set height to look more pretty*/
41
41
  .editable-buttons button.ui-button-icon-only {
42
- height: 24px;
42
+ height: 24px;
43
43
  width: 30px;
44
44
  }
45
45
 
46
46
  .editableform-loading {
47
- background: image-url("loading.gif") center center no-repeat;
47
+ background: image-url('loading.gif') center center no-repeat;
48
48
  height: 25px;
49
- width: auto;
50
- min-width: 25px;
49
+ width: auto;
50
+ min-width: 25px;
51
51
  }
52
52
 
53
53
  .editable-inline .editableform-loading {
54
- background-position: left 5px;
54
+ background-position: left 5px;
55
55
  }
56
56
 
57
57
  .editable-error-block {
@@ -63,44 +63,77 @@
63
63
 
64
64
  /*add padding for jquery ui*/
65
65
  .editable-error-block.ui-state-error {
66
- padding: 3px;
67
- }
66
+ padding: 3px;
67
+ }
68
68
 
69
69
  .editable-error {
70
- color: red;
71
- }
72
-
73
- .editableform textarea {
74
- height: 150px; /*default height for textarea*/
70
+ color: red;
75
71
  }
76
72
 
77
73
  .editableform .editable-date {
78
- padding: 0;
74
+ padding: 0;
79
75
  margin: 0;
80
76
  float: left;
81
77
  }
82
78
 
83
79
 
84
80
  /* checklist vertical alignment */
85
- .editable-checklist label input[type="checkbox"],
81
+ .editable-checklist label input[type="checkbox"],
86
82
  .editable-checklist label span {
87
83
  vertical-align: middle;
88
84
  margin: 0;
89
85
  }
90
86
 
91
87
  .editable-checklist label {
92
- white-space: nowrap;
88
+ white-space: nowrap;
93
89
  }
94
90
 
91
+ /* set exact width of textarea to fit buttons toolbar */
92
+ .editable-wysihtml5 {
93
+ width: 566px;
94
+ height: 250px;
95
+ }
96
+
97
+ /* clear button shown as link in date inputs */
95
98
  .editable-clear {
96
99
  clear: both;
97
100
  font-size: 0.9em;
98
101
  text-decoration: none;
99
102
  text-align: right;
100
103
  }
104
+
105
+ /* IOS-style clear button for text inputs */
106
+ .editable-clear-x {
107
+ background: image-url('clear.png') center center no-repeat;
108
+ display: block;
109
+ width: 13px;
110
+ height: 13px;
111
+ position: absolute;
112
+ opacity: 0.6;
113
+ z-index: 100;
114
+ }
115
+
116
+ .editable-clear-x:hover {
117
+ opacity: 1;
118
+ }
119
+
120
+ /*
121
+ .editable-clear-x1 {
122
+ background: image-url('clear.png') center center no-repeat;
123
+ display: inline-block;
124
+ zoom: 1;
125
+ *display: inline;
126
+ width: 13px;
127
+ height: 13px;
128
+ vertical-align: middle;
129
+ position: relative;
130
+ margin-left: -20px;
131
+ }
132
+ */
133
+
101
134
  .editable-container {
102
135
  max-width: none !important; /* without this rule poshytip/tooltip does not stretch */
103
- }
136
+ }
104
137
 
105
138
  .editable-container.popover {
106
139
  /* width: 300px;*/ /* debug */
@@ -108,38 +141,41 @@
108
141
  }
109
142
 
110
143
  .editable-container.editable-inline {
111
- /* display: inline; */ /* display: inline does not correctly work with show()/hide() in jquery <= 1.7.2 */
112
- display: inline-block;
144
+ display: inline-block;
113
145
  vertical-align: middle;
146
+ width: auto;
147
+ /* inline-block emulation for IE7*/
148
+ zoom: 1;
149
+ *display: inline;
114
150
  }
115
151
 
116
152
  .editable-container.ui-widget {
117
153
  font-size: inherit; /* jqueryui widget font 1.1em too big, overwrite it */
118
154
  }
119
- .editable-click,
120
- a.editable-click,
155
+ .editable-click,
156
+ a.editable-click,
121
157
  a.editable-click:hover {
122
158
  text-decoration: none;
123
159
  border-bottom: dashed 1px #0088cc;
124
160
  }
125
161
 
126
- .editable-click.editable-disabled,
127
- a.editable-click.editable-disabled,
162
+ .editable-click.editable-disabled,
163
+ a.editable-click.editable-disabled,
128
164
  a.editable-click.editable-disabled:hover {
129
- color: #585858;
165
+ color: #585858;
130
166
  cursor: default;
131
167
  border-bottom: none;
132
168
  }
133
169
 
134
170
  .editable-empty, .editable-empty:hover{
135
- font-style: italic;
136
- color: #DD1144;
171
+ font-style: italic;
172
+ color: #DD1144;
137
173
  border-bottom: none;
138
174
  text-decoration: none;
139
175
  }
140
176
 
141
177
  .editable-unsaved {
142
- font-weight: bold;
178
+ font-weight: bold;
143
179
  }
144
180
 
145
181
  .editable-unsaved:after {
@@ -162,22 +198,26 @@ a.editable-click.editable-disabled:hover {
162
198
  -webkit-border-radius: 4px;
163
199
  -moz-border-radius: 4px;
164
200
  border-radius: 4px;
201
+ direction: ltr;
165
202
  /*.dow {
166
203
  border-top: 1px solid #ddd !important;
167
204
  }*/
168
- }
169
205
 
206
+ }
170
207
  .datepicker-inline {
171
208
  width: 220px;
172
- /* height: 220px; */
173
209
  }
174
-
175
- .datepicker-float {
210
+ .datepicker.datepicker-rtl {
211
+ direction: rtl;
212
+ }
213
+ .datepicker.datepicker-rtl table tr td span {
214
+ float: right;
215
+ }
216
+ .datepicker-dropdown {
176
217
  top: 0;
177
218
  left: 0;
178
219
  }
179
-
180
- .datepicker-float:before {
220
+ .datepicker-dropdown:before {
181
221
  content: '';
182
222
  display: inline-block;
183
223
  border-left: 7px solid transparent;
@@ -188,7 +228,7 @@ a.editable-click.editable-disabled:hover {
188
228
  top: -7px;
189
229
  left: 6px;
190
230
  }
191
- .datepicker-float:after {
231
+ .datepicker-dropdown:after {
192
232
  content: '';
193
233
  display: inline-block;
194
234
  border-left: 6px solid transparent;
@@ -221,29 +261,31 @@ a.editable-click.editable-disabled:hover {
221
261
  -webkit-border-radius: 4px;
222
262
  -moz-border-radius: 4px;
223
263
  border-radius: 4px;
224
- /* vitalets: required to disable css inheritance when display inline inside table */
225
- border: none !important;
226
- background-color: transparent !important;
264
+ border: none;
227
265
  }
228
- .datepicker td.day:hover {
229
- background: #eeeeee !important; /* disable inheritance for inline */
266
+ .table-striped .datepicker table tr td,
267
+ .table-striped .datepicker table tr th {
268
+ background-color: transparent;
269
+ }
270
+ .datepicker table tr td.day:hover {
271
+ background: #eeeeee;
230
272
  cursor: pointer;
231
273
  }
232
- .datepicker td.old,
233
- .datepicker td.new {
274
+ .datepicker table tr td.old,
275
+ .datepicker table tr td.new {
234
276
  color: #999999;
235
277
  }
236
- .datepicker td.disabled,
237
- .datepicker td.disabled:hover {
278
+ .datepicker table tr td.disabled,
279
+ .datepicker table tr td.disabled:hover {
238
280
  background: none;
239
281
  color: #999999;
240
282
  cursor: default;
241
283
  }
242
- .datepicker td.today,
243
- .datepicker td.today:hover,
244
- .datepicker td.today.disabled,
245
- .datepicker td.today.disabled:hover {
246
- background-color: #fde19a !important; /* disable inheritance for inline */
284
+ .datepicker table tr td.today,
285
+ .datepicker table tr td.today:hover,
286
+ .datepicker table tr td.today.disabled,
287
+ .datepicker table tr td.today.disabled:hover {
288
+ background-color: #fde19a;
247
289
  background-image: -moz-linear-gradient(top, #fdd49a, #fdf59a);
248
290
  background-image: -ms-linear-gradient(top, #fdd49a, #fdf59a);
249
291
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fdd49a), to(#fdf59a));
@@ -254,45 +296,45 @@ a.editable-click.editable-disabled:hover {
254
296
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdd49a', endColorstr='#fdf59a', GradientType=0);
255
297
  border-color: #fdf59a #fdf59a #fbed50;
256
298
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
257
- filter: progid:dximagetransform.microsoft.gradient(enabled=false);
258
- }
259
- .datepicker td.today:hover,
260
- .datepicker td.today:hover:hover,
261
- .datepicker td.today.disabled:hover,
262
- .datepicker td.today.disabled:hover:hover,
263
- .datepicker td.today:active,
264
- .datepicker td.today:hover:active,
265
- .datepicker td.today.disabled:active,
266
- .datepicker td.today.disabled:hover:active,
267
- .datepicker td.today.active,
268
- .datepicker td.today:hover.active,
269
- .datepicker td.today.disabled.active,
270
- .datepicker td.today.disabled:hover.active,
271
- .datepicker td.today.disabled,
272
- .datepicker td.today:hover.disabled,
273
- .datepicker td.today.disabled.disabled,
274
- .datepicker td.today.disabled:hover.disabled,
275
- .datepicker td.today[disabled],
276
- .datepicker td.today:hover[disabled],
277
- .datepicker td.today.disabled[disabled],
278
- .datepicker td.today.disabled:hover[disabled] {
279
- background-color: #fdf59a !important; /* disable inheritance for inline */
280
- }
281
- .datepicker td.today:active,
282
- .datepicker td.today:hover:active,
283
- .datepicker td.today.disabled:active,
284
- .datepicker td.today.disabled:hover:active,
285
- .datepicker td.today.active,
286
- .datepicker td.today:hover.active,
287
- .datepicker td.today.disabled.active,
288
- .datepicker td.today.disabled:hover.active {
299
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
300
+ }
301
+ .datepicker table tr td.today:hover,
302
+ .datepicker table tr td.today:hover:hover,
303
+ .datepicker table tr td.today.disabled:hover,
304
+ .datepicker table tr td.today.disabled:hover:hover,
305
+ .datepicker table tr td.today:active,
306
+ .datepicker table tr td.today:hover:active,
307
+ .datepicker table tr td.today.disabled:active,
308
+ .datepicker table tr td.today.disabled:hover:active,
309
+ .datepicker table tr td.today.active,
310
+ .datepicker table tr td.today:hover.active,
311
+ .datepicker table tr td.today.disabled.active,
312
+ .datepicker table tr td.today.disabled:hover.active,
313
+ .datepicker table tr td.today.disabled,
314
+ .datepicker table tr td.today:hover.disabled,
315
+ .datepicker table tr td.today.disabled.disabled,
316
+ .datepicker table tr td.today.disabled:hover.disabled,
317
+ .datepicker table tr td.today[disabled],
318
+ .datepicker table tr td.today:hover[disabled],
319
+ .datepicker table tr td.today.disabled[disabled],
320
+ .datepicker table tr td.today.disabled:hover[disabled] {
321
+ background-color: #fdf59a;
322
+ }
323
+ .datepicker table tr td.today:active,
324
+ .datepicker table tr td.today:hover:active,
325
+ .datepicker table tr td.today.disabled:active,
326
+ .datepicker table tr td.today.disabled:hover:active,
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 {
289
331
  background-color: #fbf069 \9;
290
332
  }
291
- .datepicker td.active,
292
- .datepicker td.active:hover,
293
- .datepicker td.active.disabled,
294
- .datepicker td.active.disabled:hover {
295
- background-color: #006dcc !important; /* disable inheritance for inline */
333
+ .datepicker table tr td.active,
334
+ .datepicker table tr td.active:hover,
335
+ .datepicker table tr td.active.disabled,
336
+ .datepicker table tr td.active.disabled:hover {
337
+ background-color: #006dcc;
296
338
  background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
297
339
  background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
298
340
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
@@ -303,43 +345,43 @@ a.editable-click.editable-disabled:hover {
303
345
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
304
346
  border-color: #0044cc #0044cc #002a80;
305
347
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
306
- filter: progid:dximagetransform.microsoft.gradient(enabled=false);
348
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
307
349
  color: #fff;
308
350
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
309
351
  }
310
- .datepicker td.active:hover,
311
- .datepicker td.active:hover:hover,
312
- .datepicker td.active.disabled:hover,
313
- .datepicker td.active.disabled:hover:hover,
314
- .datepicker td.active:active,
315
- .datepicker td.active:hover:active,
316
- .datepicker td.active.disabled:active,
317
- .datepicker td.active.disabled:hover:active,
318
- .datepicker td.active.active,
319
- .datepicker td.active:hover.active,
320
- .datepicker td.active.disabled.active,
321
- .datepicker td.active.disabled:hover.active,
322
- .datepicker td.active.disabled,
323
- .datepicker td.active:hover.disabled,
324
- .datepicker td.active.disabled.disabled,
325
- .datepicker td.active.disabled:hover.disabled,
326
- .datepicker td.active[disabled],
327
- .datepicker td.active:hover[disabled],
328
- .datepicker td.active.disabled[disabled],
329
- .datepicker td.active.disabled:hover[disabled] {
352
+ .datepicker table tr td.active:hover,
353
+ .datepicker table tr td.active:hover:hover,
354
+ .datepicker table tr td.active.disabled:hover,
355
+ .datepicker table tr td.active.disabled:hover:hover,
356
+ .datepicker table tr td.active:active,
357
+ .datepicker table tr td.active:hover:active,
358
+ .datepicker table tr td.active.disabled:active,
359
+ .datepicker table tr td.active.disabled:hover:active,
360
+ .datepicker table tr td.active.active,
361
+ .datepicker table tr td.active:hover.active,
362
+ .datepicker table tr td.active.disabled.active,
363
+ .datepicker table tr td.active.disabled:hover.active,
364
+ .datepicker table tr td.active.disabled,
365
+ .datepicker table tr td.active:hover.disabled,
366
+ .datepicker table tr td.active.disabled.disabled,
367
+ .datepicker table tr td.active.disabled:hover.disabled,
368
+ .datepicker table tr td.active[disabled],
369
+ .datepicker table tr td.active:hover[disabled],
370
+ .datepicker table tr td.active.disabled[disabled],
371
+ .datepicker table tr td.active.disabled:hover[disabled] {
330
372
  background-color: #0044cc;
331
373
  }
332
- .datepicker td.active:active,
333
- .datepicker td.active:hover:active,
334
- .datepicker td.active.disabled:active,
335
- .datepicker td.active.disabled:hover:active,
336
- .datepicker td.active.active,
337
- .datepicker td.active:hover.active,
338
- .datepicker td.active.disabled.active,
339
- .datepicker td.active.disabled:hover.active {
374
+ .datepicker table tr td.active:active,
375
+ .datepicker table tr td.active:hover:active,
376
+ .datepicker table tr td.active.disabled:active,
377
+ .datepicker table tr td.active.disabled:hover:active,
378
+ .datepicker table tr td.active.active,
379
+ .datepicker table tr td.active:hover.active,
380
+ .datepicker table tr td.active.disabled.active,
381
+ .datepicker table tr td.active.disabled:hover.active {
340
382
  background-color: #003399 \9;
341
383
  }
342
- .datepicker td span {
384
+ .datepicker table tr td span {
343
385
  display: block;
344
386
  width: 23%;
345
387
  height: 54px;
@@ -351,19 +393,19 @@ a.editable-click.editable-disabled:hover {
351
393
  -moz-border-radius: 4px;
352
394
  border-radius: 4px;
353
395
  }
354
- .datepicker td span:hover {
396
+ .datepicker table tr td span:hover {
355
397
  background: #eeeeee;
356
398
  }
357
- .datepicker td span.disabled,
358
- .datepicker td span.disabled:hover {
399
+ .datepicker table tr td span.disabled,
400
+ .datepicker table tr td span.disabled:hover {
359
401
  background: none;
360
402
  color: #999999;
361
403
  cursor: default;
362
404
  }
363
- .datepicker td span.active,
364
- .datepicker td span.active:hover,
365
- .datepicker td span.active.disabled,
366
- .datepicker td span.active.disabled:hover {
405
+ .datepicker table tr td span.active,
406
+ .datepicker table tr td span.active:hover,
407
+ .datepicker table tr td span.active.disabled,
408
+ .datepicker table tr td span.active.disabled:hover {
367
409
  background-color: #006dcc;
368
410
  background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
369
411
  background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
@@ -375,43 +417,43 @@ a.editable-click.editable-disabled:hover {
375
417
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
376
418
  border-color: #0044cc #0044cc #002a80;
377
419
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
378
- filter: progid:dximagetransform.microsoft.gradient(enabled=false);
420
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
379
421
  color: #fff;
380
422
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
381
423
  }
382
- .datepicker td span.active:hover,
383
- .datepicker td span.active:hover:hover,
384
- .datepicker td span.active.disabled:hover,
385
- .datepicker td span.active.disabled:hover:hover,
386
- .datepicker td span.active:active,
387
- .datepicker td span.active:hover:active,
388
- .datepicker td span.active.disabled:active,
389
- .datepicker td span.active.disabled:hover:active,
390
- .datepicker td span.active.active,
391
- .datepicker td span.active:hover.active,
392
- .datepicker td span.active.disabled.active,
393
- .datepicker td span.active.disabled:hover.active,
394
- .datepicker td span.active.disabled,
395
- .datepicker td span.active:hover.disabled,
396
- .datepicker td span.active.disabled.disabled,
397
- .datepicker td span.active.disabled:hover.disabled,
398
- .datepicker td span.active[disabled],
399
- .datepicker td span.active:hover[disabled],
400
- .datepicker td span.active.disabled[disabled],
401
- .datepicker td span.active.disabled:hover[disabled] {
424
+ .datepicker table tr td span.active:hover,
425
+ .datepicker table tr td span.active:hover:hover,
426
+ .datepicker table tr td span.active.disabled:hover,
427
+ .datepicker table tr td span.active.disabled:hover:hover,
428
+ .datepicker table tr td span.active:active,
429
+ .datepicker table tr td span.active:hover:active,
430
+ .datepicker table tr td span.active.disabled:active,
431
+ .datepicker table tr td span.active.disabled:hover:active,
432
+ .datepicker table tr td span.active.active,
433
+ .datepicker table tr td span.active:hover.active,
434
+ .datepicker table tr td span.active.disabled.active,
435
+ .datepicker table tr td span.active.disabled:hover.active,
436
+ .datepicker table tr td span.active.disabled,
437
+ .datepicker table tr td span.active:hover.disabled,
438
+ .datepicker table tr td span.active.disabled.disabled,
439
+ .datepicker table tr td span.active.disabled:hover.disabled,
440
+ .datepicker table tr td span.active[disabled],
441
+ .datepicker table tr td span.active:hover[disabled],
442
+ .datepicker table tr td span.active.disabled[disabled],
443
+ .datepicker table tr td span.active.disabled:hover[disabled] {
402
444
  background-color: #0044cc;
403
445
  }
404
- .datepicker td span.active:active,
405
- .datepicker td span.active:hover:active,
406
- .datepicker td span.active.disabled:active,
407
- .datepicker td span.active.disabled:hover:active,
408
- .datepicker td span.active.active,
409
- .datepicker td span.active:hover.active,
410
- .datepicker td span.active.disabled.active,
411
- .datepicker td span.active.disabled:hover.active {
446
+ .datepicker table tr td span.active:active,
447
+ .datepicker table tr td span.active:hover:active,
448
+ .datepicker table tr td span.active.disabled:active,
449
+ .datepicker table tr td span.active.disabled:hover:active,
450
+ .datepicker table tr td span.active.active,
451
+ .datepicker table tr td span.active:hover.active,
452
+ .datepicker table tr td span.active.disabled.active,
453
+ .datepicker table tr td span.active.disabled:hover.active {
412
454
  background-color: #003399 \9;
413
455
  }
414
- .datepicker td span.old {
456
+ .datepicker table tr td span.old {
415
457
  color: #999999;
416
458
  }
417
459
  .datepicker th.switch {