bellord/kit
1
0
Fork 0
mirror of https://bitbucket.org/bellord13/kit.git synced 2026-11-13 19:06:11 +03:00
Code Issues Packages Projects Releases Wiki Activity

fixNsv

Browse Source
This commit is contained in:
bellord
2021-08-17 22:01:03 +03:00
parent 1b84ac831f
commit 861e59919e
30 changed files with 2501 additions and 2324 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/toolkit/toolkit.css
+33 -42
View File
@@ -182,7 +182,9 @@
padding-right: 10px;
padding-left: 10px;
}
.kit-field.kit-field--bordered .kit-field__input:focus ~.kit-field__hr {
.kit-field.kit-field--bordered .kit-field__input:focus ~.kit-field__hr,
.kit-field.kit-field--bordered .kit-field__input.focus ~.kit-field__hr
{
border-color: var(--kit-color-primary);
}
.kit-field.kit-field--bordered .kit-field__input.kit-field--error ~.kit-field__hr
@@ -220,10 +222,7 @@
overflow: hidden;
}
.kit-field textarea,
.kit-field input[type='password'],
.kit-field input[type='email'],
.kit-field input[type='text'],
.kit-field input[type='tel'],
.kit-field input,
.kit-field .kit-field__display {
pointer-events: auto;
background-color: transparent;
@@ -281,34 +280,24 @@
--line-clamp-height: var(--line-height-ratio);
}
.kit-field textarea:focus,
.kit-field input[type='password']:focus,
.kit-field input[type='email']:focus,
.kit-field input[type='text']:focus,
.kit-field input[type='number']:focus,
.kit-field input[type='tel']:focus,
.kit-field .kit-field__display:focus {
.kit-field input:focus,
.kit-field textarea.focus,
.kit-field input.focus {
color: var(--kit-color-text);
}
.kit-field textarea:focus ~.kit-field__label,
.kit-field input[type='password']:focus ~.kit-field__label,
.kit-field input[type='email']:focus ~.kit-field__label,
.kit-field input[type='text']:focus ~.kit-field__label,
.kit-field input[type='number']:focus ~.kit-field__label,
.kit-field input[type='tel']:focus ~.kit-field__label,
.kit-field input:focus ~.kit-field__label,
.kit-field .kit-field__display:focus ~.kit-field__label {
.kit-field textarea.focus ~.kit-field__label,
.kit-field input.focus ~.kit-field__label {
top: 0;
transform: translate(0, 0);
font-size: calc(var(--font-size) * var(--kit-field-focus-label-zoom-ratio));
color: var(--kit-color-primary);
}
.kit-field textarea:focus ~.kit-field__hr:after,
.kit-field input[type='password']:focus ~.kit-field__hr:after,
.kit-field input[type='email']:focus ~.kit-field__hr:after,
.kit-field input[type='text']:focus ~.kit-field__hr:after,
.kit-field input[type='number']:focus ~.kit-field__hr:after,
.kit-field input[type='tel']:focus ~.kit-field__hr:after,
.kit-field .kit-field__display:focus ~.kit-field__hr:after {
.kit-field input:focus ~.kit-field__hr:after,
.kit-field textarea.focus ~.kit-field__hr:after,
.kit-field input.focus ~.kit-field__hr:after {
left: 0;
width: 100%;
}
@@ -402,6 +391,19 @@
.kit-field .kit-field--error ~.kit-field__hr:after {
border-color: var(--kit-color-error) !important;
}
.kit-field .kit-field--warning ~.kit-field__message
{
opacity: 1;
visibility: visible;
color: var(--kit-color-warning);
}
.kit-field .kit-field--warning ~.kit-field__label {
color: var(--kit-color-warning) !important;
}
.kit-field .kit-field--warning ~.kit-field__hr:after {
border-color: var(--kit-color-warning) !important;
}
.kit-field__text {
display: block;
-webkit-user-select: none;
@@ -1130,7 +1132,8 @@ select.kit-field__input:disabled ~.kit-field__hr {
.kit-field--success ~.kit-field__hr {
border-color: var(--kit-color-success) !important;
}
.kit-field--success:focus ~.kit-field__hr:after {
.kit-field--success:focus ~.kit-field__hr:after,
.kit-field--success.focus ~.kit-field__hr:after {
border-color: var(--kit-color-success) !important;
}
@@ -1186,27 +1189,15 @@ select.kit-field__input:disabled ~.kit-field__hr {
.kit-field textarea[readonly]:focus,
.kit-field input[type='password'][readonly]:focus,
.kit-field input[type='email'][readonly]:focus,
.kit-field input[type='text'][readonly]:focus,
.kit-field input[type='tel'][readonly]:focus,
.kit-field .kit-field__display[readonly]:focus {
color: var(--kit-color-readonly);
}
.kit-field textarea[readonly]:focus,
.kit-field input[type='password'][readonly],
.kit-field input[type='email'][readonly],
.kit-field input[type='text'][readonly],
.kit-field input[type='tel'][readonly],
.kit-field .kit-field__display[readonly] {
.kit-field input[readonly]:focus,
.kit-field textarea[readonly].focus,
.kit-field input[readonly].focus {
color: var(--kit-color-readonly);
}
.kit-field textarea[readonly]:focus ~.kit-field__label,
.kit-field input[type='password'][readonly]:focus ~.kit-field__label,
.kit-field input[type='email'][readonly]:focus ~.kit-field__label,
.kit-field input[type='text'][readonly]:focus ~.kit-field__label,
.kit-field input[type='tel'][readonly]:focus ~.kit-field__label,
.kit-field .kit-field__display[readonly]:focus ~.kit-field__label
.kit-field input[readonly]:focus ~.kit-field__label,
.kit-field textarea[readonly].focus ~.kit-field__label,
.kit-field input[readonly].focus ~.kit-field__label
{
color: var(--kit-color-readonly);
}
assets/toolkit/toolkit.js
+64 -13
View File
@@ -3,6 +3,7 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
var $ = require('jquery');
var __Config = function () {
function Config() {
@@ -227,7 +228,6 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
key;
if (Object.keys(messageObject).length) {
console.log('1');
for (key in messageObject) {
msg = messageObject[key];
console.log(msg);
@@ -270,7 +270,7 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
}
document.addEventListener('click', clickHandler, false);
document.addEventListener('change', chahgeHandler, false);
document.addEventListener('change', changeHandler, false);
document.addEventListener('keydown', escapeKeyHandler, false);
window.addEventListener('resize', resizeHandler, false);
@@ -346,9 +346,10 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
}
// изменение инпута
function chahgeHandler(e) {
function changeHandler(e) {
var select = e.target;
changeSelect(select);
console.log('changeHandler');
}
/**
@@ -702,6 +703,7 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
this.init();
console.log('Inputs constructor');
window.addEventListener('resize', function () {
return _this.refresh();
@@ -716,6 +718,7 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
return _this.refresh();
}, false);
document.addEventListener('input', function (e) {
console.log('input');
return _this.changeFiled(e);
}, false);
document.addEventListener('paste', function (e) {
@@ -728,17 +731,34 @@ 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);
}
Inputs.prototype.checkDirty = function checkDirty(element) {
return !element.value && !element.placeholder.length ? element.setAttribute('data-dirty', 'false') : element.setAttribute('data-dirty', 'true');
var bDirty = false;
if(element.placeholder.length) {
element.setAttribute('data-dirty', 'true');
return true;
}
if(element.mask) {
var raw = element.mask.getRaw();
bDirty = !!raw.length;
} else {
bDirty = !!element.value;
}
element.setAttribute('data-dirty', bDirty?'true':'false');
return bDirty;
};
Inputs.prototype.changeFiled = function changeFiled(e) {
console.log('changeFiled');
var _this2 = this;
var target = e.target || e;
if (target.classList.contains('kit-field__input')) {
@@ -818,7 +838,7 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
}
};
Inputs.prototype.setMask = function setMask() {
Inputs.prototype.setTelMask = function () {
var _this3 = this;
$('[type=tel]').mask(Config.mask.tel, {
@@ -826,21 +846,42 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
_this3.fieldNormalize(this);
}
}).on('blur.mask', function (e) {
_this3.checkDirty(e.currentTarget);
//_this3.checkDirty(e.currentTarget);
});
};
Inputs.prototype.unsetMask = function unsetMask() {
Inputs.prototype.setMask = function () {
var _this3 = this;
var node = $('[data-mask]');
node.each(function(index, item){
item = $(item);
var placeholder = item.attr('data-mask-placeholder');
placeholder = placeholder?placeholder:'_';
item.mask(item.attr('data-mask'), {
placeholder: placeholder,
completed: function completed() {
_this3.fieldNormalize(this);
}
}).on('blur.mask', function (e) {
//_this3.checkDirty(e.currentTarget);
});
});
};
Inputs.prototype.unsetTelMask = function() {
$('input[type=tel]').unmask();
};
Inputs.prototype.init = function init() {
this.checkAllInputs();
this.setMask();
this.setTelMask();
};
Inputs.prototype.refresh = function refresh() {
this.unsetMask();
this.unsetTelMask();
this.init();
};
@@ -893,11 +934,21 @@ kit.PluginManager.register('toolkit',function(module, exports, require) {
var Inputs = new __Inputs();
module.exports.Helper = Helper;
module.exports.Select = Select();
module.exports.Config = Config;
module.exports.Message = Message;
module.exports.Inputs = Inputs;
/**
* @class kit.toolkit
*/
var toolkit = {
Helper: Helper,
Select: Select(),
Config: Config,
Message: Message,
Inputs: Inputs,
};
Object.assign(module.exports, toolkit);
return module.exports;
});