Mercurial > code > home > repos > front-door-display
comparison src/FdCountdown.ts @ 17:472003015880
restyle using css grid
author | drewp@bigasterisk.com |
---|---|
date | Fri, 07 Jun 2024 21:22:37 -0700 |
parents | 20d1fa4250c0 |
children | e8c90d893919 |
comparison
equal
deleted
inserted
replaced
16:719c8cc4d8b2 | 17:472003015880 |
---|---|
14 shared, | 14 shared, |
15 css` | 15 css` |
16 ol { | 16 ol { |
17 list-style: none; | 17 list-style: none; |
18 font-size: 16px; | 18 font-size: 16px; |
19 background: #cd66bb2e; | |
20 padding: 9px; | |
21 width: fit-content; | |
22 position: relative; | |
23 top: -21px; | |
24 border-radius: 14px; | |
25 } | 19 } |
26 span.d { | 20 span.d { |
27 opacity: 0.5; | 21 opacity: 0.5; |
28 } | 22 } |
29 li:has(.until) { | 23 li:has(.until) { |
73 }); | 67 }); |
74 this.evs = sortBy(this.evs, "start"); | 68 this.evs = sortBy(this.evs, "start"); |
75 }); | 69 }); |
76 } | 70 } |
77 render() { | 71 render() { |
78 return html`<h1 data-text="Coming Soon">Coming Soon</h1> | 72 return html`<h1>Coming Soon</h1> |
79 <ol> | 73 <ol> |
80 ${this.evs.map((d) => html`<li>In ${d.inHowLong()}, ${d.title}</li>`)} | 74 ${this.evs.map((d) => html`<li>In ${d.inHowLong()}, ${d.title}</li>`)} |
81 </ol> `; | 75 </ol> `; |
82 } | 76 } |
83 } | 77 } |