Archives/tobspr_shapez.io
1
0
Fork 0
mirror of https://github.com/tobspr/shapez.io.git synced 2025-12-16 03:31:52 +00:00
Code Issues Projects Releases Wiki Activity

Added option to FormElements for inline label,input.

Browse Source 
Signed-off-by: Daan Breur <git@daanbreur.systems>
This commit is contained in:
Daan Breur 2021-11-22 14:30:27 +01:00
parent d9d7292526
commit 84c5fb7757
No known key found for this signature in database
GPG Key ID: FAD44580052ECA57
2 changed files with 27 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/css/ingame_hud/dialogs.scss
View File

@ -215,7 +215,17 @@
}
}
> .detailsFormElem {
.inline {
display: flex;
flex-direction: row;
align-items: center;
> * {
@include S(margin-right, 7.5px);
}
}
.detailsFormElem {
> .object {
pointer-events: all;

22
src/js/core/modal_dialog_forms.js
View File

@ -93,12 +93,21 @@ export class FormElementDetails extends FormElement {
}
export class FormElementInput extends FormElement {
constructor({ id, label = null, placeholder, defaultValue = "", inputType = "text", validator = null }) {
constructor({
id,
label = null,
placeholder,
defaultValue = "",
inputType = "text",
validator = null,
inline = false,
}) {
super(id, label);
this.placeholder = placeholder;
this.defaultValue = defaultValue;
this.inputType = inputType;
this.validator = validator;
this.inline = inline;
this.element = null;
}
@ -128,7 +137,7 @@ export class FormElementInput extends FormElement {
}
return `
<div class="formElement input">
<div class="formElement input ${this.inline ? "inline" : ""}">
${this.label ? `<label>${this.label}</label>` : ""}
<input
type="${inputType}"
@ -188,21 +197,22 @@ export class FormElementInput extends FormElement {
}
export class FormElementCheckbox extends FormElement {
constructor({ id, label, defaultValue = true }) {
constructor({ id, label, defaultValue = true, inline = false }) {
super(id, label);
this.defaultValue = defaultValue;
this.value = this.defaultValue;
this.inline = inline;
this.element = null;
}
getHtml() {
return `
<div class="formElement checkBoxFormElem">
<div class="formElement checkBoxFormElem ${this.inline ? "inline" : ""}">
${this.label ? `<label>${this.label}</label>` : ""}
<div class="checkbox ${this.defaultValue ? "checked" : ""}" data-formId='${this.id}'>
<span class="knob"></span >
</div >
<span class="knob"></span>
</div>
</div>
`;
}