Added linear progress component. Fixed a z-index issues with the circular progress. Added better border support for editable labels and chip lists.

This commit is contained in:
2020-12-01 11:49:01 -08:00
parent 0254076862
commit d24c50cacb
4 changed files with 118 additions and 14 deletions

View File

@@ -9,19 +9,23 @@ class EditableLabel extends IgniteElement {
get styles() {
return `
mt-editable-label.editing {
border: solid 0.15rem rgba(0,0,0,0.1);
}
mt-editable-label {
display: flex;
flex-direction: row;
align-items: center;
border-radius: 0.3rem;
border: solid 0.15rem transparent;
border: solid 0.13rem #ced4da;
padding: 0.4rem;
}
mt-editable-label.no-border {
border-color: transparent;
}
mt-editable-label.editing {
border: solid 0.13rem rgba(0,0,0,0.1);
}
mt-editable-label:hover {
cursor: pointer;
}
@@ -59,13 +63,15 @@ class EditableLabel extends IgniteElement {
multiLine: false,
saveButton: true,
input: null,
placeholder: null
placeholder: null,
border: false
};
}
render() {
return this.template
.attribute("tabindex", "0")
.class(this.border, value => value ? null : "no-border")
.class(this.editing, value => value ? "editing" : null)
.onFocus(e => this.onFocus())
.child(