bootstrap-x-editable-rails 1.3.0 → 1.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -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 {