FJurmanovic/wallet-web
1
0
Fork 0
mirror of https://github.com/FJurmanovic/wallet-web.git synced 2026-02-06 06:08:10 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

styling rest of page

Browse Source
This commit is contained in:
Fran Jurmanović
2021-06-13 19:30:05 +02:00
parent 7596c832d7
commit 3caaea8b26
24 changed files with 318 additions and 200 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/app-form/AppFormElement.ts
View File

@@ -115,9 +115,11 @@ class AppFormElement extends BaseComponentElement {
render = (): TemplateResult => {
const renderSubmit = (valid: boolean) => {
if (!valid) {
return html` <button type="submit" disabled>Submit</button> `;
return html`
<button class="btn btn-squared btn-primary --submit disabled" type="submit" disabled>Submit</button>
`;
}
return html` <button type="submit">Submit</button> `;
return html` <button class="btn btn-squared btn-primary --submit" type="submit">Submit</button> `;
};
const renderError = (error: string) => {
if (error) {
@@ -127,15 +129,24 @@ class AppFormElement extends BaseComponentElement {
};
const renderCancel = (hasCancel: boolean) => {
if (hasCancel) {
return html`<button type="button" app-action="click:app-form#goBack">Cancel</button>`;
return html`<button class="btn btn-squared btn-red --cancel" type="button" app-action="click:app-form#goBack">
Cancel
</button>`;
}
return html``;
};
return html`<form app-action="submit:app-form#onSubmit" data-target="app-form.formElement">
<slot data-target="app-form.innerSlot"></slot>
${renderError(this.error)}${renderSubmit(this.isValid)}${renderCancel(isTrue(this.hasCancel))}
</form>`;
return html`
<div class="app-form">
<form app-action="submit:app-form#onSubmit" data-target="app-form.formElement">
<slot data-target="app-form.innerSlot"></slot>
${renderError(this.error)}
<div class="form-buttons">
<div class="button-content">${renderSubmit(this.isValid)}${renderCancel(isTrue(this.hasCancel))}</div>
</div>
</form>
</div>
`;
};
}