import { html, type Raw } from './html.ts';
export function layout(title: string, body: Raw): string {
return `
${html`
${title}${body}
`}`;
}
/**
* Indicative brand accents. The written label is what actually identifies
* the platform; the colour is only there to make it recognisable at a
* glance.
*/
const ACCENT: Record = {
x: { color: '#0f1419', monogram: '✕' },
threads: { color: '#3b3b3b', monogram: '@' },
instagram: { color: '#c13584', monogram: 'IG' },
facebook: { color: '#0866ff', monogram: 'f' },
tiktok: { color: '#fe2c55', monogram: '♪' },
bluesky: { color: '#0085ff', monogram: 'B' },
reddit: { color: '#ff4500', monogram: 'r' },
};
export function badge(platform: string, label: string): Raw {
const accent = ACCENT[platform] ?? { color: '#666', monogram: '?' };
return html`${accent.monogram}${label}`;
}
/** The copy control, plus the URL itself so it is always selectable even if
* the clipboard API is unavailable.
*
* The open link ships hidden: followed in the browser the rewrite rules are
* installed in, it redirects straight back here, so it is only worth showing
* once a browser has been picked to hand it to. The script reveals it, and
* the href in the markup is the plain address it starts from. */
export function originalUrlBlock(originalUrl: string, platformLabel: string): Raw {
return html`