ssb: Make the profile layout a little friendlier.
All checks were successful
Build Tilde Friends / Build-All (push) Successful in 26m5s

This commit is contained in:
Cory McWilliams 2025-01-05 15:49:57 -05:00
parent f6e74f2526
commit c469ef23e6
2 changed files with 14 additions and 16 deletions

View File

@ -1,5 +1,5 @@
{ {
"type": "tildefriends-app", "type": "tildefriends-app",
"emoji": "🦀", "emoji": "🦀",
"previous": "&onr50/qdchNff8LbpgKSmYBhAXuiuCS5yUXE/8uSEaY=.sha256" "previous": "&Fukja09hc/jieMnfbFnQft1drL5lIR/du8wUQTKDYXc=.sha256"
} }

View File

@ -217,20 +217,18 @@ class TfProfileElement extends LitElement {
let edit_profile = this.editing let edit_profile = this.editing
? html` ? html`
<div style="flex: 1 0 50%; display: flex; flex-direction: column; gap: 8px"> <div style="flex: 1 0 50%; display: flex; flex-direction: column; gap: 8px">
<div class="w3-container"> <div>
<div> <label for="name">Name:</label>
<label for="name">Name:</label> <input class="w3-input w3-theme-d1" type="text" id="name" value=${this.editing.name} @input=${(event) => (this.editing = Object.assign({}, this.editing, {name: event.srcElement.value}))} placeholder="Choose a name"></input>
<input class="w3-input w3-theme-d1" type="text" id="name" value=${this.editing.name} @input=${(event) => (this.editing = Object.assign({}, this.editing, {name: event.srcElement.value}))}></input> </div>
</div> <div><label for="description">Description:</label></div>
<div><label for="description">Description:</label></div> <textarea class="w3-input w3-theme-d1" style="resize: vertical" rows="8" id="description" @input=${(event) => (this.editing = Object.assign({}, this.editing, {description: event.srcElement.value}))} placeholder="Tell people a little bit about yourself here, if you like.">${this.editing.description}</textarea>
<textarea class="w3-input w3-theme-d1" style="resize: vertical" rows="8" id="description" @input=${(event) => (this.editing = Object.assign({}, this.editing, {description: event.srcElement.value}))}>${this.editing.description}</textarea> <div>
<div> <label for="public_web_hosting">Public Web Hosting:</label>
<label for="public_web_hosting">Public Web Hosting:</label> <input class="w3-check w3-theme-d1" type="checkbox" id="public_web_hosting" ?checked=${this.editing.publicWebHosting} @input=${(event) => (self.editing = Object.assign({}, self.editing, {publicWebHosting: event.srcElement.checked}))}></input>
<input class="w3-check w3-theme-d1" type="checkbox" id="public_web_hosting" ?checked=${this.editing.publicWebHosting} @input=${(event) => (self.editing = Object.assign({}, self.editing, {publicWebHosting: event.srcElement.checked}))}></input> </div>
</div> <div>
<div> <button class="w3-button w3-theme-d1" @click=${this.attach_image}>Attach Image</button>
<button class="w3-button w3-theme-d1" @click=${this.attach_image}>Attach Image</button>
</div>
</div> </div>
</div>` </div>`
: null; : null;
@ -243,7 +241,7 @@ class TfProfileElement extends LitElement {
<p><tf-user id=${this.id} .users=${this.users}></tf-user> (${tfutils.human_readable_size(this.size)})</p> <p><tf-user id=${this.id} .users=${this.users}></tf-user> (${tfutils.human_readable_size(this.size)})</p>
</header> </header>
<div class="w3-container"> <div class="w3-container">
<div style="display: flex; flex-direction: row"> <div class="w3-margin-bottom" style="display: flex; flex-direction: row">
<input type="text" class="w3-input w3-border w3-theme-d1" style="display: flex 1 1" readonly value=${this.id}></input> <input type="text" class="w3-input w3-border w3-theme-d1" style="display: flex 1 1" readonly value=${this.id}></input>
<button class="w3-button w3-theme-d1 w3-ripple" style="flex: 0 0 auto" @click=${this.copy_id}>Copy</button> <button class="w3-button w3-theme-d1 w3-ripple" style="flex: 0 0 auto" @click=${this.copy_id}>Copy</button>
</div> </div>