fierj
PublicTiny personal git forge
{{define "head"}}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><rect width='16' height='16' rx='3' fill='%2324292f'/><text x='8' y='12' font-size='11' text-anchor='middle' fill='white' font-family='sans-serif'>fj</text></svg>">
<title>{{block "title" .}}fierj{{end}}</title>
<style>
:root {
--font-mono: 'SF Mono', 'Menlo', 'Consolas', monospace;
--font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
--space-xs: 0.25rem;
--space-sm: 0.5rem;
--space-md: 1rem;
--space-lg: 1.5rem;
--space-xl: 2rem;
--radius: 6px;
--radius-sm: 4px;
--max-width: 980px;
--bg: #ffffff;
--bg-page: #f6f8fa;
--bg-subtle: #f6f8fa;
--bg-inset: #eff2f5;
--bg-topbar: #24292f;
--border: #d0d7de;
--border-subtle: #d8dee4;
--text: #1f2328;
--text-secondary: #656d76;
--text-tertiary: #8c959f;
--text-link: #0969da;
--text-topbar: #ffffff;
--accent: #0969da;
--accent-subtle: #ddf4ff;
--accent-hover: #0550ae;
--success: #1a7f37;
--danger: #cf222e;
--diff-add-bg: #ccffd8;
--diff-del-bg: #ffd7d5;
--diff-add: #1a7f37;
--diff-del: #cf222e;
--shadow: 0 1px 3px rgba(31, 35, 40, 0.04);
}
@media (prefers-color-scheme: dark) {
:root {
--bg: #0d1117;
--bg-page: #010409;
--bg-subtle: #161b22;
--bg-inset: #1c2128;
--bg-topbar: #161b22;
--border: #30363d;
--border-subtle: #21262d;
--text: #e6edf3;
--text-secondary: #8b949e;
--text-tertiary: #6e7681;
--text-link: #58a6ff;
--text-topbar: #f0f6fc;
--accent: #58a6ff;
--accent-subtle: #0c2d6b;
--accent-hover: #79c0ff;
--success: #3fb950;
--danger: #f85149;
--diff-add-bg: #0d2818;
--diff-del-bg: #3c1420;
--diff-add: #3fb950;
--diff-del: #f85149;
--shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
}
[data-theme="dark"] {
--bg: #0d1117;
--bg-page: #010409;
--bg-subtle: #161b22;
--bg-inset: #1c2128;
--bg-topbar: #161b22;
--border: #30363d;
--border-subtle: #21262d;
--text: #e6edf3;
--text-secondary: #8b949e;
--text-tertiary: #6e7681;
--text-link: #58a6ff;
--text-topbar: #f0f6fc;
--accent: #58a6ff;
--accent-subtle: #0c2d6b;
--accent-hover: #79c0ff;
--success: #3fb950;
--danger: #f85149;
--diff-add-bg: #0d2818;
--diff-del-bg: #3c1420;
--diff-add: #3fb950;
--diff-del: #f85149;
--shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
[data-theme="light"] {
--bg: #ffffff;
--bg-page: #f6f8fa;
--bg-subtle: #f6f8fa;
--bg-inset: #eff2f5;
--bg-topbar: #24292f;
--border: #d0d7de;
--border-subtle: #d8dee4;
--text: #1f2328;
--text-secondary: #656d76;
--text-tertiary: #8c959f;
--text-link: #0969da;
--text-topbar: #ffffff;
--accent: #0969da;
--accent-subtle: #ddf4ff;
--accent-hover: #0550ae;
--success: #1a7f37;
--danger: #cf222e;
--diff-add-bg: #ccffd8;
--diff-del-bg: #ffd7d5;
--diff-add: #1a7f37;
--diff-del: #cf222e;
--shadow: 0 1px 3px rgba(31, 35, 40, 0.04);
}
*,
*::before,
*::after {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: var(--font-sans);
font-size: 14px;
line-height: 1.5;
color: var(--text);
background: var(--bg-page);
}
a {
color: var(--text-link);
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
/* Top bar */
.topbar {
background: var(--bg-topbar);
padding: var(--space-sm) var(--space-lg);
display: flex;
align-items: center;
gap: var(--space-md);
position: sticky;
top: 0;
z-index: 100;
}
.topbar a,
.topbar .logo {
color: var(--text-topbar);
text-decoration: none;
}
.topbar .logo {
font-weight: 700;
font-size: 1rem;
display: flex;
align-items: center;
gap: var(--space-sm);
}
.topbar .spacer {
flex: 1;
}
.topbar .nav-link {
font-size: 0.85rem;
padding: var(--space-xs) var(--space-sm);
border-radius: var(--radius-sm);
}
.topbar .nav-link:hover {
background: rgba(255, 255, 255, 0.1);
text-decoration: none;
}
.topbar button {
background: none;
border: none;
color: var(--text-topbar);
cursor: pointer;
padding: var(--space-xs);
border-radius: var(--radius-sm);
display: flex;
align-items: center;
}
.topbar button:hover {
background: rgba(255, 255, 255, 0.1);
}
/* Main container */
.container {
max-width: var(--max-width);
margin: 0 auto;
padding: var(--space-lg) var(--space-md);
}
/* Repo header */
.repo-header {
display: flex;
align-items: center;
gap: var(--space-sm);
margin-bottom: var(--space-xs);
}
.repo-header .repo-icon {
color: var(--text-secondary);
}
.repo-header h1 {
font-size: 1.25rem;
font-weight: 400;
margin: 0;
}
.repo-header h1 a {
font-weight: 600;
}
.repo-header .visibility {
font-size: 0.7rem;
border: 1px solid var(--border);
border-radius: 2em;
padding: 0.1rem 0.5rem;
color: var(--text-secondary);
font-weight: 500;
}
.repo-desc {
color: var(--text-secondary);
margin-bottom: var(--space-md);
font-size: 0.9rem;
}
/* Tabs (code/issues/prs) */
.repo-tabs {
display: flex;
gap: 0;
border-bottom: 1px solid var(--border);
margin-bottom: var(--space-lg);
}
.repo-tabs a {
display: flex;
align-items: center;
gap: var(--space-xs);
padding: var(--space-sm) var(--space-md);
color: var(--text-secondary);
font-size: 0.85rem;
border-bottom: 2px solid transparent;
margin-bottom: -1px;
}
.repo-tabs a:hover {
text-decoration: none;
color: var(--text);
}
.repo-tabs a.active {
color: var(--text);
font-weight: 600;
border-bottom-color: var(--accent);
}
.repo-tabs .icon {
width: 16px;
height: 16px;
}
.repo-tabs .count {
background: var(--bg-inset);
border-radius: 2em;
padding: 0 0.5rem;
font-size: 0.75rem;
font-weight: 500;
min-width: 1.2rem;
text-align: center;
}
/* Branch/clone bar */
.code-bar {
display: flex;
align-items: center;
gap: var(--space-sm);
margin-bottom: var(--space-md);
flex-wrap: wrap;
}
.branch-picker {
display: inline-flex;
align-items: center;
gap: var(--space-xs);
background: var(--bg-subtle);
border: 1px solid var(--border);
padding: var(--space-xs) var(--space-sm);
border-radius: var(--radius);
font-size: 0.85rem;
font-weight: 500;
}
.branch-picker .icon {
width: 14px;
height: 14px;
color: var(--text-secondary);
}
.code-bar .spacer {
flex: 1;
}
.clone-btn {
display: inline-flex;
align-items: center;
gap: var(--space-xs);
background: var(--bg-subtle);
border: 1px solid var(--border);
padding: var(--space-xs) var(--space-sm);
border-radius: var(--radius);
font-family: var(--font-mono);
font-size: 0.8rem;
color: var(--text-secondary);
}
/* File table */
.file-table {
border: 1px solid var(--border);
border-radius: var(--radius);
overflow: hidden;
background: var(--bg);
}
.file-table-header {
background: var(--bg-subtle);
padding: var(--space-sm) var(--space-md);
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
gap: var(--space-sm);
font-size: 0.85rem;
}
.file-table-header .commit-msg {
color: var(--text-secondary);
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.file-table-header .commit-hash {
font-family: var(--font-mono);
font-size: 0.8rem;
color: var(--text-link);
}
.file-table-header .commit-date {
color: var(--text-tertiary);
white-space: nowrap;
}
.file-table table {
width: 100%;
border-collapse: collapse;
margin: 0;
}
.file-table td {
padding: var(--space-sm) var(--space-md);
border-top: 1px solid var(--border-subtle);
font-size: 0.85rem;
}
.file-table tr:first-child td {
border-top: none;
}
.file-table .col-name {
white-space: nowrap;
}
.file-table .col-msg {
color: var(--text-secondary);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 300px;
}
.file-table .col-date {
color: var(--text-tertiary);
white-space: nowrap;
text-align: right;
}
.file-table .entry {
display: flex;
align-items: center;
gap: var(--space-sm);
}
.file-table .icon {
width: 16px;
height: 16px;
flex-shrink: 0;
}
.file-table .icon-dir {
color: var(--accent);
}
.file-table .icon-file {
color: var(--text-tertiary);
}
/* Readme box */
.readme-box {
border: 1px solid var(--border);
border-radius: var(--radius);
margin-top: var(--space-md);
background: var(--bg);
}
.readme-box-header {
background: var(--bg-subtle);
padding: var(--space-sm) var(--space-md);
border-bottom: 1px solid var(--border);
font-size: 0.85rem;
font-weight: 600;
display: flex;
align-items: center;
gap: var(--space-sm);
}
.readme-box-body {
padding: var(--space-lg) var(--space-xl);
}
/* Code/blob view */
pre {
background: var(--bg-subtle);
border: 1px solid var(--border);
border-radius: var(--radius);
padding: var(--space-md);
overflow-x: auto;
margin: var(--space-md) 0;
font-family: var(--font-mono);
font-size: 13px;
line-height: 1.6;
}
code {
font-family: var(--font-mono);
font-size: 13px;
}
:not(pre)>code {
background: var(--bg-inset);
padding: 0.15rem 0.4rem;
border-radius: 3px;
font-size: 0.85em;
}
/* Buttons */
.btn {
display: inline-flex;
align-items: center;
gap: var(--space-xs);
padding: var(--space-sm) var(--space-md);
background: var(--accent);
color: #fff;
border: none;
border-radius: var(--radius);
cursor: pointer;
font-family: var(--font-sans);
font-size: 0.85rem;
font-weight: 500;
}
.btn:hover {
background: var(--accent-hover);
text-decoration: none;
}
.btn-subtle {
background: var(--bg-subtle);
color: var(--text);
border: 1px solid var(--border);
}
.btn-subtle:hover {
background: var(--bg-inset);
}
/* Forms */
input,
textarea {
font-family: var(--font-sans);
font-size: 0.9rem;
padding: var(--space-sm) var(--space-md);
background: var(--bg);
color: var(--text);
border: 1px solid var(--border);
border-radius: var(--radius);
width: 100%;
}
input:focus,
textarea:focus {
outline: none;
border-color: var(--accent);
box-shadow: 0 0 0 3px var(--accent-subtle);
}
label {
font-size: 0.85rem;
font-weight: 600;
display: block;
margin-bottom: var(--space-xs);
}
.form-group {
margin-bottom: var(--space-md);
}
/* Commit log */
.commit-list {
border: 1px solid var(--border);
border-radius: var(--radius);
background: var(--bg);
}
.commit-list-item {
display: flex;
align-items: center;
gap: var(--space-md);
padding: var(--space-sm) var(--space-md);
border-top: 1px solid var(--border-subtle);
}
.commit-list-item:first-child {
border-top: none;
}
.commit-list-item .msg {
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.commit-list-item .meta {
color: var(--text-tertiary);
font-size: 0.8rem;
white-space: nowrap;
}
.commit-list-item .hash {
font-family: var(--font-mono);
font-size: 0.8rem;
}
/* Empty state */
.empty-state {
border: 1px dashed var(--border);
border-radius: var(--radius);
padding: var(--space-xl) var(--space-lg);
text-align: center;
color: var(--text-secondary);
margin: var(--space-lg) 0;
}
.empty-state pre {
text-align: left;
display: inline-block;
margin-top: var(--space-md);
}
/* Breadcrumb */
.breadcrumb {
margin-bottom: var(--space-md);
color: var(--text-secondary);
font-size: 0.85rem;
}
/* Diff */
.diff-add {
color: var(--diff-add);
}
.diff-del {
color: var(--diff-del);
}
/* Markdown rendering */
.rendered-md {
line-height: 1.7;
}
.rendered-md h1,
.rendered-md h2 {
margin: var(--space-lg) 0 var(--space-sm);
padding-bottom: var(--space-xs);
border-bottom: 1px solid var(--border);
}
.rendered-md h3 {
margin: var(--space-md) 0 var(--space-sm);
}
.rendered-md p {
margin-bottom: var(--space-md);
}
.rendered-md ul,
.rendered-md ol {
padding-left: var(--space-xl);
margin-bottom: var(--space-md);
}
.rendered-md pre {
margin: var(--space-md) 0;
}
.rendered-md img {
max-width: 100%;
}
/* Threads */
.threads-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: var(--space-md);
}
.threads-state-toggle {
display: flex;
gap: var(--space-md);
}
.threads-state-toggle a {
display: flex;
align-items: center;
gap: 4px;
color: var(--text-secondary);
text-decoration: none;
font-size: 0.85rem;
}
.threads-state-toggle a.active {
color: var(--text-primary);
font-weight: 600;
}
.thread-list {
border: 1px solid var(--border);
border-radius: var(--radius);
overflow: hidden;
}
.thread-list-item {
display: flex;
align-items: flex-start;
gap: var(--space-sm);
padding: var(--space-sm) var(--space-md);
border-bottom: 1px solid var(--border);
}
.thread-list-item:last-child {
border-bottom: none;
}
.thread-list-item .icon {
width: 16px;
height: 16px;
flex-shrink: 0;
}
.thread-icon-open {
color: var(--diff-add);
margin-top: 2px;
}
.thread-icon-closed {
color: var(--accent);
margin-top: 2px;
}
.thread-list-content {
flex: 1;
min-width: 0;
overflow: hidden;
}
.thread-title {
font-weight: 600;
color: var(--text-primary);
text-decoration: none;
display: block;
}
.thread-title:hover {
color: var(--accent);
}
.thread-meta {
font-size: 0.75rem;
color: var(--text-secondary);
}
.thread-reply-count {
display: flex;
align-items: center;
gap: 4px;
color: var(--text-secondary);
font-size: 0.8rem;
flex-shrink: 0;
}
.refs-container {
display: flex;
flex-direction: column;
gap: var(--space-lg);
}
.refs-section h3 {
margin-bottom: var(--space-sm);
font-size: 0.9rem;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.05em;
}
.label-default {
font-size: 0.7rem;
padding: 2px 6px;
border-radius: 10px;
background: var(--accent);
color: white;
}
.thread-detail-header {
display: flex;
align-items: center;
gap: var(--space-sm);
margin-bottom: var(--space-xs);
}
.thread-detail-header h2 {
margin: 0;
font-size: 1.4rem;
}
.thread-state {
font-size: 0.75rem;
padding: 2px 8px;
border-radius: 999px;
font-weight: 600;
}
.thread-state-open {
background: var(--diff-add);
color: #fff;
}
.thread-state-closed {
background: var(--accent);
color: #fff;
}
.thread-meta-line {
font-size: 0.85rem;
color: var(--text-secondary);
margin-bottom: var(--space-lg);
}
.thread-comment {
border: 1px solid var(--border);
border-radius: var(--radius);
margin-bottom: var(--space-md);
}
.thread-comment-header {
display: flex;
justify-content: space-between;
padding: var(--space-sm) var(--space-md);
background: var(--bg-secondary);
border-bottom: 1px solid var(--border);
font-size: 0.85rem;
border-radius: var(--radius) var(--radius) 0 0;
}
.thread-comment-body {
padding: var(--space-md);
}
.thread-reply-form {
margin-top: var(--space-lg);
}
.thread-reply-form textarea {
width: 100%;
font-family: inherit;
font-size: 0.9rem;
padding: var(--space-sm);
border: 1px solid var(--border);
border-radius: var(--radius);
background: var(--bg-primary);
color: var(--text-primary);
resize: vertical;
}
.thread-actions {
display: flex;
gap: var(--space-sm);
margin-top: var(--space-sm);
}
.btn-secondary {
background: var(--bg-secondary);
color: var(--text-primary);
border: 1px solid var(--border);
padding: 6px 14px;
border-radius: var(--radius);
cursor: pointer;
font-size: 0.85rem;
}
.btn-secondary:hover {
background: var(--border);
}
.thread-new-form h2 {
margin-bottom: var(--space-md);
}
.patch-branches-hint {
font-size: 0.85rem;
color: var(--text-secondary);
margin-bottom: var(--space-md);
padding: var(--space-sm) var(--space-md);
background: var(--bg-secondary);
border-radius: var(--radius);
}
.patch-branches-hint code {
background: var(--bg-primary);
padding: 2px 6px;
border-radius: 3px;
font-size: 0.8rem;
}
/* Responsive */
@media (max-width: 768px) {
.container {
padding: var(--space-md) var(--space-sm);
}
.code-bar {
flex-direction: column;
align-items: stretch;
}
.file-table .col-msg,
.file-table .col-date {
display: none;
}
.commit-list-item .meta {
display: none;
}
}
</style>
</head>
<body>
<header class="topbar">
<a class="logo" href="/">
<svg width="20" height="20" viewBox="0 0 16 16" fill="currentColor">
<path
d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z" />
</svg>
fierj
</a>
<div class="spacer"></div>
<a class="nav-link" href="/new">+ New</a>
<button onclick="toggleTheme()" title="Toggle theme" aria-label="Toggle theme">
<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
<path d="M8 1a7 7 0 1 0 0 14A7 7 0 0 0 8 1Zm0 12.5V2.5a5.5 5.5 0 0 1 0 11Z" />
</svg>
</button>
</header>
<main class="container">
{{end}}
{{define "foot"}}
</main>
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11/build/highlight.min.js"></script>
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11/build/styles/github-dark.min.css">
<script>
function toggleTheme() {
const html = document.documentElement;
const current = html.getAttribute('data-theme');
const next = current === 'dark' ? 'light' : (current === 'light' ? 'dark' :
(window.matchMedia('(prefers-color-scheme: dark)').matches ? 'light' : 'dark'));
html.setAttribute('data-theme', next);
localStorage.setItem('theme', next);
}
(function () {
const saved = localStorage.getItem('theme');
if (saved) document.documentElement.setAttribute('data-theme', saved);
})();
document.querySelectorAll('pre code').forEach(el => hljs.highlightElement(el));
document.querySelectorAll('.markdown-body').forEach(el => {
el.innerHTML = marked.parse(el.textContent);
el.classList.add('rendered-md');
el.querySelectorAll('pre code').forEach(c => hljs.highlightElement(c));
});
</script>
</body>
</html>
{{end}}