Back

Version 4

7/10/2024
// substrate + valtown badge
const left = 32;
const width = 160;
const height = 48; // width * 0.3;
const radius = 24;

const logotype = `
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 442 79" x="${left}" y="6" width="96" fill="#fff">
<path d="M92.182 67.387c3.89 0 7.064-1.082 9.524-3.248 2.459-2.164 3.689-5.046 3.689-8.644v-1.101H91.411c-2.57 0-4.589.551-6.056 1.652-1.47 1.101-2.202 2.642-2.202 4.624 0 1.982.771 3.598 2.312 4.845 1.542 1.249 3.78 1.872 6.717 1.872M89.76 78.618c-3.893 0-7.378-.679-10.461-2.037-3.083-1.357-5.524-3.339-7.322-5.946-1.8-2.604-2.698-5.78-2.698-9.524 0-3.744.898-6.882 2.698-9.415 1.798-2.532 4.294-4.44 7.487-5.725 3.193-1.284 6.844-1.927 10.956-1.927h14.975v-3.083c0-2.569-.809-4.68-2.422-6.332-1.616-1.651-4.185-2.477-7.708-2.477-3.451 0-6.02.79-7.708 2.367-1.69 1.58-2.791 3.617-3.303 6.111l-12.773-4.294c.881-2.789 2.294-5.34 4.239-7.653 1.944-2.312 4.551-4.183 7.818-5.615 3.266-1.431 7.248-2.147 11.947-2.147 7.193 0 12.883 1.8 17.067 5.395 4.184 3.598 6.276 8.809 6.276 15.636v20.37c0 2.202 1.028 3.304 3.083 3.304h4.404v11.451h-9.248c-2.717 0-4.956-.661-6.717-1.982-1.762-1.322-2.643-3.083-2.643-5.286V69.7h-2.092c-.294.88-.954 2.037-1.982 3.468-1.029 1.431-2.642 2.698-4.845 3.799-2.202 1.101-5.213 1.651-9.028 1.651M135.343-.001h13.874v77.077h-13.874zM211.318 77.077c-3.597 0-6.516-1.119-8.754-3.358-2.24-2.238-3.358-5.231-3.358-8.974V33.914h-13.654V22.462h13.654V5.505h13.873v16.957h14.976v11.452h-14.976v28.408c0 2.202 1.028 3.304 3.084 3.304h10.57v11.451h-15.415ZM263.51 66.286c4.257 0 7.78-1.376 10.571-4.129 2.789-2.753 4.184-6.698 4.184-11.837v-1.101c0-5.137-1.377-9.084-4.13-11.837-2.752-2.753-6.295-4.129-10.625-4.129-4.258 0-7.781 1.376-10.571 4.129-2.79 2.753-4.184 6.7-4.184 11.837v1.101c0 5.139 1.394 9.084 4.184 11.837s6.313 4.129 10.571 4.129m0 12.332c-5.433 0-10.314-1.101-14.645-3.303-4.332-2.202-7.745-5.396-10.24-9.58-2.496-4.184-3.744-9.211-3.744-15.085v-1.762c0-5.871 1.248-10.9 3.744-15.085 2.495-4.184 5.908-7.377 10.24-9.579 4.331-2.202 9.212-3.303 14.645-3.303 5.432 0 10.313 1.101 14.645 3.303 4.33 2.202 7.743 5.395 10.24 9.579 2.495 4.185 3.744 9.214 3.744 15.085v1.762c0 5.874-1.249 10.901-3.744 15.085-2.497 4.184-5.91 7.378-10.24 9.58-4.332 2.202-9.213 3.303-14.645 3.303M306.901 69.327l-6.614-46.865h13.763l4.845 45.255h1.982l5.861-37.632a9.008 9.008 0 0 1 8.901-7.623h6.813a9.008 9.008 0 0 1 8.901 7.623l5.861 37.632h1.982l4.845-45.255h13.763l-6.614 46.865a9.008 9.008 0 0 1-8.92 7.75h-7.472a9.009 9.009 0 0 1-8.901-7.623l-5.86-37.633h-1.983l-5.86 37.633a9.009 9.009 0 0 1-8.901 7.623h-7.472a9.008 9.008 0 0 1-8.92-7.75M388.815 77.077V22.462h13.654v7.158h1.982c.881-1.909 2.532-3.725 4.954-5.451 2.423-1.723 6.093-2.587 11.012-2.587 4.256 0 7.982.974 11.176 2.918 3.193 1.945 5.67 4.624 7.432 8.037 1.761 3.414 2.642 7.397 2.642 11.947v32.593h-13.873V45.585c0-4.109-1.01-7.193-3.028-9.249-2.02-2.054-4.9-3.083-8.644-3.083-4.258 0-7.561 1.415-9.91 4.239-2.35 2.827-3.523 6.772-3.523 11.837v27.748h-13.874ZM55.934 22.463 29.115 66.947h-1.982V30.185a7.722 7.722 0 0 0-7.722-7.722H13.26v45.606a9.009 9.009 0 0 0 9.008 9.009h10.007c4.643 0 8.934-2.477 11.257-6.497l27.8-48.118H55.934Z" />
<path d="M13.903 22.458H0V33.91h13.903z" />
</svg>
`;

export const badge = `
<svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${height}" viewBox="0 0 ${width} ${height}">
<rect width="${width}" height="${height}" fill="#111" rx="${radius}" ry="${radius}" />
<text x="32" y="16" textAnchor="start" fill="#fff" style="font-family:system-ui,sans-serif;font-weight:bold;font-size:10px;">
Fork it on
</text>
${logotype}
</svg>
`;

function getHREF(mod) {
const url = new URL(mod);
return `https://val.town${url.pathname}`;
}

export function getBadgeLink(url: string): string {
const href = getHREF(url);
return `<div>
<a href="${href}" target="_blank" style="text-decoration:none;color:inherit">${badge}</a>
<div>`;
}

function handler(req: Request): Response {
substrate-substratebadge.web.val.run
Updated: July 10, 2024