Compare commits
9 Commits
cd6c579d9c
...
2024
| Author | SHA1 | Date | |
|---|---|---|---|
6143d0fdd9
|
|||
|
e34297f200
|
|||
|
ae31a90185
|
|||
|
89e0973c27
|
|||
|
6d7d0531ce
|
|||
|
2b29a561da
|
|||
|
9a3939f42e
|
|||
|
063f66fc6b
|
|||
|
8c91733d65
|
118
.github/workflows/release-docs.yml
vendored
118
.github/workflows/release-docs.yml
vendored
@@ -1,118 +0,0 @@
|
|||||||
name: Build and publish CMBA rulebooks (Gitea)
|
|
||||||
|
|
||||||
on:
|
|
||||||
push:
|
|
||||||
tags:
|
|
||||||
- "v*"
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
build-release:
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- name: Checkout
|
|
||||||
uses: actions/checkout@v4
|
|
||||||
|
|
||||||
- name: Install dependencies
|
|
||||||
run: |
|
|
||||||
sudo apt-get update
|
|
||||||
|
|
||||||
# texlive-latex-recommended \
|
|
||||||
# texlive-fonts-recommended \
|
|
||||||
# texlive-latex-extra \
|
|
||||||
|
|
||||||
sudo apt-get install -y pandoc \
|
|
||||||
jq \
|
|
||||||
curl
|
|
||||||
- name: Build pandoc after-body include (inline quote.js)
|
|
||||||
shell: bash
|
|
||||||
run: |
|
|
||||||
mkdir -p build
|
|
||||||
{
|
|
||||||
echo '<script>'
|
|
||||||
cat src/quote.js
|
|
||||||
echo '</script>'
|
|
||||||
} > build/after-body.html
|
|
||||||
|
|
||||||
- name: Build artifacts
|
|
||||||
run: |
|
|
||||||
set -euo pipefail
|
|
||||||
mkdir -p dist
|
|
||||||
|
|
||||||
for doc in cmba-bylaws; do
|
|
||||||
# Mobile-friendly HTML with TOC + serif styling
|
|
||||||
pandoc "src/${doc}.md" \
|
|
||||||
--toc \
|
|
||||||
--standalone \
|
|
||||||
--number-sections \
|
|
||||||
--toc-depth=2 \
|
|
||||||
--lua-filter src/shift-numbering.lua \
|
|
||||||
--metadata-file src/metadata.yml \
|
|
||||||
--embed-resources \
|
|
||||||
--metadata title="CMBA ${doc}" \
|
|
||||||
--include-after-body=build/after-body.html \
|
|
||||||
--css src/style.css \
|
|
||||||
-o "dist/${doc}.html"
|
|
||||||
|
|
||||||
# PDF
|
|
||||||
# pandoc "src/${doc}.md" \
|
|
||||||
# --metadata title="CMBA ${doc}" \
|
|
||||||
# -o "dist/${doc}.pdf"
|
|
||||||
done
|
|
||||||
|
|
||||||
# Include source markdown for transparency
|
|
||||||
cp src/${doc}.md dist/
|
|
||||||
|
|
||||||
- name: Create or update Gitea Release and upload assets
|
|
||||||
env:
|
|
||||||
GITEA_TOKEN: ${{ secrets.GITEA_TOKEN }}
|
|
||||||
GITEA_BASE_URL: ${{ secrets.GITEA_BASE_URL }}
|
|
||||||
# Gitea provides these variables in Actions:
|
|
||||||
REPO: ${{ gitea.repository }} # "owner/repo"
|
|
||||||
TAG: ${{ gitea.ref_name }} # e.g. "v2026.0"
|
|
||||||
run: |
|
|
||||||
set -euo pipefail
|
|
||||||
|
|
||||||
OWNER="$(echo "$REPO" | cut -d/ -f1)"
|
|
||||||
NAME="$(echo "$REPO" | cut -d/ -f2)"
|
|
||||||
API="${GITHUB_API_URL}"
|
|
||||||
AUTH="Authorization: token ${GITEA_TOKEN}"
|
|
||||||
|
|
||||||
echo "Repo: $OWNER/$NAME"
|
|
||||||
echo "Tag: $TAG"
|
|
||||||
echo "API: $API"
|
|
||||||
|
|
||||||
# Check if release exists for this tag
|
|
||||||
existing_release_json="$(curl -sS -H "$AUTH" \
|
|
||||||
"$API/repos/$OWNER/$NAME/releases/tags/$TAG" || true)"
|
|
||||||
|
|
||||||
if echo "$existing_release_json" | jq -e '.id' >/dev/null 2>&1; then
|
|
||||||
RELEASE_ID="$(echo "$existing_release_json" | jq -r '.id')"
|
|
||||||
echo "Release exists (id=$RELEASE_ID)."
|
|
||||||
else
|
|
||||||
echo "Creating release for tag $TAG..."
|
|
||||||
create_json="$(curl -sS -X POST -H "$AUTH" -H "Content-Type: application/json" \
|
|
||||||
"$API/repos/$OWNER/$NAME/releases" \
|
|
||||||
-d "$(jq -n --arg tag "$TAG" --arg name "$TAG" \
|
|
||||||
'{tag_name:$tag, name:$name, draft:false, prerelease:false, body:"CMBA rulebooks release."}')")"
|
|
||||||
RELEASE_ID="$(echo "$create_json" | jq -r '.id')"
|
|
||||||
echo "Created release (id=$RELEASE_ID)."
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Upload each file as an asset. If an asset already exists with same name, delete then re-upload.
|
|
||||||
assets_json="$(curl -sS -H "$AUTH" "$API/repos/$OWNER/$NAME/releases/$RELEASE_ID/assets" || echo '[]')"
|
|
||||||
|
|
||||||
for f in dist/*; do
|
|
||||||
filename="$(basename "$f")"
|
|
||||||
existing_asset_id="$(echo "$assets_json" | jq -r --arg n "$filename" '.[] | select(.name==$n) | .id' | head -n1 || true)"
|
|
||||||
|
|
||||||
if [ -n "${existing_asset_id:-}" ] && [ "$existing_asset_id" != "null" ]; then
|
|
||||||
echo "Deleting existing asset: $filename (id=$existing_asset_id)"
|
|
||||||
curl -sS -X DELETE -H "$AUTH" \
|
|
||||||
"$API/repos/$OWNER/$NAME/releases/$RELEASE_ID/assets/$existing_asset_id" >/dev/null
|
|
||||||
fi
|
|
||||||
echo "Uploading $filename"
|
|
||||||
curl -sS --fail -X POST -H "$AUTH" -H "Accept: application/json" -F "attachment=@$f" "$API/repos/$OWNER/$NAME/releases/$RELEASE_ID/assets?name=$filename" >/dev/null
|
|
||||||
done
|
|
||||||
|
|
||||||
echo "Done. Release page: ${GITEA_BASE_URL}/${OWNER}/${NAME}/releases/tag/${TAG}"
|
|
||||||
185
src/quote.js
185
src/quote.js
@@ -1,185 +0,0 @@
|
|||||||
(() => {
|
|
||||||
// Inject Quote buttons into Pandoc-style headings and copy a section-range quote to clipboard.
|
|
||||||
//
|
|
||||||
// Assumptions (matches your sample):
|
|
||||||
// - Headings are h1/h2 with stable ids (anchors).
|
|
||||||
// - A "section" is: the heading + all following sibling elements until the next heading
|
|
||||||
// of the same or higher level (H2 stops at next H2 or H1; H1 stops at next H1).
|
|
||||||
//
|
|
||||||
// Primary target: GroupMe. We optimize text/plain to be readable and "quote-like".
|
|
||||||
// We still provide text/html for rich paste targets (Docs/Email).
|
|
||||||
//
|
|
||||||
// No dependencies.
|
|
||||||
|
|
||||||
const HEADING_SELECTOR = "h1[id], h2[id]"; // change to "h2[id]" if you only want section-level
|
|
||||||
|
|
||||||
document.addEventListener("DOMContentLoaded", () => {
|
|
||||||
injectQuoteButtons();
|
|
||||||
});
|
|
||||||
|
|
||||||
function injectQuoteButtons() {
|
|
||||||
document.querySelectorAll(HEADING_SELECTOR).forEach((heading) => {
|
|
||||||
// Avoid double-injection
|
|
||||||
if (heading.querySelector(":scope > .quote-btn")) return;
|
|
||||||
|
|
||||||
const btn = document.createElement("button");
|
|
||||||
btn.type = "button";
|
|
||||||
btn.className = "quote-btn";
|
|
||||||
btn.textContent = "";
|
|
||||||
btn.innerHTML = `
|
|
||||||
<span class="quote-icon" aria-hidden="true"></span>
|
|
||||||
`;
|
|
||||||
btn.addEventListener("click", (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
e.stopPropagation();
|
|
||||||
onQuoteClick(btn, heading);
|
|
||||||
});
|
|
||||||
|
|
||||||
// Add a little separation from heading text
|
|
||||||
heading.appendChild(document.createTextNode(" "));
|
|
||||||
heading.appendChild(btn);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
async function onQuoteClick(btn, heading) {
|
|
||||||
const originalText = btn.textContent;
|
|
||||||
|
|
||||||
try {
|
|
||||||
btn.textContent = "Copying…";
|
|
||||||
btn.disabled = true;
|
|
||||||
|
|
||||||
await copyQuotedSection(heading);
|
|
||||||
|
|
||||||
btn.textContent = "Copied";
|
|
||||||
setTimeout(() => {
|
|
||||||
btn.textContent = originalText;
|
|
||||||
btn.disabled = false;
|
|
||||||
}, 800);
|
|
||||||
} catch (err) {
|
|
||||||
console.error(err);
|
|
||||||
btn.textContent = "Failed";
|
|
||||||
setTimeout(() => {
|
|
||||||
btn.textContent = originalText;
|
|
||||||
btn.disabled = false;
|
|
||||||
}, 1200);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function copyQuotedSection(heading) {
|
|
||||||
if (!heading.id) throw new Error("Heading missing id.");
|
|
||||||
|
|
||||||
const level = heading.tagName; // H1 or H2
|
|
||||||
|
|
||||||
// Clone heading + subsequent siblings for the quote range
|
|
||||||
const nodes = [];
|
|
||||||
nodes.push(heading.cloneNode(true));
|
|
||||||
|
|
||||||
let el = heading.nextElementSibling;
|
|
||||||
while (el) {
|
|
||||||
if (isBoundary(level, el)) break;
|
|
||||||
nodes.push(el.cloneNode(true));
|
|
||||||
el = el.nextElementSibling;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Remove injected button from cloned heading (so it doesn't show up in pasted content)
|
|
||||||
nodes[0].querySelector(".quote-btn")?.remove();
|
|
||||||
|
|
||||||
const container = document.createElement("div");
|
|
||||||
nodes.forEach((n) => container.appendChild(n));
|
|
||||||
|
|
||||||
const href = buildAnchorUrl(heading.id);
|
|
||||||
|
|
||||||
// HTML (for rich paste targets)
|
|
||||||
const html = buildHtmlQuote(container.innerHTML, href);
|
|
||||||
|
|
||||||
// Plain text (optimized for GroupMe)
|
|
||||||
const plain = buildGroupMePlainQuote(container, href);
|
|
||||||
|
|
||||||
await writeClipboardMultiFormat({ html, plain, url: href });
|
|
||||||
}
|
|
||||||
|
|
||||||
function isBoundary(level, el) {
|
|
||||||
// Stop at next heading of same or higher rank.
|
|
||||||
// H2 stops at next H1 or H2.
|
|
||||||
// H1 stops at next H1.
|
|
||||||
if (level === "H1") return el.tagName === "H1";
|
|
||||||
if (level === "H2") return el.tagName === "H1" || el.tagName === "H2";
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
function buildAnchorUrl(id) {
|
|
||||||
const url = new URL(window.location.href);
|
|
||||||
url.hash = id;
|
|
||||||
return url.toString();
|
|
||||||
}
|
|
||||||
|
|
||||||
function buildHtmlQuote(innerHtml, href) {
|
|
||||||
const safeHref = escapeHtmlAttr(href);
|
|
||||||
const safeText = escapeHtml(href);
|
|
||||||
|
|
||||||
return `
|
|
||||||
<blockquote>
|
|
||||||
${innerHtml}
|
|
||||||
<p><a href="${safeHref}">${safeText}</a></p>
|
|
||||||
</blockquote>
|
|
||||||
`.trim();
|
|
||||||
}
|
|
||||||
|
|
||||||
function buildGroupMePlainQuote(container, href) {
|
|
||||||
// Create a readable quote-like block:
|
|
||||||
// - Prefix lines with "> " to visually indicate quoting (works even if not rendered specially)
|
|
||||||
// - Include Source link
|
|
||||||
const text = normalizePlainText(container);
|
|
||||||
|
|
||||||
const quoted = text
|
|
||||||
.split("\n")
|
|
||||||
.map((line) => (line.trim().length ? `> ${line}` : `>`))
|
|
||||||
.join("\n");
|
|
||||||
|
|
||||||
return `${quoted}\n> \n> Source: ${href}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
function normalizePlainText(container) {
|
|
||||||
// Use innerText to approximate what the user sees (captures list numbering reasonably in many browsers).
|
|
||||||
// Then normalize spacing.
|
|
||||||
return (container.innerText || "")
|
|
||||||
.replace(/\r\n/g, "\n")
|
|
||||||
.replace(/\n{3,}/g, "\n\n")
|
|
||||||
.trim();
|
|
||||||
}
|
|
||||||
|
|
||||||
async function writeClipboardMultiFormat({ html, plain, url }) {
|
|
||||||
// Best path: multi-format clipboard write (Chromium/Edge, etc.)
|
|
||||||
if (navigator.clipboard?.write) {
|
|
||||||
const item = new ClipboardItem({
|
|
||||||
"text/html": new Blob([html], { type: "text/html" }),
|
|
||||||
"text/plain": new Blob([plain], { type: "text/plain" }),
|
|
||||||
// Best-effort URL type; some paste targets prefer this
|
|
||||||
"text/uri-list": new Blob([url], { type: "text/uri-list" }),
|
|
||||||
});
|
|
||||||
await navigator.clipboard.write([item]);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Fallback: plain text only
|
|
||||||
if (navigator.clipboard?.writeText) {
|
|
||||||
await navigator.clipboard.writeText(plain);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
throw new Error("Clipboard API unavailable.");
|
|
||||||
}
|
|
||||||
|
|
||||||
function escapeHtml(s) {
|
|
||||||
return String(s)
|
|
||||||
.replaceAll("&", "&")
|
|
||||||
.replaceAll("<", "<")
|
|
||||||
.replaceAll(">", ">")
|
|
||||||
.replaceAll('"', """)
|
|
||||||
.replaceAll("'", "'");
|
|
||||||
}
|
|
||||||
|
|
||||||
function escapeHtmlAttr(s) {
|
|
||||||
return escapeHtml(s);
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
309
src/style.css
309
src/style.css
@@ -1,309 +0,0 @@
|
|||||||
/* CMBA Rulebook CSS for Pandoc HTML
|
|
||||||
Compatible with Pandoc's default HTML structure:
|
|
||||||
- header#title-block-header
|
|
||||||
- nav#TOC[role="doc-toc"]
|
|
||||||
- headings with ids/classes like .unnumbered
|
|
||||||
*/
|
|
||||||
|
|
||||||
@import url("https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,400;0,700;1,400;1,700&display=swap");
|
|
||||||
|
|
||||||
:root{
|
|
||||||
--bg: #ffffff;
|
|
||||||
--fg: #111827; /* slate-900 */
|
|
||||||
--muted: #6b7280; /* gray-500 */
|
|
||||||
--border: #e5e7eb; /* gray-200 */
|
|
||||||
--card: #f9fafb; /* gray-50 */
|
|
||||||
--link: #1d4ed8; /* blue-700 */
|
|
||||||
--link-hover: #1e40af; /* blue-800 */
|
|
||||||
--code-bg: #0b1020; /* dark */
|
|
||||||
--code-fg: #e5e7eb;
|
|
||||||
|
|
||||||
--radius: 12px;
|
|
||||||
--content-max: 980px;
|
|
||||||
--toc-max: 320px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Base */
|
|
||||||
html { scroll-behavior: smooth; }
|
|
||||||
body{
|
|
||||||
margin: 0;
|
|
||||||
background: var(--bg);
|
|
||||||
color: var(--fg);
|
|
||||||
|
|
||||||
/* Rulebook serif stack */
|
|
||||||
font-family:
|
|
||||||
"Merriweather",
|
|
||||||
"Georgia",
|
|
||||||
"Times New Roman",
|
|
||||||
Times,
|
|
||||||
"Liberation Serif",
|
|
||||||
serif;
|
|
||||||
|
|
||||||
line-height: 1.6;
|
|
||||||
font-size: 16px;
|
|
||||||
text-rendering: optimizeLegibility;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Layout: single column on mobile, TOC sidebar on wide screens */
|
|
||||||
body{
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Give anchored headings a little offset for mobile browser bars */
|
|
||||||
h1[id], h2[id], h3[id], h4[id], h5[id], h6[id]{
|
|
||||||
scroll-margin-top: 84px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Main document container: Pandoc outputs direct children; we style them */
|
|
||||||
header#title-block-header,
|
|
||||||
nav#TOC,
|
|
||||||
main,
|
|
||||||
body > h1, body > h2, body > h3, body > h4, body > h5, body > h6,
|
|
||||||
body > p, body > ul, body > ol, body > table, body > blockquote, body > pre, body > hr,
|
|
||||||
body > dl{
|
|
||||||
max-width: var(--content-max);
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Title block */
|
|
||||||
header#title-block-header{
|
|
||||||
padding: 20px 16px 8px;
|
|
||||||
border-bottom: 1px solid var(--border);
|
|
||||||
margin-bottom: 8px;
|
|
||||||
}
|
|
||||||
header#title-block-header .title{
|
|
||||||
margin: 0 0 6px;
|
|
||||||
font-size: 1.75rem;
|
|
||||||
line-height: 1.2;
|
|
||||||
letter-spacing: -0.02em;
|
|
||||||
}
|
|
||||||
header#title-block-header .subtitle{
|
|
||||||
margin: 0 0 8px;
|
|
||||||
color: var(--muted);
|
|
||||||
}
|
|
||||||
header#title-block-header .author,
|
|
||||||
header#title-block-header .date{
|
|
||||||
margin: 0;
|
|
||||||
color: var(--muted);
|
|
||||||
font-size: 0.95rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* TOC card */
|
|
||||||
nav#TOC{
|
|
||||||
padding: 0 16px 12px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
nav#TOC > ul{
|
|
||||||
margin: 0;
|
|
||||||
padding: 14px 16px;
|
|
||||||
background: var(--card);
|
|
||||||
border: 1px solid var(--border);
|
|
||||||
border-radius: var(--radius);
|
|
||||||
}
|
|
||||||
nav#TOC ul{
|
|
||||||
list-style: none;
|
|
||||||
}
|
|
||||||
nav#TOC li{
|
|
||||||
margin: 6px 0;
|
|
||||||
}
|
|
||||||
nav#TOC a{
|
|
||||||
color: var(--link);
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
nav#TOC a:hover{
|
|
||||||
color: var(--link-hover);
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
nav#TOC ul ul{
|
|
||||||
margin-top: 6px;
|
|
||||||
padding-left: 14px;
|
|
||||||
border-left: 2px solid var(--border);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Content padding */
|
|
||||||
body > *{
|
|
||||||
padding-left: 16px;
|
|
||||||
padding-right: 16px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Headings */
|
|
||||||
h1, h2, h3, h4, h5, h6{
|
|
||||||
line-height: 1.25;
|
|
||||||
margin: 22px auto 10px;
|
|
||||||
letter-spacing: -0.01em;
|
|
||||||
}
|
|
||||||
h1{ font-size: 1.55rem; }
|
|
||||||
h2{ font-size: 1.25rem; }
|
|
||||||
h3{ font-size: 1.1rem; }
|
|
||||||
h4{ font-size: 1.0rem; }
|
|
||||||
h5{ font-size: 0.95rem; }
|
|
||||||
h6{ font-size: 0.9rem; color: var(--muted); }
|
|
||||||
|
|
||||||
/* Unnumbered headings (Pandoc uses .unnumbered sometimes) */
|
|
||||||
.unnumbered{
|
|
||||||
scroll-margin-top: 84px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Paragraphs and lists */
|
|
||||||
p{
|
|
||||||
margin: 0 auto 12px;
|
|
||||||
}
|
|
||||||
ul, ol{
|
|
||||||
margin: 0 auto 14px;
|
|
||||||
padding-left: 1.25rem;
|
|
||||||
}
|
|
||||||
li{
|
|
||||||
margin: 6px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Links */
|
|
||||||
a{
|
|
||||||
color: var(--link);
|
|
||||||
text-decoration-thickness: 2px;
|
|
||||||
text-underline-offset: 3px;
|
|
||||||
}
|
|
||||||
a:hover{
|
|
||||||
color: var(--link-hover);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Blockquotes */
|
|
||||||
blockquote{
|
|
||||||
margin: 14px auto;
|
|
||||||
padding: 10px 14px;
|
|
||||||
border-left: 4px solid var(--border);
|
|
||||||
background: var(--card);
|
|
||||||
border-radius: 10px;
|
|
||||||
color: #111827;
|
|
||||||
}
|
|
||||||
blockquote p{ margin: 0; }
|
|
||||||
|
|
||||||
/* Horizontal rule */
|
|
||||||
hr{
|
|
||||||
border: 0;
|
|
||||||
border-top: 1px solid var(--border);
|
|
||||||
margin: 18px auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Tables */
|
|
||||||
table{
|
|
||||||
width: 100%;
|
|
||||||
border-collapse: collapse;
|
|
||||||
margin: 14px auto 18px;
|
|
||||||
overflow: hidden;
|
|
||||||
border: 1px solid var(--border);
|
|
||||||
border-radius: var(--radius);
|
|
||||||
display: block; /* enables horizontal scroll on small screens */
|
|
||||||
}
|
|
||||||
thead th{
|
|
||||||
background: var(--card);
|
|
||||||
text-align: left;
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
th, td{
|
|
||||||
padding: 10px 12px;
|
|
||||||
border-bottom: 1px solid var(--border);
|
|
||||||
vertical-align: top;
|
|
||||||
}
|
|
||||||
tbody tr:last-child td{ border-bottom: 0; }
|
|
||||||
|
|
||||||
/* Code */
|
|
||||||
code{
|
|
||||||
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
|
||||||
font-size: 0.95em;
|
|
||||||
background: #f3f4f6;
|
|
||||||
padding: 0.12em 0.32em;
|
|
||||||
border-radius: 6px;
|
|
||||||
}
|
|
||||||
pre{
|
|
||||||
margin: 14px auto 18px;
|
|
||||||
padding: 12px 14px;
|
|
||||||
background: var(--code-bg);
|
|
||||||
color: var(--code-fg);
|
|
||||||
border-radius: var(--radius);
|
|
||||||
overflow: auto;
|
|
||||||
border: 1px solid rgba(255,255,255,0.08);
|
|
||||||
}
|
|
||||||
pre code{
|
|
||||||
background: transparent;
|
|
||||||
color: inherit;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.quote-icon {
|
|
||||||
display: inline-block;
|
|
||||||
width: 0.9em;
|
|
||||||
height: 0.9em;
|
|
||||||
vertical-align: middle;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-size: contain;
|
|
||||||
background-image: url("data:image/svg+xml;utf8,\
|
|
||||||
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'>\
|
|
||||||
<path fill='currentColor' d='M96 224c0-35.3 28.7-64 64-64h32V64H160C71.6 64 0 135.6 0 224v64c0 70.7 57.3 128 128 128h32V288h-32c-17.7 0-32-14.3-32-32v-32zm256 0c0-35.3 28.7-64 64-64h32V64h-32c-88.4 0-160 71.6-160 160v64c0 70.7 57.3 128 128 128h32V288h-32c-17.7 0-32-14.3-32-32v-32z'/>\
|
|
||||||
</svg>");
|
|
||||||
}
|
|
||||||
.quote-btn {
|
|
||||||
margin-left:.5rem;
|
|
||||||
font-size:.8em;
|
|
||||||
vertical-align:middle;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Small-screen polish */
|
|
||||||
@media (max-width: 520px){
|
|
||||||
header#title-block-header .title{ font-size: 1.45rem; }
|
|
||||||
body{ font-size: 16px; }
|
|
||||||
nav#TOC > ul{ padding: 12px 14px; }
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Wide-screen layout: TOC sidebar + content */
|
|
||||||
@media (min-width: 1080px){
|
|
||||||
body{
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: minmax(260px, var(--toc-max)) minmax(0, 1fr);
|
|
||||||
gap: 18px;
|
|
||||||
align-items: start;
|
|
||||||
padding: 18px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Remove the auto max-width behavior inside grid; we manage widths here */
|
|
||||||
header#title-block-header,
|
|
||||||
nav#TOC,
|
|
||||||
body > h1, body > h2, body > h3, body > h4, body > h5, body > h6,
|
|
||||||
body > p, body > ul, body > ol, body > table, body > blockquote, body > pre, body > hr,
|
|
||||||
body > dl{
|
|
||||||
max-width: none;
|
|
||||||
margin-left: 0;
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
header#title-block-header{
|
|
||||||
grid-column: 1 / -1;
|
|
||||||
padding: 16px 18px 10px;
|
|
||||||
border: 1px solid var(--border);
|
|
||||||
border-radius: var(--radius);
|
|
||||||
background: var(--bg);
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
nav#TOC{
|
|
||||||
grid-column: 1;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
position: sticky;
|
|
||||||
top: 18px;
|
|
||||||
max-height: calc(100vh - 36px);
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
nav#TOC > ul{
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Treat the rest of the content as column 2 */
|
|
||||||
body > :not(header#title-block-header):not(nav#TOC){
|
|
||||||
grid-column: 2;
|
|
||||||
padding-left: 0;
|
|
||||||
padding-right: 0;
|
|
||||||
max-width: var(--content-max);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user