caranmegil/mosaic
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update to edit page formatting

Browse Source
This commit is contained in:
William Moore 2023-06-06 16:45:39 -05:00
parent df36fe89c1
commit 1452667c63
1 changed files with 24 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/edit.ts
View File

@ -5,7 +5,7 @@ import { customElement } from 'lit/decorators.js';
export class LavenderConfigure extends LitElement {
static override styles = [
css`
.centerit {
.centerit {
text-align: center;
}
@ -25,19 +25,31 @@ export class LavenderConfigure extends LitElement {
}
.widgets {
width: 100%;
display: flex;
flex-direction: column;
flex-wrap: wrap;
flex-direction: row;
}
.widgets >* {
flex: 1 1 300px;
margin: .2em;
padding: .5em;
border: .1em solid black;
border-radius: .5em;
}
.widget-edit {
display: flex;
flex-direction: row;
}
.widget-edit >* {
margin: .2em;
padding: .5em;
width: 100%;
}
input {
width: 50%;
width: 100%;
padding: .5em;
border-radius: .5em;
}
@ -88,16 +100,16 @@ export class LavenderConfigure extends LitElement {
${widgets.map((widget: any) => {
return html`
<div name="widget-edit">
<div><span>Title</span><input type="text" name="titleEdit" value="${widget.title}"></div>
<div><span>Href</span><input type="text" name="urlEdit" value="${widget.url}"></div>
<div><span>Height</span><input type="text" name="urlHeight" value="${widget.height}"></div>
<div><div>Title</div><input type="text" name="titleEdit" value="${widget.title}"></div>
<div><div>Href</div><input type="text" name="urlEdit" value="${widget.url}"></div>
<div><div>Height</div><input type="text" name="urlHeight" value="${widget.height}"></div>
</div>
`;
`;
})}
<div name="widget-edit">
<div><span>Title </span><input type="text" name="titleEdit"></div >
<div><span>Href </span><input type="text" name="urlEdit"></div >
<div><span>Height</span><input type="text" name="urlHeight"></div>
<div><div>Title </div><input type="text" name="titleEdit"></div >
<div><div>Href </div><input type="text" name="urlEdit"></div >
<div><div>Height</div><input type="text" name="urlHeight"></div>
</div>
</div>
<button class="button" @click="${() => this.save()}">Save</button>