Mercurial > code > home > repos > light9
annotate web/metrics/ServiceButtonRow.ts @ 2400:9a4bc2ea264e
ui tweaks and link fix
| author | drewp@bigasterisk.com |
|---|---|
| date | Fri, 17 May 2024 13:25:46 -0700 |
| parents | 4556eebe5d73 |
| children |
| rev | line source |
|---|---|
| 2033 | 1 import { LitElement, html, css } from "lit"; |
| 2 import { customElement, property } from "lit/decorators.js"; | |
| 3 export { StatsLine } from "./StatsLine"; | |
| 4 | |
| 5 @customElement("service-button-row") | |
| 6 export class ServiceButtonRow extends LitElement { | |
| 7 @property() name: string = "?"; | |
| 2400 | 8 @property({ type: Boolean, attribute: "metrics" }) hasMetrics: boolean = false; |
| 2033 | 9 static styles = [ |
| 10 css` | |
| 11 :host { | |
| 12 padding-bottom: 10px; | |
|
2280
e462853f1ef6
redo homepage and metrics calcs. still a mess
drewp@bigasterisk.com
parents:
2037
diff
changeset
|
13 border-bottom: 1px solid #333; |
| 2033 | 14 } |
| 15 a { | |
| 16 color: #7d7dec; | |
| 17 } | |
| 18 div { | |
| 19 display: flex; | |
| 20 justify-content: space-between; | |
| 21 padding: 2px 3px; | |
| 22 } | |
| 23 .left { | |
| 24 display: inline-block; | |
| 25 margin-right: 3px; | |
| 26 flex-grow: 1; | |
| 2357 | 27 min-width: 9em; |
| 2033 | 28 } |
| 29 .window { | |
| 30 } | |
| 31 .serviceGrid > td { | |
| 32 border: 5px solid red; | |
| 33 display: inline-block; | |
| 34 } | |
| 35 .big { | |
| 36 font-size: 120%; | |
| 37 display: inline-block; | |
| 38 padding: 10px 0; | |
| 39 } | |
| 40 | |
| 41 :host > div { | |
| 42 display: inline-block; | |
| 43 vertical-align: top; | |
| 44 } | |
| 45 :host > div:nth-child(2) { | |
| 46 width: 9em; | |
| 47 } | |
| 48 `, | |
| 49 ]; | |
| 50 | |
| 51 render() { | |
| 52 return html` | |
| 53 <div> | |
| 54 <div class="left"><a class="big" href="${this.name}/">${this.name}</a></div> | |
| 55 <div class="window"><button @click="${this.click}">window</button></div> | |
|
2280
e462853f1ef6
redo homepage and metrics calcs. still a mess
drewp@bigasterisk.com
parents:
2037
diff
changeset
|
56 ${this.hasMetrics ? html`<div><a href="${this.name}/metrics">metrics</a></div>` : ""} |
| 2033 | 57 </div> |
| 58 | |
|
2280
e462853f1ef6
redo homepage and metrics calcs. still a mess
drewp@bigasterisk.com
parents:
2037
diff
changeset
|
59 ${this.hasMetrics ? html`<div id="stats"><stats-line name="${this.name}"></div>` : ""} |
| 2400 | 60 `; |
| 2033 | 61 } |
| 62 | |
| 63 click() { | |
| 2400 | 64 window.open("/" + this.name + "/", "_blank", "scrollbars=1,resizable=1,titlebar=0,location=0"); |
| 2033 | 65 } |
| 66 } |