- commit
- f78625aab5f9fd5916597a99d50c171ab31e9c94
- parent
- 1e9eebf91036a34599a02eb1e4894fda97fe55d2
- author
- Dami <dami.etoile@gmail.com>
| M | web/ | 7 | +++++++ |
| M | web/ | 16 | +++++++++++++++- |
@@ -192,3 +192,10 @@ button.roster-slot:hover .slot-x { color: var(--danger); }
192192 .roster-card { margin-bottom: 1.4rem; }193193 .sims-scroll { max-height: 22rem; }194194 }195+196+/* Identicons woven through pools, roster, and the sims list */197+.pool-item .identicon { margin-right: 0.45em; }198+.roster-slot .identicon { margin: 0 0.35em; }199+td.sim-parts .sim-part { display: inline-flex; align-items: center; margin-right: 0.8em; white-space: nowrap; }200+td.sim-parts .identicon { margin-right: 0.35em; }201+td.sim-parts .sim-part-name { color: var(--text-dim); }@@ -1,5 +1,6 @@
11 /** Simulate: compose a 2-8 tribe sim from own/liked/example scripts + my sims. */22 import './simulate.css';3+import { identicon } from '../identicon';34 import type { SimRecord } from '@tribes/protocol';45 import { EXAMPLE_ID_PREFIX, LIMITS, mapSizeForTribes } from '@tribes/protocol';56 import { api } from '../api';@@ -118,6 +119,7 @@ export function renderSimulate(main: HTMLElement, ctx: AppCtx): void {
118119 paintRoster();119120 } },120121 h('span', { class: 'slot-idx' }, String(i + 1)),122+ identicon(entry.id, entry.label, 16).el,121123 ` ${entry.label} `,122124 h('span', { class: 'slot-x' }, 'x'),123125 ),@@ -205,6 +207,7 @@ function makePool(title: string, onPick: (entry: PoolEntry) => void): Pool {
205207 h(206208 'button',207209 { class: 'pool-item', title: `add ${entry.label} to the roster`, onclick: () => onPick(entry) },210+ identicon(entry.id, entry.label, 18).el,208211 h('span', { class: 'pool-item-label' }, entry.label),209212 h('span', { class: 'pool-item-sub' }, entry.sub),210213 ),@@ -295,7 +298,18 @@ function paintSims(card: HTMLElement, sims: SimRecord[], refresh: () => Promise<
295298 h('td', null, simStarButton(sim, repaint)),296299 h('td', null, h('a', { href: `/s/${sim.id}`, class: 'mono' }, sim.id)),297300 h('td', { class: 'muted' }, fmtDate(sim.createdAt)),298- h('td', { class: 'muted' }, sim.scripts.map((s) => s.scriptName).join(' vs ')),301+ h(302+ 'td',303+ { class: 'sim-parts' },304+ sim.scripts.map((sc) =>305+ h(306+ 'span',307+ { class: 'sim-part', title: sc.scriptName },308+ identicon(sc.scriptId, sc.scriptName, 16).el,309+ h('span', { class: 'sim-part-name' }, sc.scriptName),310+ ),311+ ),312+ ),299313 h(300314 'td',301315 null,