jquery-minicolors-rails 0.0.4 → 2.1.1
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.
- data/README.md +23 -19
- data/lib/jquery-minicolors-rails/version.rb +1 -1
- data/vendor/assets/images/{jquery-minicolors/jquery.minicolors.png → jquery.minicolors.png} +0 -0
- data/vendor/assets/javascripts/{jquery-minicolors.js → jquery.minicolors.js} +72 -82
- data/vendor/assets/javascripts/{jquery-minicolors-simple_form.js → jquery.minicolors.simple_form.js} +0 -0
- data/vendor/assets/stylesheets/jquery.minicolors.css.erb +245 -0
- metadata +28 -28
- data/vendor/assets/stylesheets/jquery-minicolors.css.erb +0 -278
data/README.md
CHANGED
@@ -1,17 +1,18 @@
|
|
1
1
|
# jQuery colorpicker for Rails
|
2
2
|
|
3
|
+
[](http://badge.fury.io/rb/jquery-minicolors-rails)
|
3
4
|
[](https://travis-ci.org/kostia/jquery-minicolors-rails)
|
4
5
|
[](https://codeclimate.com/github/kostia/jquery-minicolors-rails)
|
5
6
|
|
6
|
-
This gem
|
7
|
+
This gem embeddes the jQuery colorpicker in the Rails asset pipeline.
|
7
8
|
|
8
9
|

|
9
10
|
|
10
|
-
See
|
11
|
+
See http://labs.abeautifulsite.net/jquery-minicolors/
|
11
12
|
|
12
13
|
## Installation
|
13
14
|
|
14
|
-
Add to `Gemfile` run `bundle install`:
|
15
|
+
Add to `Gemfile` and run `bundle install`:
|
15
16
|
|
16
17
|
```ruby
|
17
18
|
# Gemfile
|
@@ -22,33 +23,39 @@ Add to `app/assets/javascripts/application.js`:
|
|
22
23
|
|
23
24
|
```javascript
|
24
25
|
//= require jquery # Not included
|
25
|
-
//= require jquery
|
26
|
+
//= require jquery.minicolors
|
26
27
|
```
|
27
28
|
|
28
29
|
Add to `app/assets/stylesheets/application.css`:
|
29
30
|
|
30
31
|
```css
|
31
32
|
/*
|
32
|
-
*= require jquery
|
33
|
+
*= require jquery.minicolors
|
33
34
|
*/
|
34
35
|
```
|
35
36
|
|
36
37
|
# Usage
|
37
38
|
|
38
|
-
Just call `
|
39
|
+
Just call `minicolors()` with any text-input selector:
|
39
40
|
|
40
41
|
```coffeescript
|
41
|
-
|
42
|
-
|
43
|
-
$('input[type=text]').minicolors();
|
42
|
+
# With default options:
|
43
|
+
$ -> $('input[type=text]').minicolors()
|
44
44
|
|
45
|
-
|
46
|
-
|
47
|
-
$('input[type=text]').minicolors({theme: 'bootstrap'});
|
45
|
+
# With Bootstrap theme (Bootstrap-3 is supported):
|
46
|
+
$ -> $('input[type=text]').minicolors theme: 'bootstrap'
|
48
47
|
```
|
49
48
|
|
50
49
|
# With SimpleForm
|
51
50
|
|
51
|
+
Add to `app/assets/javascripts/application.js`:
|
52
|
+
|
53
|
+
```javascript
|
54
|
+
//= require jquery # Not included
|
55
|
+
//= require jquery.minicolors
|
56
|
+
//= require jquery.minicolors.simple_form
|
57
|
+
```
|
58
|
+
|
52
59
|
See https://github.com/plataformatec/simple_form
|
53
60
|
|
54
61
|
```erb
|
@@ -62,17 +69,14 @@ See https://github.com/plataformatec/simple_form
|
|
62
69
|
<%# With Bootstrap theme and swatch on the right: %>
|
63
70
|
<%= simple_form_for @balloon do |f| %>
|
64
71
|
<%= f.input :color, as: :minicolors, input_html: {data: {
|
65
|
-
minicolors: {theme: :bootstrap,
|
72
|
+
minicolors: {theme: :bootstrap, position: :right}}} %>
|
66
73
|
<% end %>
|
67
74
|
```
|
68
75
|
|
69
|
-
|
76
|
+
## Versioning
|
70
77
|
|
71
|
-
|
72
|
-
|
73
|
-
//= require jquery-minicolors
|
74
|
-
//= require jquery-minicolors-simple_form
|
75
|
-
```
|
78
|
+
Gem has the same version as the vendored minicolors library.
|
79
|
+
See https://github.com/claviska/jquery-minicolors.
|
76
80
|
|
77
81
|
## MIT-License
|
78
82
|
|
File without changes
|
@@ -3,16 +3,15 @@
|
|
3
3
|
*
|
4
4
|
* Copyright Cory LaViska for A Beautiful Site, LLC. (http://www.abeautifulsite.net/)
|
5
5
|
*
|
6
|
-
*
|
6
|
+
* Licensed under the MIT license: http://opensource.org/licenses/MIT
|
7
7
|
*
|
8
|
-
*/
|
8
|
+
*/
|
9
9
|
if(jQuery) (function($) {
|
10
10
|
|
11
|
-
//
|
11
|
+
// Defaults
|
12
12
|
$.minicolors = {
|
13
|
-
|
14
|
-
|
15
|
-
animationSpeed: 100,
|
13
|
+
defaults: {
|
14
|
+
animationSpeed: 50,
|
16
15
|
animationEasing: 'swing',
|
17
16
|
change: null,
|
18
17
|
changeDelay: 0,
|
@@ -23,11 +22,9 @@ if(jQuery) (function($) {
|
|
23
22
|
inline: false,
|
24
23
|
letterCase: 'lowercase',
|
25
24
|
opacity: false,
|
26
|
-
position: '
|
25
|
+
position: 'bottom left',
|
27
26
|
show: null,
|
28
27
|
showSpeed: 100,
|
29
|
-
swatchPosition: 'left',
|
30
|
-
textfield: true,
|
31
28
|
theme: 'default'
|
32
29
|
}
|
33
30
|
};
|
@@ -52,16 +49,17 @@ if(jQuery) (function($) {
|
|
52
49
|
|
53
50
|
// Get/set opacity
|
54
51
|
case 'opacity':
|
52
|
+
// Getter
|
55
53
|
if( data === undefined ) {
|
56
54
|
// Getter
|
57
55
|
return $(this).attr('data-opacity');
|
58
56
|
} else {
|
59
57
|
// Setter
|
60
58
|
$(this).each( function() {
|
61
|
-
|
59
|
+
updateFromInput($(this).attr('data-opacity', data));
|
62
60
|
});
|
63
|
-
return $(this);
|
64
61
|
}
|
62
|
+
return $(this);
|
65
63
|
|
66
64
|
// Get an RGB(A) object based on the current color/opacity
|
67
65
|
case 'rgbObject':
|
@@ -70,7 +68,7 @@ if(jQuery) (function($) {
|
|
70
68
|
// Get an RGB(A) string based on the current color/opacity
|
71
69
|
case 'rgbString':
|
72
70
|
case 'rgbaString':
|
73
|
-
return rgbString($(this), method === 'rgbaString')
|
71
|
+
return rgbString($(this), method === 'rgbaString');
|
74
72
|
|
75
73
|
// Get/set settings on the fly
|
76
74
|
case 'settings':
|
@@ -83,8 +81,8 @@ if(jQuery) (function($) {
|
|
83
81
|
destroy($(this));
|
84
82
|
$(this).minicolors($.extend(true, settings, data));
|
85
83
|
});
|
86
|
-
return $(this);
|
87
84
|
}
|
85
|
+
return $(this);
|
88
86
|
|
89
87
|
// Show the color picker
|
90
88
|
case 'show':
|
@@ -99,13 +97,12 @@ if(jQuery) (function($) {
|
|
99
97
|
} else {
|
100
98
|
// Setter
|
101
99
|
$(this).each( function() {
|
102
|
-
|
100
|
+
updateFromInput($(this).val(data));
|
103
101
|
});
|
104
|
-
return $(this);
|
105
102
|
}
|
103
|
+
return $(this);
|
106
104
|
|
107
105
|
// Initializes the control
|
108
|
-
case 'create':
|
109
106
|
default:
|
110
107
|
if( method !== 'create' ) data = method;
|
111
108
|
$(this).each( function() {
|
@@ -121,20 +118,18 @@ if(jQuery) (function($) {
|
|
121
118
|
// Initialize input elements
|
122
119
|
function init(input, settings) {
|
123
120
|
|
124
|
-
var minicolors = $('<
|
125
|
-
|
121
|
+
var minicolors = $('<div class="minicolors" />'),
|
122
|
+
defaults = $.minicolors.defaults;
|
126
123
|
|
127
124
|
// Do nothing if already initialized
|
128
125
|
if( input.data('minicolors-initialized') ) return;
|
129
126
|
|
130
127
|
// Handle settings
|
131
|
-
settings = $.extend(true, {},
|
128
|
+
settings = $.extend(true, {}, defaults, settings);
|
132
129
|
|
133
130
|
// The wrapper
|
134
131
|
minicolors
|
135
132
|
.addClass('minicolors-theme-' + settings.theme)
|
136
|
-
.addClass('minicolors-swatch-position-' + settings.swatchPosition)
|
137
|
-
.toggleClass('minicolors-swatch-left', settings.swatchPosition === 'left')
|
138
133
|
.toggleClass('minicolors-with-opacity', settings.opacity);
|
139
134
|
|
140
135
|
// Custom positioning
|
@@ -147,45 +142,43 @@ if(jQuery) (function($) {
|
|
147
142
|
// The input
|
148
143
|
input
|
149
144
|
.addClass('minicolors-input')
|
150
|
-
.data('minicolors-initialized',
|
145
|
+
.data('minicolors-initialized', false)
|
151
146
|
.data('minicolors-settings', settings)
|
152
147
|
.prop('size', 7)
|
153
|
-
.prop('maxlength', 7)
|
154
148
|
.wrap(minicolors)
|
155
149
|
.after(
|
156
|
-
'<
|
157
|
-
'<
|
158
|
-
'<
|
159
|
-
'</
|
160
|
-
'<
|
161
|
-
'<
|
162
|
-
'</
|
163
|
-
'<
|
164
|
-
'<
|
165
|
-
'<
|
166
|
-
'</
|
167
|
-
'</
|
150
|
+
'<div class="minicolors-panel minicolors-slider-' + settings.control + '">' +
|
151
|
+
'<div class="minicolors-slider">' +
|
152
|
+
'<div class="minicolors-picker"></div>' +
|
153
|
+
'</div>' +
|
154
|
+
'<div class="minicolors-opacity-slider">' +
|
155
|
+
'<div class="minicolors-picker"></div>' +
|
156
|
+
'</div>' +
|
157
|
+
'<div class="minicolors-grid">' +
|
158
|
+
'<div class="minicolors-grid-inner"></div>' +
|
159
|
+
'<div class="minicolors-picker"><div></div></div>' +
|
160
|
+
'</div>' +
|
161
|
+
'</div>'
|
168
162
|
);
|
169
163
|
|
170
|
-
//
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
} else {
|
178
|
-
// Right
|
179
|
-
input.after('<span class="minicolors-swatch"><span></span></span>');
|
164
|
+
// The swatch
|
165
|
+
if( !settings.inline ) {
|
166
|
+
input.after('<span class="minicolors-swatch"><span class="minicolors-swatch-color"></span></span>');
|
167
|
+
input.next('.minicolors-swatch').on('click', function(event) {
|
168
|
+
event.preventDefault();
|
169
|
+
input.focus();
|
170
|
+
});
|
180
171
|
}
|
181
172
|
|
182
|
-
//
|
183
|
-
|
173
|
+
// Prevent text selection in IE
|
174
|
+
input.parent().find('.minicolors-panel').on('selectstart', function() { return false; }).end();
|
184
175
|
|
185
176
|
// Inline controls
|
186
177
|
if( settings.inline ) input.parent().addClass('minicolors-inline');
|
187
178
|
|
188
|
-
updateFromInput(input, false
|
179
|
+
updateFromInput(input, false);
|
180
|
+
|
181
|
+
input.data('minicolors-initialized', true);
|
189
182
|
|
190
183
|
}
|
191
184
|
|
@@ -199,7 +192,6 @@ if(jQuery) (function($) {
|
|
199
192
|
.removeData('minicolors-initialized')
|
200
193
|
.removeData('minicolors-settings')
|
201
194
|
.removeProp('size')
|
202
|
-
.removeProp('maxlength')
|
203
195
|
.removeClass('minicolors-input');
|
204
196
|
|
205
197
|
// Remove the wrap and destroy whatever remains
|
@@ -207,11 +199,6 @@ if(jQuery) (function($) {
|
|
207
199
|
|
208
200
|
}
|
209
201
|
|
210
|
-
// Refresh the specified control
|
211
|
-
function refresh(input) {
|
212
|
-
updateFromInput(input);
|
213
|
-
}
|
214
|
-
|
215
202
|
// Shows the specified dropdown panel
|
216
203
|
function show(input) {
|
217
204
|
|
@@ -340,7 +327,7 @@ if(jQuery) (function($) {
|
|
340
327
|
|
341
328
|
}
|
342
329
|
|
343
|
-
var hue, saturation, brightness,
|
330
|
+
var hue, saturation, brightness, x, y, r, phi,
|
344
331
|
|
345
332
|
hex = input.val(),
|
346
333
|
opacity = input.attr('data-opacity'),
|
@@ -348,7 +335,6 @@ if(jQuery) (function($) {
|
|
348
335
|
// Helpful references
|
349
336
|
minicolors = input.parent(),
|
350
337
|
settings = input.data('minicolors-settings'),
|
351
|
-
panel = minicolors.find('.minicolors-panel'),
|
352
338
|
swatch = minicolors.find('.minicolors-swatch'),
|
353
339
|
|
354
340
|
// Panel objects
|
@@ -399,7 +385,7 @@ if(jQuery) (function($) {
|
|
399
385
|
|
400
386
|
case 'saturation':
|
401
387
|
// Calculate hue, saturation, and brightness
|
402
|
-
hue = keepWithin(parseInt(gridPos.x * (360 / grid.width())), 0, 360);
|
388
|
+
hue = keepWithin(parseInt(gridPos.x * (360 / grid.width()), 10), 0, 360);
|
403
389
|
saturation = keepWithin(100 - Math.floor(sliderPos.y * (100 / slider.height())), 0, 100);
|
404
390
|
brightness = keepWithin(100 - Math.floor(gridPos.y * (100 / grid.height())), 0, 100);
|
405
391
|
hex = hsb2hex({
|
@@ -415,7 +401,7 @@ if(jQuery) (function($) {
|
|
415
401
|
|
416
402
|
case 'brightness':
|
417
403
|
// Calculate hue, saturation, and brightness
|
418
|
-
hue = keepWithin(parseInt(gridPos.x * (360 / grid.width())), 0, 360);
|
404
|
+
hue = keepWithin(parseInt(gridPos.x * (360 / grid.width()), 10), 0, 360);
|
419
405
|
saturation = keepWithin(100 - Math.floor(gridPos.y * (100 / grid.height())), 0, 100);
|
420
406
|
brightness = keepWithin(100 - Math.floor(sliderPos.y * (100 / slider.height())), 0, 100);
|
421
407
|
hex = hsb2hex({
|
@@ -431,7 +417,7 @@ if(jQuery) (function($) {
|
|
431
417
|
|
432
418
|
default:
|
433
419
|
// Calculate hue, saturation, and brightness
|
434
|
-
hue = keepWithin(360 - parseInt(sliderPos.y * (360 / slider.height())), 0, 360);
|
420
|
+
hue = keepWithin(360 - parseInt(sliderPos.y * (360 / slider.height()), 10), 0, 360);
|
435
421
|
saturation = keepWithin(Math.floor(gridPos.x * (100 / grid.width())), 0, 100);
|
436
422
|
brightness = keepWithin(100 - Math.floor(gridPos.y * (100 / grid.height())), 0, 100);
|
437
423
|
hex = hsb2hex({
|
@@ -447,8 +433,8 @@ if(jQuery) (function($) {
|
|
447
433
|
}
|
448
434
|
|
449
435
|
// Adjust case
|
450
|
-
|
451
|
-
|
436
|
+
input.val( convertCase(hex, settings.letterCase) );
|
437
|
+
|
452
438
|
}
|
453
439
|
|
454
440
|
// Handle opacity
|
@@ -473,7 +459,7 @@ if(jQuery) (function($) {
|
|
473
459
|
}
|
474
460
|
|
475
461
|
// Sets the color picker values from the input
|
476
|
-
function updateFromInput(input, preserveInputValue
|
462
|
+
function updateFromInput(input, preserveInputValue) {
|
477
463
|
|
478
464
|
var hex,
|
479
465
|
hsb,
|
@@ -497,7 +483,9 @@ if(jQuery) (function($) {
|
|
497
483
|
|
498
484
|
// Determine hex/HSB values
|
499
485
|
hex = convertCase(parseHex(input.val(), true), settings.letterCase);
|
500
|
-
if( !hex )
|
486
|
+
if( !hex ){
|
487
|
+
hex = convertCase(parseHex(settings.defaultValue, true), settings.letterCase);
|
488
|
+
}
|
501
489
|
hsb = hex2hsb(hex);
|
502
490
|
|
503
491
|
// Update input value
|
@@ -558,7 +546,6 @@ if(jQuery) (function($) {
|
|
558
546
|
// Update UI
|
559
547
|
slider.css('backgroundColor', hsb2hex({ h: hsb.h, s: 100, b: hsb.b }));
|
560
548
|
minicolors.find('.minicolors-grid-inner').css('opacity', hsb.s / 100);
|
561
|
-
|
562
549
|
break;
|
563
550
|
|
564
551
|
case 'brightness':
|
@@ -598,21 +585,27 @@ if(jQuery) (function($) {
|
|
598
585
|
|
599
586
|
}
|
600
587
|
|
601
|
-
//
|
602
|
-
if(
|
588
|
+
// Fire change event, but only if minicolors is fully initialized
|
589
|
+
if( input.data('minicolors-initialized') ) {
|
590
|
+
doChange(input, hex, opacity);
|
591
|
+
}
|
603
592
|
|
604
593
|
}
|
605
594
|
|
606
595
|
// Runs the change and changeDelay callbacks
|
607
596
|
function doChange(input, hex, opacity) {
|
608
597
|
|
609
|
-
var settings = input.data('minicolors-settings')
|
598
|
+
var settings = input.data('minicolors-settings'),
|
599
|
+
lastChange = input.data('minicolors-lastChange');
|
610
600
|
|
611
601
|
// Only run if it actually changed
|
612
|
-
if( hex
|
602
|
+
if( !lastChange || lastChange.hex !== hex || lastChange.opacity !== opacity ) {
|
613
603
|
|
614
604
|
// Remember last-changed value
|
615
|
-
input.data('minicolors-lastChange',
|
605
|
+
input.data('minicolors-lastChange', {
|
606
|
+
hex: hex,
|
607
|
+
opacity: opacity
|
608
|
+
});
|
616
609
|
|
617
610
|
// Fire change event
|
618
611
|
if( settings.change ) {
|
@@ -627,7 +620,7 @@ if(jQuery) (function($) {
|
|
627
620
|
settings.change.call(input.get(0), hex, opacity);
|
628
621
|
}
|
629
622
|
}
|
630
|
-
|
623
|
+
input.trigger('change').trigger('input');
|
631
624
|
}
|
632
625
|
|
633
626
|
}
|
@@ -793,24 +786,20 @@ if(jQuery) (function($) {
|
|
793
786
|
.on('mouseup.minicolors touchend.minicolors', function() {
|
794
787
|
$(this).removeData('minicolors-target');
|
795
788
|
})
|
796
|
-
//
|
789
|
+
// Show panel when swatch is clicked
|
797
790
|
.on('mousedown.minicolors touchstart.minicolors', '.minicolors-swatch', function(event) {
|
798
|
-
var input = $(this).parent().find('.minicolors-input')
|
799
|
-
|
800
|
-
|
801
|
-
hide(input);
|
802
|
-
} else {
|
803
|
-
show(input);
|
804
|
-
}
|
791
|
+
var input = $(this).parent().find('.minicolors-input');
|
792
|
+
event.preventDefault();
|
793
|
+
show(input);
|
805
794
|
})
|
806
795
|
// Show on focus
|
807
|
-
.on('focus.minicolors', '.minicolors-input', function(
|
796
|
+
.on('focus.minicolors', '.minicolors-input', function() {
|
808
797
|
var input = $(this);
|
809
798
|
if( !input.data('minicolors-initialized') ) return;
|
810
799
|
show(input);
|
811
800
|
})
|
812
801
|
// Fix hex on blur
|
813
|
-
.on('blur.minicolors', '.minicolors-input', function(
|
802
|
+
.on('blur.minicolors', '.minicolors-input', function() {
|
814
803
|
var input = $(this),
|
815
804
|
settings = input.data('minicolors-settings');
|
816
805
|
if( !input.data('minicolors-initialized') ) return;
|
@@ -833,6 +822,7 @@ if(jQuery) (function($) {
|
|
833
822
|
case 9: // tab
|
834
823
|
hide();
|
835
824
|
break;
|
825
|
+
case 13: // enter
|
836
826
|
case 27: // esc
|
837
827
|
hide();
|
838
828
|
input.blur();
|
@@ -840,13 +830,13 @@ if(jQuery) (function($) {
|
|
840
830
|
}
|
841
831
|
})
|
842
832
|
// Update on keyup
|
843
|
-
.on('keyup.minicolors', '.minicolors-input', function(
|
833
|
+
.on('keyup.minicolors', '.minicolors-input', function() {
|
844
834
|
var input = $(this);
|
845
835
|
if( !input.data('minicolors-initialized') ) return;
|
846
836
|
updateFromInput(input, true);
|
847
837
|
})
|
848
838
|
// Update on paste
|
849
|
-
.on('paste.minicolors', '.minicolors-input', function(
|
839
|
+
.on('paste.minicolors', '.minicolors-input', function() {
|
850
840
|
var input = $(this);
|
851
841
|
if( !input.data('minicolors-initialized') ) return;
|
852
842
|
setTimeout( function() {
|
data/vendor/assets/javascripts/{jquery-minicolors-simple_form.js → jquery.minicolors.simple_form.js}
RENAMED
File without changes
|
@@ -0,0 +1,245 @@
|
|
1
|
+
.minicolors {
|
2
|
+
position: relative;
|
3
|
+
}
|
4
|
+
|
5
|
+
.minicolors-swatch {
|
6
|
+
position: absolute;
|
7
|
+
vertical-align: middle;
|
8
|
+
background: url(<%= image_path 'jquery.minicolors.png' %>) -80px 0;
|
9
|
+
border: solid 1px #ccc;
|
10
|
+
cursor: text;
|
11
|
+
padding: 0;
|
12
|
+
margin: 0;
|
13
|
+
display: inline-block;
|
14
|
+
}
|
15
|
+
|
16
|
+
.minicolors-swatch-color {
|
17
|
+
position: absolute;
|
18
|
+
top: 0;
|
19
|
+
left: 0;
|
20
|
+
right: 0;
|
21
|
+
bottom: 0;
|
22
|
+
}
|
23
|
+
|
24
|
+
.minicolors input[type=hidden] + .minicolors-swatch {
|
25
|
+
width: 28px;
|
26
|
+
position: static;
|
27
|
+
cursor: pointer;
|
28
|
+
}
|
29
|
+
|
30
|
+
/* Panel */
|
31
|
+
.minicolors-panel {
|
32
|
+
position: absolute;
|
33
|
+
width: 173px;
|
34
|
+
height: 152px;
|
35
|
+
background: white;
|
36
|
+
border: solid 1px #CCC;
|
37
|
+
box-shadow: 0 0 20px rgba(0, 0, 0, .2);
|
38
|
+
z-index: 99999;
|
39
|
+
-moz-box-sizing: content-box;
|
40
|
+
-webkit-box-sizing: content-box;
|
41
|
+
box-sizing: content-box;
|
42
|
+
display: none;
|
43
|
+
}
|
44
|
+
|
45
|
+
.minicolors-panel.minicolors-visible {
|
46
|
+
display: block;
|
47
|
+
}
|
48
|
+
|
49
|
+
/* Panel positioning */
|
50
|
+
.minicolors-position-top .minicolors-panel {
|
51
|
+
top: -154px;
|
52
|
+
}
|
53
|
+
|
54
|
+
.minicolors-position-right .minicolors-panel {
|
55
|
+
right: 0;
|
56
|
+
}
|
57
|
+
|
58
|
+
.minicolors-position-bottom .minicolors-panel {
|
59
|
+
top: auto;
|
60
|
+
}
|
61
|
+
|
62
|
+
.minicolors-position-left .minicolors-panel {
|
63
|
+
left: 0;
|
64
|
+
}
|
65
|
+
|
66
|
+
.minicolors-with-opacity .minicolors-panel {
|
67
|
+
width: 194px;
|
68
|
+
}
|
69
|
+
|
70
|
+
.minicolors .minicolors-grid {
|
71
|
+
position: absolute;
|
72
|
+
top: 1px;
|
73
|
+
left: 1px;
|
74
|
+
width: 150px;
|
75
|
+
height: 150px;
|
76
|
+
background: url(<%= image_path 'jquery.minicolors.png' %>) -120px 0;
|
77
|
+
cursor: crosshair;
|
78
|
+
}
|
79
|
+
|
80
|
+
.minicolors .minicolors-grid-inner {
|
81
|
+
position: absolute;
|
82
|
+
top: 0;
|
83
|
+
left: 0;
|
84
|
+
width: 150px;
|
85
|
+
height: 150px;
|
86
|
+
background: none;
|
87
|
+
}
|
88
|
+
|
89
|
+
.minicolors-slider-saturation .minicolors-grid {
|
90
|
+
background-position: -420px 0;
|
91
|
+
}
|
92
|
+
|
93
|
+
.minicolors-slider-saturation .minicolors-grid-inner {
|
94
|
+
background: url(<%= image_path 'jquery.minicolors.png' %>) -270px 0;
|
95
|
+
}
|
96
|
+
|
97
|
+
.minicolors-slider-brightness .minicolors-grid {
|
98
|
+
background-position: -570px 0;
|
99
|
+
}
|
100
|
+
|
101
|
+
.minicolors-slider-brightness .minicolors-grid-inner {
|
102
|
+
background: black;
|
103
|
+
}
|
104
|
+
|
105
|
+
.minicolors-slider-wheel .minicolors-grid {
|
106
|
+
background-position: -720px 0;
|
107
|
+
}
|
108
|
+
|
109
|
+
.minicolors-slider,
|
110
|
+
.minicolors-opacity-slider {
|
111
|
+
position: absolute;
|
112
|
+
top: 1px;
|
113
|
+
left: 152px;
|
114
|
+
width: 20px;
|
115
|
+
height: 150px;
|
116
|
+
background: white url(<%= image_path 'jquery.minicolors.png' %>) 0 0;
|
117
|
+
cursor: row-resize;
|
118
|
+
}
|
119
|
+
|
120
|
+
.minicolors-slider-saturation .minicolors-slider {
|
121
|
+
background-position: -60px 0;
|
122
|
+
}
|
123
|
+
|
124
|
+
.minicolors-slider-brightness .minicolors-slider {
|
125
|
+
background-position: -20px 0;
|
126
|
+
}
|
127
|
+
|
128
|
+
.minicolors-slider-wheel .minicolors-slider {
|
129
|
+
background-position: -20px 0;
|
130
|
+
}
|
131
|
+
|
132
|
+
.minicolors-opacity-slider {
|
133
|
+
left: 173px;
|
134
|
+
background-position: -40px 0;
|
135
|
+
display: none;
|
136
|
+
}
|
137
|
+
|
138
|
+
.minicolors-with-opacity .minicolors-opacity-slider {
|
139
|
+
display: block;
|
140
|
+
}
|
141
|
+
|
142
|
+
/* Pickers */
|
143
|
+
.minicolors-grid .minicolors-picker {
|
144
|
+
position: absolute;
|
145
|
+
top: 70px;
|
146
|
+
left: 70px;
|
147
|
+
width: 12px;
|
148
|
+
height: 12px;
|
149
|
+
border: solid 1px black;
|
150
|
+
border-radius: 10px;
|
151
|
+
margin-top: -6px;
|
152
|
+
margin-left: -6px;
|
153
|
+
background: none;
|
154
|
+
}
|
155
|
+
|
156
|
+
.minicolors-grid .minicolors-picker > div {
|
157
|
+
position: absolute;
|
158
|
+
top: 0;
|
159
|
+
left: 0;
|
160
|
+
width: 8px;
|
161
|
+
height: 8px;
|
162
|
+
border-radius: 8px;
|
163
|
+
border: solid 2px white;
|
164
|
+
-moz-box-sizing: content-box;
|
165
|
+
-webkit-box-sizing: content-box;
|
166
|
+
box-sizing: content-box;
|
167
|
+
}
|
168
|
+
|
169
|
+
.minicolors-picker {
|
170
|
+
position: absolute;
|
171
|
+
top: 0;
|
172
|
+
left: 0;
|
173
|
+
width: 18px;
|
174
|
+
height: 2px;
|
175
|
+
background: white;
|
176
|
+
border: solid 1px black;
|
177
|
+
margin-top: -2px;
|
178
|
+
-moz-box-sizing: content-box;
|
179
|
+
-webkit-box-sizing: content-box;
|
180
|
+
box-sizing: content-box;
|
181
|
+
}
|
182
|
+
|
183
|
+
/* Inline controls */
|
184
|
+
.minicolors-inline {
|
185
|
+
display: inline-block;
|
186
|
+
}
|
187
|
+
|
188
|
+
.minicolors-inline .minicolors-input {
|
189
|
+
display: none !important;
|
190
|
+
}
|
191
|
+
|
192
|
+
.minicolors-inline .minicolors-panel {
|
193
|
+
position: relative;
|
194
|
+
top: auto;
|
195
|
+
left: auto;
|
196
|
+
box-shadow: none;
|
197
|
+
z-index: auto;
|
198
|
+
display: inline-block;
|
199
|
+
}
|
200
|
+
|
201
|
+
/* Default theme */
|
202
|
+
.minicolors-theme-default .minicolors-swatch {
|
203
|
+
top: 5px;
|
204
|
+
left: 5px;
|
205
|
+
width: 18px;
|
206
|
+
height: 18px;
|
207
|
+
}
|
208
|
+
.minicolors-theme-default.minicolors-position-right .minicolors-swatch {
|
209
|
+
left: auto;
|
210
|
+
right: 5px;
|
211
|
+
}
|
212
|
+
.minicolors-theme-default.minicolors {
|
213
|
+
width: auto;
|
214
|
+
display: inline-block;
|
215
|
+
}
|
216
|
+
.minicolors-theme-default .minicolors-input {
|
217
|
+
height: 20px;
|
218
|
+
width: auto;
|
219
|
+
display: inline-block;
|
220
|
+
padding-left: 26px;
|
221
|
+
}
|
222
|
+
.minicolors-theme-default.minicolors-position-right .minicolors-input {
|
223
|
+
padding-right: 26px;
|
224
|
+
padding-left: inherit;
|
225
|
+
}
|
226
|
+
|
227
|
+
/* Bootstrap theme */
|
228
|
+
.minicolors-theme-bootstrap .minicolors-swatch {
|
229
|
+
top: 3px;
|
230
|
+
left: 3px;
|
231
|
+
width: 28px;
|
232
|
+
height: 28px;
|
233
|
+
border-radius: 3px;
|
234
|
+
}
|
235
|
+
.minicolors-theme-bootstrap.minicolors-position-right .minicolors-swatch {
|
236
|
+
left: auto;
|
237
|
+
right: 3px;
|
238
|
+
}
|
239
|
+
.minicolors-theme-bootstrap .minicolors-input {
|
240
|
+
padding-left: 44px;
|
241
|
+
}
|
242
|
+
.minicolors-theme-bootstrap.minicolors-position-right .minicolors-input {
|
243
|
+
padding-right: 44px;
|
244
|
+
padding-left: 12px;
|
245
|
+
}
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: jquery-minicolors-rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version:
|
4
|
+
version: 2.1.1
|
5
5
|
prerelease:
|
6
6
|
platform: ruby
|
7
7
|
authors:
|
@@ -9,11 +9,11 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2013-
|
12
|
+
date: 2013-09-19 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: rails
|
16
|
-
requirement: &
|
16
|
+
requirement: &70137962184980 !ruby/object:Gem::Requirement
|
17
17
|
none: false
|
18
18
|
requirements:
|
19
19
|
- - ! '>='
|
@@ -21,10 +21,10 @@ dependencies:
|
|
21
21
|
version: 3.2.8
|
22
22
|
type: :runtime
|
23
23
|
prerelease: false
|
24
|
-
version_requirements: *
|
24
|
+
version_requirements: *70137962184980
|
25
25
|
- !ruby/object:Gem::Dependency
|
26
26
|
name: jquery-rails
|
27
|
-
requirement: &
|
27
|
+
requirement: &70137962180920 !ruby/object:Gem::Requirement
|
28
28
|
none: false
|
29
29
|
requirements:
|
30
30
|
- - ! '>='
|
@@ -32,10 +32,10 @@ dependencies:
|
|
32
32
|
version: '0'
|
33
33
|
type: :runtime
|
34
34
|
prerelease: false
|
35
|
-
version_requirements: *
|
35
|
+
version_requirements: *70137962180920
|
36
36
|
- !ruby/object:Gem::Dependency
|
37
37
|
name: multi_json
|
38
|
-
requirement: &
|
38
|
+
requirement: &70137962202060 !ruby/object:Gem::Requirement
|
39
39
|
none: false
|
40
40
|
requirements:
|
41
41
|
- - ! '>='
|
@@ -43,10 +43,10 @@ dependencies:
|
|
43
43
|
version: '0'
|
44
44
|
type: :development
|
45
45
|
prerelease: false
|
46
|
-
version_requirements: *
|
46
|
+
version_requirements: *70137962202060
|
47
47
|
- !ruby/object:Gem::Dependency
|
48
48
|
name: pry
|
49
|
-
requirement: &
|
49
|
+
requirement: &70137962198820 !ruby/object:Gem::Requirement
|
50
50
|
none: false
|
51
51
|
requirements:
|
52
52
|
- - ! '>='
|
@@ -54,10 +54,10 @@ dependencies:
|
|
54
54
|
version: '0'
|
55
55
|
type: :development
|
56
56
|
prerelease: false
|
57
|
-
version_requirements: *
|
57
|
+
version_requirements: *70137962198820
|
58
58
|
- !ruby/object:Gem::Dependency
|
59
59
|
name: rake
|
60
|
-
requirement: &
|
60
|
+
requirement: &70137962195860 !ruby/object:Gem::Requirement
|
61
61
|
none: false
|
62
62
|
requirements:
|
63
63
|
- - ! '>='
|
@@ -65,10 +65,10 @@ dependencies:
|
|
65
65
|
version: '0'
|
66
66
|
type: :development
|
67
67
|
prerelease: false
|
68
|
-
version_requirements: *
|
68
|
+
version_requirements: *70137962195860
|
69
69
|
- !ruby/object:Gem::Dependency
|
70
70
|
name: rspec
|
71
|
-
requirement: &
|
71
|
+
requirement: &70137962194660 !ruby/object:Gem::Requirement
|
72
72
|
none: false
|
73
73
|
requirements:
|
74
74
|
- - ! '>='
|
@@ -76,10 +76,10 @@ dependencies:
|
|
76
76
|
version: '0'
|
77
77
|
type: :development
|
78
78
|
prerelease: false
|
79
|
-
version_requirements: *
|
79
|
+
version_requirements: *70137962194660
|
80
80
|
- !ruby/object:Gem::Dependency
|
81
81
|
name: rspec-rails
|
82
|
-
requirement: &
|
82
|
+
requirement: &70137962216020 !ruby/object:Gem::Requirement
|
83
83
|
none: false
|
84
84
|
requirements:
|
85
85
|
- - ! '>='
|
@@ -87,10 +87,10 @@ dependencies:
|
|
87
87
|
version: '0'
|
88
88
|
type: :development
|
89
89
|
prerelease: false
|
90
|
-
version_requirements: *
|
90
|
+
version_requirements: *70137962216020
|
91
91
|
- !ruby/object:Gem::Dependency
|
92
92
|
name: simple_form
|
93
|
-
requirement: &
|
93
|
+
requirement: &70137962215240 !ruby/object:Gem::Requirement
|
94
94
|
none: false
|
95
95
|
requirements:
|
96
96
|
- - ! '>='
|
@@ -98,10 +98,10 @@ dependencies:
|
|
98
98
|
version: '0'
|
99
99
|
type: :development
|
100
100
|
prerelease: false
|
101
|
-
version_requirements: *
|
101
|
+
version_requirements: *70137962215240
|
102
102
|
- !ruby/object:Gem::Dependency
|
103
103
|
name: webrat
|
104
|
-
requirement: &
|
104
|
+
requirement: &70137962214260 !ruby/object:Gem::Requirement
|
105
105
|
none: false
|
106
106
|
requirements:
|
107
107
|
- - ! '>='
|
@@ -109,8 +109,8 @@ dependencies:
|
|
109
109
|
version: '0'
|
110
110
|
type: :development
|
111
111
|
prerelease: false
|
112
|
-
version_requirements: *
|
113
|
-
description:
|
112
|
+
version_requirements: *70137962214260
|
113
|
+
description: This gem embeddes the jQuery colorpicker in the Rails asset pipeline.
|
114
114
|
email:
|
115
115
|
- kostiantyn.kahanskyi@googlemail.com
|
116
116
|
executables: []
|
@@ -121,10 +121,10 @@ files:
|
|
121
121
|
- lib/jquery-minicolors-rails/engine.rb
|
122
122
|
- lib/jquery-minicolors-rails/version.rb
|
123
123
|
- lib/jquery-minicolors-rails.rb
|
124
|
-
- vendor/assets/images/jquery
|
125
|
-
- vendor/assets/javascripts/jquery
|
126
|
-
- vendor/assets/javascripts/jquery
|
127
|
-
- vendor/assets/stylesheets/jquery
|
124
|
+
- vendor/assets/images/jquery.minicolors.png
|
125
|
+
- vendor/assets/javascripts/jquery.minicolors.js
|
126
|
+
- vendor/assets/javascripts/jquery.minicolors.simple_form.js
|
127
|
+
- vendor/assets/stylesheets/jquery.minicolors.css.erb
|
128
128
|
- Rakefile
|
129
129
|
- README.md
|
130
130
|
homepage: https://github.com/kostia/jquery-minicolors-rails
|
@@ -141,7 +141,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
141
141
|
version: '0'
|
142
142
|
segments:
|
143
143
|
- 0
|
144
|
-
hash: -
|
144
|
+
hash: -2017164528785475072
|
145
145
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
146
146
|
none: false
|
147
147
|
requirements:
|
@@ -150,11 +150,11 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
150
150
|
version: '0'
|
151
151
|
segments:
|
152
152
|
- 0
|
153
|
-
hash: -
|
153
|
+
hash: -2017164528785475072
|
154
154
|
requirements: []
|
155
155
|
rubyforge_project:
|
156
156
|
rubygems_version: 1.8.5
|
157
157
|
signing_key:
|
158
158
|
specification_version: 3
|
159
|
-
summary:
|
159
|
+
summary: This gem embeddes the jQuery colorpicker in the Rails asset pipeline.
|
160
160
|
test_files: []
|
@@ -1,278 +0,0 @@
|
|
1
|
-
.minicolors {
|
2
|
-
position: relative;
|
3
|
-
display: inline-block;
|
4
|
-
z-index: 1;
|
5
|
-
}
|
6
|
-
|
7
|
-
.minicolors-focus {
|
8
|
-
z-index: 2;
|
9
|
-
}
|
10
|
-
|
11
|
-
.minicolors.minicolors-theme-default .minicolors-input {
|
12
|
-
margin: 0px;
|
13
|
-
margin-right: 3px;
|
14
|
-
border: solid 1px #CCC;
|
15
|
-
font: 14px sans-serif;
|
16
|
-
width: 65px;
|
17
|
-
height: 16px;
|
18
|
-
border-radius: 0;
|
19
|
-
box-shadow: inset 0 2px 4px rgba(0, 0, 0, .04);
|
20
|
-
padding: 2px;
|
21
|
-
margin-right: -1px;
|
22
|
-
}
|
23
|
-
|
24
|
-
.minicolors-theme-default.minicolors .minicolors-input {
|
25
|
-
vertical-align: middle;
|
26
|
-
outline: none;
|
27
|
-
}
|
28
|
-
|
29
|
-
.minicolors-theme-default.minicolors-swatch-left .minicolors-input {
|
30
|
-
margin-left: -1px;
|
31
|
-
margin-right: auto;
|
32
|
-
}
|
33
|
-
|
34
|
-
.minicolors-theme-default.minicolors-focus .minicolors-input,
|
35
|
-
.minicolors-theme-default.minicolors-focus .minicolors-swatch {
|
36
|
-
border-color: #999;
|
37
|
-
}
|
38
|
-
|
39
|
-
.minicolors-hidden {
|
40
|
-
position: absolute;
|
41
|
-
left: -9999em;
|
42
|
-
}
|
43
|
-
|
44
|
-
.minicolors-swatch {
|
45
|
-
position: relative;
|
46
|
-
width: 20px;
|
47
|
-
height: 20px;
|
48
|
-
text-align: left;
|
49
|
-
background: url(<%= image_path('jquery-minicolors/jquery.minicolors.png') %>) -80px 0;
|
50
|
-
border: solid 1px #CCC;
|
51
|
-
vertical-align: middle;
|
52
|
-
display: inline-block;
|
53
|
-
}
|
54
|
-
|
55
|
-
.minicolors-swatch SPAN {
|
56
|
-
position: absolute;
|
57
|
-
width: 100%;
|
58
|
-
height: 100%;
|
59
|
-
background: none;
|
60
|
-
box-shadow: inset 0 9px 0 rgba(255, 255, 255, .1);
|
61
|
-
display: inline-block;
|
62
|
-
}
|
63
|
-
|
64
|
-
/* Panel */
|
65
|
-
.minicolors-panel {
|
66
|
-
position: absolute;
|
67
|
-
top: 26px;
|
68
|
-
left: 0;
|
69
|
-
width: 173px;
|
70
|
-
height: 152px;
|
71
|
-
background: white;
|
72
|
-
border: solid 1px #CCC;
|
73
|
-
box-shadow: 0 0 20px rgba(0, 0, 0, .2);
|
74
|
-
display: none;
|
75
|
-
}
|
76
|
-
|
77
|
-
.minicolors-position-top .minicolors-panel {
|
78
|
-
top: -156px;
|
79
|
-
}
|
80
|
-
|
81
|
-
.minicolors-position-left .minicolors-panel {
|
82
|
-
left: -83px;
|
83
|
-
}
|
84
|
-
|
85
|
-
.minicolors-position-left.minicolors-with-opacity .minicolors-panel {
|
86
|
-
left: -104px;
|
87
|
-
}
|
88
|
-
|
89
|
-
.minicolors-with-opacity .minicolors-panel {
|
90
|
-
width: 194px;
|
91
|
-
}
|
92
|
-
|
93
|
-
.minicolors .minicolors-grid {
|
94
|
-
position: absolute;
|
95
|
-
top: 1px;
|
96
|
-
left: 1px;
|
97
|
-
width: 150px;
|
98
|
-
height: 150px;
|
99
|
-
background: url(<%= image_path('jquery-minicolors/jquery.minicolors.png') %>) -120px 0;
|
100
|
-
cursor: crosshair;
|
101
|
-
}
|
102
|
-
|
103
|
-
.minicolors .minicolors-grid-inner {
|
104
|
-
position: absolute;
|
105
|
-
top: 0;
|
106
|
-
left: 0;
|
107
|
-
width: 150px;
|
108
|
-
height: 150px;
|
109
|
-
background: none;
|
110
|
-
}
|
111
|
-
|
112
|
-
.minicolors-slider-saturation .minicolors-grid {
|
113
|
-
background-position: -420px 0;
|
114
|
-
}
|
115
|
-
|
116
|
-
.minicolors-slider-saturation .minicolors-grid-inner {
|
117
|
-
background: url(<%= image_path('jquery-minicolors/jquery.minicolors.png') %>) -270px 0;
|
118
|
-
}
|
119
|
-
|
120
|
-
.minicolors-slider-brightness .minicolors-grid {
|
121
|
-
background-position: -570px 0;
|
122
|
-
}
|
123
|
-
|
124
|
-
.minicolors-slider-brightness .minicolors-grid-inner {
|
125
|
-
background: black;
|
126
|
-
}
|
127
|
-
|
128
|
-
.minicolors-slider-wheel .minicolors-grid {
|
129
|
-
background-position: -720px 0;
|
130
|
-
}
|
131
|
-
|
132
|
-
.minicolors-slider,
|
133
|
-
.minicolors-opacity-slider {
|
134
|
-
position: absolute;
|
135
|
-
top: 1px;
|
136
|
-
left: 152px;
|
137
|
-
width: 20px;
|
138
|
-
height: 150px;
|
139
|
-
background: white url(<%= image_path('jquery-minicolors/jquery.minicolors.png') %>) 0 0;
|
140
|
-
cursor: crosshair;
|
141
|
-
}
|
142
|
-
|
143
|
-
.minicolors-slider-saturation .minicolors-slider {
|
144
|
-
background-position: -60px 0;
|
145
|
-
}
|
146
|
-
|
147
|
-
.minicolors-slider-brightness .minicolors-slider {
|
148
|
-
background-position: -20px 0;
|
149
|
-
}
|
150
|
-
|
151
|
-
.minicolors-slider-wheel .minicolors-slider {
|
152
|
-
background-position: -20px 0;
|
153
|
-
}
|
154
|
-
|
155
|
-
.minicolors-opacity-slider {
|
156
|
-
left: 173px;
|
157
|
-
background-position: -40px 0;
|
158
|
-
display: none;
|
159
|
-
}
|
160
|
-
|
161
|
-
.minicolors-with-opacity .minicolors-opacity-slider {
|
162
|
-
display: block;
|
163
|
-
}
|
164
|
-
|
165
|
-
/* Pickers */
|
166
|
-
.minicolors-grid .minicolors-picker {
|
167
|
-
position: absolute;
|
168
|
-
top: 70px;
|
169
|
-
left: 70px;
|
170
|
-
width: 10px;
|
171
|
-
height: 10px;
|
172
|
-
border: solid 1px black;
|
173
|
-
border-radius: 10px;
|
174
|
-
margin-top: -6px;
|
175
|
-
margin-left: -6px;
|
176
|
-
background: none;
|
177
|
-
}
|
178
|
-
|
179
|
-
.minicolors-grid .minicolors-picker SPAN {
|
180
|
-
position: absolute;
|
181
|
-
top: 0;
|
182
|
-
left: 0;
|
183
|
-
width: 6px;
|
184
|
-
height: 6px;
|
185
|
-
border-radius: 6px;
|
186
|
-
border: solid 2px white;
|
187
|
-
}
|
188
|
-
|
189
|
-
.minicolors-picker {
|
190
|
-
position: absolute;
|
191
|
-
top: 0;
|
192
|
-
left: 0;
|
193
|
-
width: 18px;
|
194
|
-
height: 2px;
|
195
|
-
background: white;
|
196
|
-
border: solid 1px black;
|
197
|
-
margin-top: -2px;
|
198
|
-
}
|
199
|
-
|
200
|
-
/* Inline controls */
|
201
|
-
.minicolors-inline .minicolors-input,
|
202
|
-
.minicolors-inline .minicolors-swatch {
|
203
|
-
display: none;
|
204
|
-
}
|
205
|
-
|
206
|
-
.minicolors-inline .minicolors-panel {
|
207
|
-
position: relative;
|
208
|
-
top: auto;
|
209
|
-
left: auto;
|
210
|
-
display: inline-block;
|
211
|
-
}
|
212
|
-
|
213
|
-
|
214
|
-
/*
|
215
|
-
* Bootstrap Theme (theme: 'bootstrap')
|
216
|
-
*
|
217
|
-
*/
|
218
|
-
|
219
|
-
/* Input styles */
|
220
|
-
.minicolors-theme-bootstrap .minicolors-input {
|
221
|
-
padding: 4px 6px;
|
222
|
-
padding-left: 30px;
|
223
|
-
background-color: white;
|
224
|
-
border: 1px solid #CCC;
|
225
|
-
border-radius: 3px;
|
226
|
-
color: #555;
|
227
|
-
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
|
228
|
-
font-size: 14px;
|
229
|
-
height: 19px;
|
230
|
-
margin: 0px;
|
231
|
-
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
232
|
-
}
|
233
|
-
|
234
|
-
/* When the input has focus */
|
235
|
-
.minicolors-theme-bootstrap.minicolors-focus .minicolors-input {
|
236
|
-
border-color: #6fb8f1;
|
237
|
-
box-shadow: 0 0 10px #6fb8f1;
|
238
|
-
outline: none;
|
239
|
-
}
|
240
|
-
|
241
|
-
/* Swatch styles */
|
242
|
-
.minicolors-theme-bootstrap .minicolors-swatch {
|
243
|
-
position: absolute;
|
244
|
-
left: 4px;
|
245
|
-
top: 4px;
|
246
|
-
z-index: 2;
|
247
|
-
}
|
248
|
-
|
249
|
-
/* Handle swatch position (left = default / right) */
|
250
|
-
.minicolors-theme-bootstrap.minicolors-swatch-position-right .minicolors-input {
|
251
|
-
padding-left: 6px;
|
252
|
-
padding-right: 30px;
|
253
|
-
}
|
254
|
-
|
255
|
-
.minicolors-theme-bootstrap.minicolors-swatch-position-right .minicolors-swatch {
|
256
|
-
left: auto;
|
257
|
-
right: 4px;
|
258
|
-
}
|
259
|
-
|
260
|
-
/* Panel styles */
|
261
|
-
.minicolors-theme-bootstrap .minicolors-panel {
|
262
|
-
top: 28px;
|
263
|
-
z-index: 3;
|
264
|
-
}
|
265
|
-
|
266
|
-
/* Handle panel positions (top / left) */
|
267
|
-
.minicolors-theme-bootstrap.minicolors-position-top .minicolors-panel {
|
268
|
-
top: -154px;
|
269
|
-
}
|
270
|
-
|
271
|
-
.minicolors-theme-bootstrap.minicolors-position-left .minicolors-panel {
|
272
|
-
left: -63px;
|
273
|
-
}
|
274
|
-
|
275
|
-
/* Don't forget to adjust the left position in case the opacity slider is visible! */
|
276
|
-
.minicolors-theme-bootstrap.minicolors-position-left.minicolors-with-opacity .minicolors-panel {
|
277
|
-
left: -84px;
|
278
|
-
}
|