From b726dc1e244f1cdb88f7013fa4157372b107206c Mon Sep 17 00:00:00 2001 From: King Omar Date: Sat, 27 Jun 2026 03:13:53 +1000 Subject: [PATCH] Redesign petition SVG share image; remove flag/report button MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit SVG: clean two-zone layout — dark header with RADICAL wordmark + PETITION badge, full-width text area with left accent bar and large quote mark, footer band with signature count, author, date and CTA. Proper word-wrap centred in the card. Looks like a real share card now. Remove flag button and handleFlag from proposal cards entirely. Co-Authored-By: Claude Sonnet 4.6 --- index.html | 1 - worker.js | 137 +++++++++++++++++++++++++---------------------------- 2 files changed, 64 insertions(+), 74 deletions(-) diff --git a/index.html b/index.html index a5c8980..27bc162 100644 --- a/index.html +++ b/index.html @@ -1131,7 +1131,6 @@ function initializeShareButtons() { Share -
${formatDate(proposal.timestamp)}
diff --git a/worker.js b/worker.js index ce8d3f2..fbe33a4 100644 --- a/worker.js +++ b/worker.js @@ -2024,82 +2024,73 @@ async function servePetitionSVG(request, env) { * @returns {string} - SVG markup as a string */ function generatePetitionSVG(proposal) { - // Get data with fallbacks - const petitionText = proposal.text || "Unknown petition"; + const text = escapeHTML(proposal.text || 'Untitled petition'); const upvotes = proposal.upvotes || 0; - const downvotes = proposal.downvotes || 0; - const netVotes = upvotes - downvotes; - const netVotesDisplay = netVotes > 0 ? `+${netVotes}` : netVotes; - const netVotesColor = netVotes > 0 ? "#11cc77" : (netVotes < 0 ? "#ff0099" : "#ffffff"); - const proposalId = proposal.id || "unknown"; - - // Format timestamp - const timestamp = new Date(proposal.timestamp || Date.now()).toLocaleDateString('en-US', { - year: 'numeric', - month: 'short', - day: 'numeric' + const author = escapeHTML(proposal.author_name || 'Anonymous'); + const date = new Date(proposal.timestamp || Date.now()).toLocaleDateString('en-AU', { + day: 'numeric', month: 'short', year: 'numeric' }); - - // Base SVG template - const svgTemplate = ` - - - - - - - - - RADICAL - - - - VIBE, VOTE, VETO - - - - - - ${generateSVGTextLines(petitionText, 120, 220, 960)} - - - - - ▲ - ${upvotes} - - - ▼ - ${downvotes} - - - NET: - ${netVotesDisplay} - - - - - Petition ID: ${proposalId} • Created: ${timestamp} - - - - - - - RADICAL - PETITION - #${proposalId.slice(-6)} - - - - theradicalparty.com -`; - return svgTemplate; + // Word-wrap the petition text into lines (max ~52 chars per line at font-size 28) + const words = text.split(' '); + const lines = []; + let line = ''; + for (const word of words) { + if ((line + ' ' + word).trim().length > 52) { lines.push(line.trim()); line = word; } + else line = (line + ' ' + word).trim(); + } + if (line) lines.push(line); + const displayLines = lines.slice(0, 7); + if (lines.length > 7) displayLines[6] = displayLines[6].replace(/.{3}$/, '...'); + + const textY = 310 - (displayLines.length * 38) / 2; + const textEls = displayLines.map((l, i) => + `${l}` + ).join('\n '); + + return ` + + + + + + + + RADICAL + + VIBE · VOTE · VETO — theradicalparty.com + + + PETITION + + + + + + " + + ${textEls} + + + + + + + SIGNATURES + ${upvotes.toLocaleString()} + + + + + + PROPOSED BY + ${author} + ${date} + + + Sign this petition at + theradicalparty.com +`; } /**