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 }