This commit is contained in:
2021-08-20 11:18:47 +03:00
parent b31226635c
commit ff5f1770ad
9 changed files with 117 additions and 58 deletions
+21 -5
View File
@@ -91,7 +91,7 @@
}
* {
*, :after, :before {
box-sizing: border-box;
}
@@ -670,7 +670,7 @@
-moz-animation: ball-clip-rotate 0.75s linear infinite;
animation: ball-clip-rotate 0.75s linear infinite;
}
.kit-button,
.kit-button.kit-button--secondary {
--kit-color-button-text-disabled: var(--kit-color-secondary-text, var(--kit-color-text));
--kit-color-button-content-disabled: var(--kit-color-secondary-w1, var(--kit-color-secondary));
@@ -692,7 +692,7 @@
.kit-button.kit-button--primary {
--kit-color-button-text-disabled: var(--kit-color-primary-text, var(--kit-color-text));
--kit-color-button-content-disabled: var(--kit-color-primary-w1, var(--kit-color-primary));
--kit-color-button-content-disabled: var(--kit-color-primary-w3, var(--kit-color-primary));
--kit-color-button-material-disabled: var(--kit-color-primary);
--kit-color-button-text-default: var(--kit-color-primary-text, var(--kit-color-text));
@@ -795,6 +795,9 @@
transition: background 0.3s, box-shadow 0.3s, color 0.3s;
position: relative;
}
.kit-button * {
pointer-events: none;
}
.kit-button:hover,
.kit-button:focus {
--kit-color-button-text: var(--kit-color-button-text-hover);
@@ -832,6 +835,8 @@
.kit-button__label {
--line-clamp: 1;
white-space: normal;
text-transform: uppercase;
font-size: 0.9em;
}
.kit-button.kit-disabled,
.kit-button:disabled,
@@ -863,7 +868,7 @@
}
.kit-button.kit-button--radius,
.kit-button.kit-button--radius:after {
border-radius: 3px;
border-radius: 2px;
}
.kit-button.kit-button--round,
.kit-button.kit-button--round:after {
@@ -1025,10 +1030,21 @@ select.kit-field__input:disabled ~.kit-field__hr {
.kit-dropdown__option:hover {
background: #e5e5e5;
}
.kit-dropdown__option.kit-active {
.kit-dropdown__option.kit-active:not(.kit-select-placeholder) {
background: #2074e7;
color: #fff;
}
.kit-dropdown__option.kit-select-placeholder {
color: #919191;
cursor: auto;
font-style: italic;
font-size: 0.8em;
padding: 5px 10px;
pointer-events: none;
}
.kit-dropdown__option.kit-select-hidden {
display: none;
}
.kit-select--open .kit-select__dropdown {
opacity: 1;
visibility: visible;
+27 -25
View File
@@ -349,7 +349,17 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
function changeHandler(e) {
var select = e.target;
changeSelect(select);
console.log('changeHandler');
}
function __dirtyTests(value, dirtyValidTestData) {
var r = true;
dirtyValidTestData.forEach(function(attr, i){
if(attr.name === 'data-dirty-min') {
r = r && (Number(value) >= Number(attr.value))
}
});
return r;
}
/**
@@ -357,7 +367,7 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
* @param select {HTMLElement}
*/
function changeSelect(select) {
if (hasClass(select, 'kit-field__input') && select.tagName == 'SELECT') {
if (hasClass(select, 'kit-field__input') && select.tagName === 'SELECT') {
var selected = select.querySelectorAll('option:checked')[0];
var data = {};
var dataAttrs = [];
@@ -368,32 +378,35 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
});
}
var dirtyValidTestData = [];
dirtyValidTestData = dirtyValidTestData.filter.call(select.attributes, function (attr) {
return (/^data-dirty-/.test(attr.name)
);
});
var isMultiple = select.hasAttribute('multiple');
var parent = select.parentNode;
var display = select.parentNode.querySelector('.kit-field__display');
var bDisplay = true;
//if(parent && parent.classList.contains('kit-field--select-link') && isMultiple) {
var bDirty = !!selected;
if(isMultiple) {
bDisplay = false;
bDirty = false;
}
if(!isMultiple) {
bDirty = bDirty && __dirtyTests(select.value, dirtyValidTestData);
}
display.textContent = '';
if(bDisplay && selected) {
if(bDirty) {
display.textContent = selected.textContent;
}
removeClass(parent, 'kit-select--open');
if(selected) {
select.setAttribute('data-dirty', 'true');
} else {
select.setAttribute('data-dirty', 'false');
}
select.setAttribute('data-dirty', bDirty?'true':'false');
removeClass(select, 'kit-field--error');
@@ -468,28 +481,18 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
var textContent = item.textContent;
var dropdownInnerIcon = document.createElement('span');
var dropdownInnerIconCheck = '<svg viewBox="0 0 24 24"><path d="M9.001,16.212l-4.199-4.2l-1.4,1.4l5.6,5.6l12-12l-1.4-1.4L9.001,16.212z"></path></svg>';
var dataClass = String(item.getAttribute('data-class'));
addClass(dropdownInnerIcon, 'kit-field__icon');
$(dropdownInnerIcon).append(dropdownInnerIconCheck);
dropdownInner.textContent = textContent;
dropdownInner.setAttribute('data-index', i);
addClass(dropdownInner, 'kit-dropdown__option');
addClass(dropdownInner, dataClass);
if (isMultiple) {
dropdownInner.appendChild(dropdownInnerIcon);
}
// if (item.getAttribute( "block_selected_off" ) == "active") {
// addClass(dropdownInner, 'block_selected_off');
// dropdownInner.appendChild(dropdownInnerIcon);
// }
// if (item.getAttribute( "block_selected" ) == "active") {
// addClass(dropdownInner, 'block_selected');
// dropdownInner.appendChild(dropdownInnerIcon);
// }
// if (item.getAttribute( "block_selected" ) == "noActive") {
// addClass(dropdownInner, 'block_selected_no');
// dropdownInner.appendChild(dropdownInnerIcon);
// }
if (item.disabled) {
addClass(dropdownInner, 'kit-disabled');
}
@@ -731,7 +734,6 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
return _this.changeFiled(e);
}, false);
document.addEventListener('change', function (e) {
console.log('change');
return _this.switchField(e);
}, false);