esiur/iui
2
0
Fork 0
mirror of https://github.com/esiur/iui.git synced 2025-05-06 06:42:58 +00:00
Code Issues Projects Releases Wiki Activity

Merge branch 'main' of https://github.com/esiur/iui

Browse Source
This commit is contained in:
Ahmed Zamil 2024-07-05 17:38:58 +03:00
commit 2d73f0c63c
2 changed files with 77 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
css/iui.css
View File

@ -244,13 +244,17 @@ html[dir="rtl"] .textbox-with-label > input:not(:placeholder-shown) + span {
}
.input > input:focus + span,
.input > input:not(:placeholder-shown) + span {
.input > textarea:focus + span,
.input > input:not(:placeholder-shown) + span,
.input > textarea:not(:placeholder-shown) + span {
opacity: 1;
transform: scale(0.75) translateY(-40%) translateX(-20px);
}
html[dir="rtl"] .input > input:focus + span,
html[dir="rtl"] .input > input:not(:placeholder-shown) + span {
html[dir="rtl"] .input > textarea:focus + span,
html[dir="rtl"] .input > input:not(:placeholder-shown) + span,
html[dir="rtl"] .input > textarea:not(:placeholder-shown) + span {
opacity: 1;
transform: scale(0.75) translateY(-40%) translateX(20%);
}
@ -1907,7 +1911,7 @@ _:-moz-tree-row(hover), html[dir='rtl'] .autocomplete-menu, html[dir='rtl'] .sel
width: 100%;
}
.input > input, .select, .textbox {
.input > input, .input > textarea, .select, .textbox {
outline: none;
color: var(--textbox-color);
border: var(--textbox-border);
@ -1919,11 +1923,11 @@ _:-moz-tree-row(hover), html[dir='rtl'] .autocomplete-menu, html[dir='rtl'] .sel
font-size: 1em;
}
.input > input {
.input > input, .input > textarea {
padding: 2px 5px;
}
.input > input:disabled {
.input > input:disabled, .input > textarea:disabled {
background: var(--textbox-background-disabled);
}
@ -1945,20 +1949,20 @@ _:-moz-tree-row(hover), html[dir='rtl'] .autocomplete-menu, html[dir='rtl'] .sel
font-weight: bold;
}
.input > input:active, .textbox:active {
.input > input:active, .input > textarea:active, .textbox:active {
border: 1px solid #34495E;
}
.input > input:focus, .textbox:focus {
.input > input:focus, .input > textarea:focus, .textbox:focus {
border-color: var(--textbox-border-color-focus);
box-shadow: var(--textbox-box-shadow-focus);
}
.input-invalid > input {
.input-invalid > input, .input-invalid > textarea {
border-color: var(--textbox-border-color-invalid) !important;
}
.input-invalid > input:focus {
.input-invalid > input:focus, .input-invalid > textarea:focus {
box-shadow: var(--textbox-box-shadow-invalid) !important;
}

9
src/UI/Input.js
View File

@ -55,7 +55,11 @@ export default IUI.module(
this._span = document.createElement("span");
this._span.innerHTML = this.getAttribute("caption");
this._input = document.createElement("input");
let type = this.hasAttribute("type")
? this.getAttribute("type").toLowerCase()
: "text";
this._input = document.createElement(type == "multiline" ? "textarea" : "input");
this._input.placeholder = this.getAttribute("placeholder") || "";
let self = this;
@ -69,9 +73,6 @@ export default IUI.module(
self._emit("change", { value: self.value });
});
this.type = this.hasAttribute("type")
? this.getAttribute("type").toLowerCase()
: "text";
this.accept = this.getAttribute("accept");