Skip to content

Commit 88d8210

Browse files
KSemenenkoKSemenenko
committed
more updates for website
1 parent 6e3f6be commit 88d8210

2 files changed

Lines changed: 48 additions & 37 deletions

File tree

‎scripts/build-site.mjs‎

Lines changed: 34 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -274,7 +274,7 @@ const page = `<!DOCTYPE html>
274274
</div>
275275
276276
<button class="back-to-top" aria-label="Back to top" onclick="window.scrollTo({top:0,behavior:'smooth'})">
277-
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"><path d="M10 16V4m0 0l-5 5m5-5l5 5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
277+
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" aria-hidden="true"><path d="M10 16V4m0 0l-5 5m5-5l5 5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
278278
</button>
279279
280280
<script>
@@ -341,7 +341,7 @@ for (const ex of tpsExamples) {
341341

342342
await writeFile(path.join(distDir, "examples", "index.html"), buildExamplesIndexPage(tpsExamples, styles), "utf8");
343343

344-
await writeFile(path.join(distDir, "sitemap.xml"), buildSitemapXml(siteUrl, dateModifiedIso), "utf8");
344+
await writeFile(path.join(distDir, "sitemap.xml"), buildSitemapXml(siteUrl, dateModifiedIso, tpsExamples), "utf8");
345345
await writeFile(path.join(distDir, "robots.txt"), buildRobotsTxt(siteUrl), "utf8");
346346
await writeFile(
347347
path.join(distDir, "llms.txt"),
@@ -668,7 +668,14 @@ function renderQuickAnswers(entries) {
668668
.join("");
669669
}
670670

671-
function buildSitemapXml(siteUrl, dateModifiedIso) {
671+
function buildSitemapXml(siteUrl, dateModifiedIso, examples = []) {
672+
const exampleUrls = examples.map(ex => ` <url>
673+
<loc>${siteUrl}examples/${ex.slug}.html</loc>
674+
<lastmod>${dateModifiedIso}</lastmod>
675+
<changefreq>monthly</changefreq>
676+
<priority>0.6</priority>
677+
</url>`).join("\n");
678+
672679
return `<?xml version="1.0" encoding="UTF-8"?>
673680
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
674681
<url>
@@ -677,6 +684,13 @@ function buildSitemapXml(siteUrl, dateModifiedIso) {
677684
<changefreq>weekly</changefreq>
678685
<priority>1.0</priority>
679686
</url>
687+
<url>
688+
<loc>${siteUrl}examples/</loc>
689+
<lastmod>${dateModifiedIso}</lastmod>
690+
<changefreq>weekly</changefreq>
691+
<priority>0.8</priority>
692+
</url>
693+
${exampleUrls}
680694
</urlset>
681695
`;
682696
}
@@ -756,15 +770,15 @@ function normalizeVersion(value) {
756770

757771
function buildAiButtonsHtml(chatgptUrl, claudeUrl, geminiUrl) {
758772
return `<a class="ai-btn ai-btn-chatgpt" href="${chatgptUrl}" target="_blank" rel="noopener">
759-
<svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M22.282 9.821a5.985 5.985 0 00-.516-4.91 6.046 6.046 0 00-6.51-2.9A6.065 6.065 0 0011.782.5a6.035 6.035 0 00-5.736 4.128 5.988 5.988 0 00-3.998 2.9 6.043 6.043 0 00.743 7.097 5.98 5.98 0 00.51 4.911 6.051 6.051 0 006.515 2.9A5.985 5.985 0 0013.282 24a6.04 6.04 0 005.74-4.122 5.993 5.993 0 003.998-2.9 6.04 6.04 0 00-.738-7.157z"/></svg>
773+
<svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M22.282 9.821a5.985 5.985 0 00-.516-4.91 6.046 6.046 0 00-6.51-2.9A6.065 6.065 0 0011.782.5a6.035 6.035 0 00-5.736 4.128 5.988 5.988 0 00-3.998 2.9 6.043 6.043 0 00.743 7.097 5.98 5.98 0 00.51 4.911 6.051 6.051 0 006.515 2.9A5.985 5.985 0 0013.282 24a6.04 6.04 0 005.74-4.122 5.993 5.993 0 003.998-2.9 6.04 6.04 0 00-.738-7.157z"/></svg>
760774
Ask ChatGPT
761775
</a>
762776
<a class="ai-btn ai-btn-claude" href="${claudeUrl}" target="_blank" rel="noopener">
763-
<svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M4.709 15.955l4.397-10.986a.469.469 0 01.862-.008l4.5 10.994h-2.033l-1.14-2.824H7.853l-1.122 2.824H4.709zm6.063-4.506l-1.727-4.43-1.78 4.43h3.507zM14.953 15.955V4.577h1.86v11.378h-1.86z"/></svg>
777+
<svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M4.709 15.955l4.397-10.986a.469.469 0 01.862-.008l4.5 10.994h-2.033l-1.14-2.824H7.853l-1.122 2.824H4.709zm6.063-4.506l-1.727-4.43-1.78 4.43h3.507zM14.953 15.955V4.577h1.86v11.378h-1.86z"/></svg>
764778
Ask Claude
765779
</a>
766780
<a class="ai-btn ai-btn-gemini" href="${geminiUrl}" target="_blank" rel="noopener">
767-
<svg width="18" height="18" viewBox="0 0 24 24" fill="none"><path d="M12 0C12 6.627 6.627 12 0 12c6.627 0 12 5.373 12 12 0-6.627 5.373-12 12-12-6.627 0-12-5.373-12-12z" fill="url(#gem-g)"/><defs><linearGradient id="gem-g" x1="0" y1="0" x2="24" y2="24"><stop stop-color="#4285F4"/><stop offset=".5" stop-color="#9B72CB"/><stop offset="1" stop-color="#D96570"/></linearGradient></defs></svg>
781+
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M12 0C12 6.627 6.627 12 0 12c6.627 0 12 5.373 12 12 0-6.627 5.373-12 12-12-6.627 0-12-5.373-12-12z" fill="url(#gem-g)"/><defs><linearGradient id="gem-g" x1="0" y1="0" x2="24" y2="24"><stop stop-color="#4285F4"/><stop offset=".5" stop-color="#9B72CB"/><stop offset="1" stop-color="#D96570"/></linearGradient></defs></svg>
768782
Ask Gemini
769783
</a>`;
770784
}
@@ -952,15 +966,15 @@ function buildExamplePage(ex, css) {
952966
<nav class="top-nav scrolled">
953967
<div class="nav-inner">
954968
<a class="nav-logo" href="../">
955-
<svg width="24" height="24" viewBox="0 0 28 28" fill="none"><rect width="28" height="28" rx="8" fill="url(#ng)"/><path d="M7 9h14M7 14h10M7 19h12" stroke="#faf8f4" stroke-width="2.2" stroke-linecap="round"/><defs><linearGradient id="ng" x1="0" y1="0" x2="28" y2="28"><stop stop-color="#b8963e"/><stop offset="1" stop-color="#d4a847"/></linearGradient></defs></svg>
969+
<svg width="24" height="24" viewBox="0 0 28 28" fill="none" aria-hidden="true"><rect width="28" height="28" rx="8" fill="url(#ng)"/><path d="M7 9h14M7 14h10M7 19h12" stroke="#faf8f4" stroke-width="2.2" stroke-linecap="round"/><defs><linearGradient id="ng" x1="0" y1="0" x2="28" y2="28"><stop stop-color="#b8963e"/><stop offset="1" stop-color="#d4a847"/></linearGradient></defs></svg>
956970
<span>TPS Format</span>
957971
</a>
958972
<div class="nav-links">
959973
<a href="../#specification">Spec</a>
960974
<a href="../">Home</a>
961975
<a href="https://prompter.one" target="_blank" rel="noopener">Prompter One</a>
962976
<a class="nav-gh" href="https://github.com/managedcode/TPS" target="_blank" rel="noopener">
963-
<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0016 8c0-4.42-3.58-8-8-8z"/></svg>
977+
<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0016 8c0-4.42-3.58-8-8-8z"/></svg>
964978
GitHub
965979
</a>
966980
</div>
@@ -977,7 +991,7 @@ function buildExamplePage(ex, css) {
977991
</p>
978992
<p class="example-desc">${escapeHtml(exDesc)}</p>
979993
980-
<div class="ai-buttons" style="margin-bottom:1rem;">
994+
<div class="ai-buttons">
981995
${renderAiButtons(exAiPrompt)}
982996
</div>
983997
@@ -987,10 +1001,10 @@ function buildExamplePage(ex, css) {
9871001
9881002
<h2>Raw Source</h2>
9891003
<p class="example-section-desc">The complete <code>.tps</code> file &mdash; valid markdown you can open in any text editor.</p>
990-
<pre style="padding:1rem;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--bg-warm);color:var(--text);font-size:0.85rem;line-height:1.6;white-space:pre-wrap;word-wrap:break-word;"><code>${escapeHtml(ex.content)}</code></pre>
1004+
<pre class="example-raw-source"><code>${escapeHtml(ex.content)}</code></pre>
9911005
</div>
9921006
993-
<footer class="site-footer" style="max-width:960px;margin:1rem auto 2rem;padding:0 1rem;">
1007+
<footer class="site-footer example-footer">
9941008
<span>Copyright &copy; Managed Code</span>
9951009
<span>Licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a></span>
9961010
</footer>
@@ -1153,7 +1167,7 @@ function buildExamplesIndexPage(examples, css) {
11531167
return `<a class="example-link" href="${ex.slug}.html">
11541168
<strong>${escapeHtml(ex.meta.title || ex.file)}</strong>
11551169
<span>${escapeHtml(desc)}</span>
1156-
<div style="margin-top:0.5rem;display:flex;gap:0.3rem;flex-wrap:wrap;">
1170+
<div class="example-tags">
11571171
<span class="example-badge">Editor</span>
11581172
<span class="example-badge">Teleprompter</span>
11591173
<span class="example-badge">Source</span>
@@ -1184,15 +1198,15 @@ function buildExamplesIndexPage(examples, css) {
11841198
<nav class="top-nav scrolled">
11851199
<div class="nav-inner">
11861200
<a class="nav-logo" href="../">
1187-
<svg width="24" height="24" viewBox="0 0 28 28" fill="none"><rect width="28" height="28" rx="8" fill="url(#ng)"/><path d="M7 9h14M7 14h10M7 19h12" stroke="#faf8f4" stroke-width="2.2" stroke-linecap="round"/><defs><linearGradient id="ng" x1="0" y1="0" x2="28" y2="28"><stop stop-color="#8B7355"/><stop offset="1" stop-color="#C4A060"/></linearGradient></defs></svg>
1201+
<svg width="24" height="24" viewBox="0 0 28 28" fill="none" aria-hidden="true"><rect width="28" height="28" rx="8" fill="url(#ng)"/><path d="M7 9h14M7 14h10M7 19h12" stroke="#faf8f4" stroke-width="2.2" stroke-linecap="round"/><defs><linearGradient id="ng" x1="0" y1="0" x2="28" y2="28"><stop stop-color="#8B7355"/><stop offset="1" stop-color="#C4A060"/></linearGradient></defs></svg>
11881202
<span>TPS Format</span>
11891203
</a>
11901204
<div class="nav-links">
11911205
<a href="../#specification">Spec</a>
11921206
<a href="../">Home</a>
11931207
<a href="https://prompter.one" target="_blank" rel="noopener">Prompter One</a>
11941208
<a class="nav-gh" href="https://github.com/managedcode/TPS" target="_blank" rel="noopener">
1195-
<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0016 8c0-4.42-3.58-8-8-8z"/></svg>
1209+
<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0016 8c0-4.42-3.58-8-8-8z"/></svg>
11961210
GitHub
11971211
</a>
11981212
</div>
@@ -1205,10 +1219,10 @@ function buildExamplesIndexPage(examples, css) {
12051219
<a href="../">&larr; Back to spec</a> &middot;
12061220
Interactive examples showing how TPS scripts look in an editor and teleprompter.
12071221
</p>
1208-
<div class="ai-buttons" style="margin-bottom:1.2rem;">
1222+
<div class="ai-buttons">
12091223
${renderAiButtons()}
12101224
</div>
1211-
<div class="prompter-view" style="margin-bottom:1.2rem;">
1225+
<div class="prompter-view">
12121226
<div class="prompter-inner">
12131227
<div class="prompter-segment emo-warm">
12141228
<div class="prompter-segment-name"><span class="seg-dot"></span>DEMO &middot; WARM</div>
@@ -1222,16 +1236,16 @@ function buildExamplesIndexPage(examples, css) {
12221236
</div>
12231237
12241238
<h2>Choose an Example</h2>
1225-
<div class="examples-grid" style="margin-top:0.5rem;">
1239+
<div class="examples-grid">
12261240
${cards}
12271241
</div>
12281242
1229-
<div style="margin-top:1.5rem;padding:1rem;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--bg-warm);">
1230-
<p style="margin:0;color:var(--text-secondary);font-size:0.88rem;line-height:1.6;">Each example shows two views: the <strong>Teleprompter View</strong> (how <a href="https://prompter.one" target="_blank" rel="noopener">Prompter One</a> renders it for reading) and the <strong>Raw Source</strong> (the <code>.tps</code> file you can copy and use).</p>
1243+
<div class="examples-info-box">
1244+
<p>Each example shows two views: the <strong>Teleprompter View</strong> (how <a href="https://prompter.one" target="_blank" rel="noopener">Prompter One</a> renders it for reading) and the <strong>Raw Source</strong> (the <code>.tps</code> file you can copy and use).</p>
12311245
</div>
12321246
</div>
12331247
1234-
<footer class="site-footer" style="max-width:960px;margin:1.5rem auto 2rem;padding:0 1rem;">
1248+
<footer class="site-footer examples-index-footer">
12351249
<span>Copyright &copy; <a href="https://www.managed-code.com/" target="_blank" rel="noopener">Managed Code</a></span>
12361250
<span>Licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a></span>
12371251
</footer>

‎website/site.css‎

Lines changed: 14 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -304,8 +304,8 @@ pre code {
304304
border-radius: var(--radius-md);
305305
background: var(--gold-light); color: var(--gold);
306306
}
307-
.answer-card:nth-child(2) .answer-icon { background: var(--purple-light); color: var(--purple); }
308-
.answer-card:nth-child(3) .answer-icon { background: var(--blue-light); color: var(--blue); }
307+
.answer-card:nth-child(2) .answer-icon { background: rgba(124,58,237,0.08); color: var(--tps-purple); }
308+
.answer-card:nth-child(3) .answer-icon { background: rgba(37,99,235,0.08); color: var(--tps-blue); }
309309
.answer-card h3 { margin: 0; font-size: 1rem; font-weight: 700; }
310310
.answer-answer { margin: 0.45rem 0 0; color: var(--text-secondary); font-size: 0.88rem; line-height: 1.65; }
311311

@@ -667,22 +667,19 @@ pre code {
667667
.example-panel { display: none; padding: 1.25rem 0; }
668668
.example-panel.active { display: block; }
669669

670-
/* Editor view */
671-
.editor-view {
672-
border: 1px solid var(--line); border-radius: var(--radius-lg);
673-
background: var(--bg-card); overflow: hidden;
670+
.example-raw-source {
671+
padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius-lg);
672+
background: var(--bg-warm); color: var(--text);
673+
font-size: 0.85rem; line-height: 1.6; white-space: pre-wrap; word-wrap: break-word;
674674
}
675-
.editor-view pre {
676-
margin: 0; padding: 1.2rem; border-radius: 0;
677-
background: var(--bg-card); color: var(--text);
678-
font-size: 0.88rem; line-height: 1.7; white-space: pre-wrap; word-wrap: break-word;
679-
}
680-
.editor-view .ed-frontmatter { color: var(--muted); }
681-
.editor-view .ed-segment { color: var(--gold); font-weight: 700; }
682-
.editor-view .ed-block { color: var(--blue); font-weight: 700; }
683-
.editor-view .ed-tag { color: var(--purple); }
684-
.editor-view .ed-pause { color: var(--red); font-weight: 700; }
685-
.editor-view .ed-emphasis { color: var(--green); font-style: italic; }
675+
.example-footer { max-width: 960px; margin: 1rem auto 2rem; padding: 0 1rem; }
676+
.examples-index-footer { max-width: 960px; margin: 1.5rem auto 2rem; padding: 0 1rem; }
677+
.examples-info-box {
678+
margin-top: 1.5rem; padding: 1rem;
679+
border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--bg-warm);
680+
}
681+
.examples-info-box p { margin: 0; color: var(--text-secondary); font-size: 0.88rem; line-height: 1.6; }
682+
.example-tags { margin-top: 0.5rem; display: flex; gap: 0.3rem; flex-wrap: wrap; }
686683

687684
/* Prompter view — PrompterOne style */
688685
.prompter-view {

0 commit comments

Comments
 (0)