Commit 08730f40 authored by targoo's avatar targoo

Bemify box css

parent 68f6fbf0
.colorBox {
.color_field_widget_box {
}
.color_field_widget_box__square {
border: 1px solid #ffffff;
cursor: pointer;
font-family: monospace;
......@@ -6,31 +9,24 @@
margin: 0 3px;
padding: 1px 8px;
}
.colorBox.active,
.colorBox:hover {
.color_field_widget_box__square.active,
.color_field_widget_box__square:hover {
padding: 9px 16px;
}
.transparentBox {
.color_field_widget_box__square--transparent {
background-image: url("../images/transparent_box16.gif");
background-position: 0 3px;
background-repeat: no-repeat;
margin: 0 3px;
padding: 2px 8px;
}
.transparentBox.active,
.transparentBox:hover {
.color_field_widget_box__square--transparent.active,
.color_field_widget_box__square--transparent:hover {
background-image: url(../images/transparent_box32.gif);
background-position: 0 3px;
background-repeat: no-repeat;
padding: 10px 16px;
}
.hide_input {
diplay: none;
}
.color-field-column {
float: left;
width: 48%;
}
.color-field-column .form-text {
width: 95%;
}
......@@ -20,6 +20,8 @@
$element.empty().addColorPicker({
currentColor: $input.val(),
colors: default_colors,
blotchClass:'color_field_widget_box__square',
blotchTransparentClass:'color_field_widget_box__square--transparent',
clickCallback: function(color) {
$input.val(color).trigger('change');
}
......
......@@ -9,6 +9,7 @@ jQuery.fn.addColorPicker = function (props) {
currentColor:'',
blotchElemType: 'span',
blotchClass:'colorBox',
blotchTransparentClass:'transparentBox',
clickCallback: function(ignoredColor) {},
iterationCallback: null,
fillString: ' ',
......@@ -35,7 +36,7 @@ jQuery.fn.addColorPicker = function (props) {
}
if (props.clickCallback) {
elem.click(function() {
jQuery(this).parent().children('.colorBox').removeClass('active');
jQuery(this).parent().children('.' + props.blotchClass).removeClass('active');
jQuery(this).addClass('active');
props.clickCallback(jQuery(this).attr('color'));
});
......@@ -47,15 +48,17 @@ jQuery.fn.addColorPicker = function (props) {
}
var elem = jQuery('<' + props.blotchElemType + '/>')
.addClass('transparentBox')
.addClass(props.blotchTransparentClass)
.attr('color', '')
.css('background-color', '');
if (props.currentColor == '') {
elem.addClass('active');
}
if (props.clickCallback) {
elem.click(function() {
jQuery(this).parent().children('.colorBox').removeClass('active');
jQuery(this).parent().children('.' + props.blotchClass).removeClass('active');
jQuery(this).addClass('active');
props.clickCallback(jQuery(this).attr('color'));
});
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment