tenseleyflow/shithub / 6adccfc

+

+/* ========== Issues / Labels / Milestones (S21) ========== */

+.shithub-issues, .shithub-issue-view, .shithub-issue-new, .shithub-labels, .shithub-milestones {

+  max-width: 64rem;

+  margin: 1.5rem auto;

+  padding: 0 1rem;

+}

+.shithub-issues-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }

+.shithub-issues-actions { display: flex; gap: 0.4rem; }

+.shithub-issues-filter { display: flex; gap: 1.5rem; padding: 0.75rem 0; border-bottom: 1px solid var(--border-default); margin: 1rem 0; }

+.shithub-issues-tab { color: var(--fg-muted); padding: 0.25rem 0; border-bottom: 2px solid transparent; }

+.shithub-issues-tab-active { color: var(--fg-default); border-bottom-color: var(--accent-emphasis, #0969da); font-weight: 600; }

+.shithub-issues-dot { display: inline-block; width: 0.6rem; height: 0.6rem; border-radius: 50%; vertical-align: middle; margin-right: 0.25rem; }

+.shithub-issues-dot-open { background: #1a7f37; }

+.shithub-issues-dot-closed { background: #8250df; }

+.shithub-issues-list { list-style: none; padding: 0; margin: 0; }

+.shithub-issues-row {

+  display: flex; gap: 0.75rem; align-items: flex-start;

+  padding: 0.75rem 0.5rem;

+  border-bottom: 1px solid var(--border-default);

+}

+.shithub-issues-state { font-size: 1.1rem; line-height: 1.2; }

+.shithub-issues-state-open { color: #1a7f37; }

+.shithub-issues-state-closed { color: #8250df; }

+.shithub-issues-body { flex: 1; }

+.shithub-issues-title { font-weight: 600; color: var(--fg-default); }

+.shithub-issues-title:hover { color: var(--accent-emphasis, #0969da); }

+.shithub-issues-meta { color: var(--fg-muted); font-size: 0.85rem; margin-top: 0.2rem; }

+.shithub-issues-assignees { font-size: 0.85rem; }

+.shithub-issues-empty { color: var(--fg-muted); padding: 2rem; text-align: center; border: 1px dashed var(--border-default); border-radius: 6px; }

+.shithub-issue-num { color: var(--fg-muted); font-weight: 400; margin-left: 0.5rem; }

+.shithub-issue-title { display: flex; gap: 0.5rem; align-items: baseline; flex-wrap: wrap; }

+.shithub-issue-meta { color: var(--fg-muted); margin: 0.5rem 0 1rem; display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }

+.shithub-issue-grid { display: grid; grid-template-columns: 1fr 16rem; gap: 1.5rem; }

+@media (max-width: 768px) { .shithub-issue-grid { grid-template-columns: 1fr; } }

+.shithub-comment {

+  border: 1px solid var(--border-default);

+  border-radius: 6px;

+  margin-bottom: 1rem;

+  background: var(--canvas-default);

+}

+.shithub-comment-head {

+  padding: 0.5rem 0.75rem;

+  background: var(--canvas-subtle);

+  border-bottom: 1px solid var(--border-default);

+  font-size: 0.9rem;

+  color: var(--fg-muted);

+}

+.shithub-comment-body { padding: 0.75rem; }

+.shithub-event { color: var(--fg-muted); font-size: 0.85rem; padding: 0.4rem 0.75rem; border-left: 2px solid var(--border-default); margin-left: 0.75rem; }

+.shithub-event-kind { text-transform: lowercase; }

+.shithub-comment-form { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 1rem; }

+.shithub-comment-form textarea, .shithub-issue-form textarea, .shithub-issue-form input[type=text] {

+  font: inherit; padding: 0.5rem; border: 1px solid var(--border-default); border-radius: 6px; width: 100%;

+  resize: vertical;

+}

+.shithub-issue-form { display: flex; flex-direction: column; gap: 1rem; max-width: 48rem; }

+.shithub-form-row { display: flex; flex-direction: column; gap: 0.25rem; }

+.shithub-form-row span { font-weight: 600; font-size: 0.9rem; }

+.shithub-form-actions { display: flex; gap: 0.5rem; justify-content: flex-end; }

+.shithub-issue-sidebar section { padding: 0.75rem 0; border-bottom: 1px solid var(--border-default); }

+.shithub-issue-sidebar h3 { font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--fg-muted); margin: 0 0 0.5rem; }

+.shithub-issue-signedout { color: var(--fg-muted); padding: 1rem; text-align: center; border: 1px dashed var(--border-default); border-radius: 6px; }

+.shithub-label {

+  display: inline-block;

+  font-size: 0.75rem;

+  padding: 0.1rem 0.5rem;

+  border-radius: 1rem;

+  color: #1f2328;

+  font-weight: 500;

+  margin: 0 0.15rem;

+}

+.shithub-label-pick { display: flex; gap: 0.4rem; align-items: center; padding: 0.2rem 0; }

+.shithub-assignee-form { display: flex; gap: 0.25rem; flex-wrap: wrap; margin-top: 0.5rem; }

+.shithub-assignee-form input[type=text] { padding: 0.3rem 0.5rem; border: 1px solid var(--border-default); border-radius: 6px; }

+.shithub-labels-list, .shithub-milestones-list { list-style: none; padding: 0; }

+.shithub-labels-row, .shithub-milestones-row {

+  padding: 0.75rem 0;

+  border-bottom: 1px solid var(--border-default);

+  display: flex; gap: 0.75rem; align-items: center; flex-wrap: wrap;

+}

+.shithub-label-form, .shithub-milestone-form { display: flex; flex-wrap: wrap; gap: 0.4rem; padding: 0.5rem 0; }

+.shithub-label-form input, .shithub-milestone-form input, .shithub-milestone-form textarea {

+  padding: 0.4rem 0.6rem; border: 1px solid var(--border-default); border-radius: 6px; font: inherit;

+}

+.shithub-button-danger { color: #cf222e; }

+.shithub-error { padding: 0.75rem; background: #ffebe9; border: 1px solid #ffcecb; border-radius: 6px; color: #82061e; margin-bottom: 1rem; }

+.shithub-muted { color: var(--fg-muted); }

+{{ define "page" -}}

+<section class="shithub-issue-new">

+  <header class="shithub-issues-head">

+    <h1>

+      <a href="/{{ .Owner }}/{{ .Repo.Name }}">{{ .Owner }}/{{ .Repo.Name }}</a>

+      <span class="shithub-code-sep">/</span>

+      <a href="/{{ .Owner }}/{{ .Repo.Name }}/issues">Issues</a>

+      <span class="shithub-code-sep">/</span>

+      New

+    </h1>

+  </header>

+

+  {{ if .Error }}<div class="shithub-error" role="alert">{{ .Error }}</div>{{ end }}

+

+  <form method="post" action="/{{ .Owner }}/{{ .Repo.Name }}/issues" class="shithub-issue-form">

+    <input type="hidden" name="csrf_token" value="{{ .CSRFToken }}">

+    <label class="shithub-form-row">

+      <span>Title</span>

+      <input type="text" name="title" maxlength="256" required value="{{ .FormTitle }}" autofocus>

+    </label>

+    <label class="shithub-form-row">

+      <span>Body (Markdown)</span>

+      <textarea name="body" rows="14" maxlength="65535">{{ .FormBody }}</textarea>

+    </label>

+    <div class="shithub-form-actions">

+      <a href="/{{ .Owner }}/{{ .Repo.Name }}/issues" class="shithub-button">Cancel</a>

+      <button type="submit" class="shithub-button shithub-button-primary">Submit new issue</button>

+    </div>

+  </form>

+</section>

+{{- end }}

+{{ define "page" -}}

+<section class="shithub-issue-view">

+  <header class="shithub-issue-view-head">

+    <h1 class="shithub-issue-title">

+      <span>{{ .Issue.Title }}</span>

+      <span class="shithub-issue-num">#{{ .Issue.Number }}</span>

+    </h1>

+    <div class="shithub-issue-meta">

+      <span class="shithub-pill shithub-issues-state-{{ printf "%s" .Issue.State }}">

+        {{ if eq (printf "%s" .Issue.State) "open" }}● Open{{ else }}✓ Closed{{ end }}

+      </span>

+      {{ if .AuthorName }}<a href="/{{ .AuthorName }}">{{ .AuthorName }}</a>{{ end }}

+      opened this issue

+      <time datetime="{{ .Issue.CreatedAt.Time.Format "2006-01-02T15:04:05Z" }}">{{ relativeTime .Issue.CreatedAt.Time }}</time>

+      · {{ len .Comments }} comment{{ if ne (len .Comments) 1 }}s{{ end }}

+      {{ if .Issue.Locked }}<span class="shithub-pill">locked</span>{{ end }}

+    </div>

+  </header>

+

+  <div class="shithub-issue-grid">

+    <article class="shithub-issue-thread">

+      <div class="shithub-comment">

+        <div class="shithub-comment-head">

+          {{ if .AuthorName }}<a href="/{{ .AuthorName }}">{{ .AuthorName }}</a>{{ end }}

+          <time datetime="{{ .Issue.CreatedAt.Time.Format "2006-01-02T15:04:05Z" }}">{{ relativeTime .Issue.CreatedAt.Time }}</time>

+        </div>

+        <div class="shithub-comment-body markdown-body">

+          {{ if .Issue.BodyHtmlCached.Valid }}{{ safeHTML .Issue.BodyHtmlCached.String }}{{ else }}<p>{{ .Issue.Body }}</p>{{ end }}

+        </div>

+      </div>

+

+      {{ range .Comments }}

+      <div class="shithub-comment">

+        <div class="shithub-comment-head">

+          {{ if .AuthorName }}<a href="/{{ .AuthorName }}">{{ .AuthorName }}</a>{{ end }}

+          commented

+          <time datetime="{{ .C.CreatedAt.Time.Format "2006-01-02T15:04:05Z" }}">{{ relativeTime .C.CreatedAt.Time }}</time>

+        </div>

+        <div class="shithub-comment-body markdown-body">

+          {{ if .C.BodyHtmlCached.Valid }}{{ safeHTML .C.BodyHtmlCached.String }}{{ else }}<p>{{ .C.Body }}</p>{{ end }}

+        </div>

+      </div>

+      {{ end }}

+

+      {{ range .Events }}

+      <div class="shithub-event">

+        <span class="shithub-event-kind">{{ .Kind }}</span>

+        <time datetime="{{ .CreatedAt.Time.Format "2006-01-02T15:04:05Z" }}">{{ relativeTime .CreatedAt.Time }}</time>

+      </div>

+      {{ end }}

+

+      {{ if .Viewer.ID }}

+      <form method="post" action="/{{ .Owner }}/{{ .Repo.Name }}/issues/{{ .Issue.Number }}/comments" class="shithub-comment-form">

+        <input type="hidden" name="csrf_token" value="{{ .CSRFToken }}">

+        <label>

+          <span>Add a comment</span>

+          <textarea name="body" rows="6" maxlength="65535" required></textarea>

+        </label>

+        <div class="shithub-form-actions">

+          {{ if eq (printf "%s" .Issue.State) "open" }}

+          <button type="submit" formaction="/{{ .Owner }}/{{ .Repo.Name }}/issues/{{ .Issue.Number }}/state" name="state" value="closed" class="shithub-button">Close issue</button>

+          {{ else }}

+          <button type="submit" formaction="/{{ .Owner }}/{{ .Repo.Name }}/issues/{{ .Issue.Number }}/state" name="state" value="open" class="shithub-button">Reopen issue</button>

+          {{ end }}

+          <button type="submit" class="shithub-button shithub-button-primary">Comment</button>

+        </div>

+      </form>

+      {{ else }}

+      <p class="shithub-issue-signedout"><a href="/login">Sign in</a> to comment.</p>

+      {{ end }}

+    </article>

+

+    <aside class="shithub-issue-sidebar">

+      <section>

+        <h3>Labels</h3>

+        {{ if .Labels }}

+          {{ range .Labels }}<span class="shithub-label" style="background-color: #{{ .Color }}">{{ .Name }}</span>{{ end }}

+        {{ else }}<p class="shithub-muted">None yet</p>{{ end }}

+        {{ if .Viewer.ID }}

+        <details>

+          <summary>Edit labels</summary>

+          <form method="post" action="/{{ .Owner }}/{{ .Repo.Name }}/issues/{{ .Issue.Number }}/labels">

+            <input type="hidden" name="csrf_token" value="{{ .CSRFToken }}">

+            {{ $current := .Labels }}

+            {{ range .AllLabels }}

+              {{ $id := .ID }}

+              <label class="shithub-label-pick">

+                <input type="checkbox" name="label_ids" value="{{ .ID }}"

+                  {{ range $current }}{{ if eq .ID $id }}checked{{ end }}{{ end }}>

+                <span class="shithub-label" style="background-color: #{{ .Color }}">{{ .Name }}</span>

+              </label>

+            {{ end }}

+            <button type="submit" class="shithub-button">Apply</button>

+          </form>

+        </details>

+        {{ end }}

+      </section>

+

+      <section>

+        <h3>Assignees</h3>

+        {{ if .Assignees }}

+          {{ range .Assignees }}<a href="/{{ .Username }}">@{{ .Username }}</a>{{ end }}

+        {{ else }}<p class="shithub-muted">No one assigned</p>{{ end }}

+        {{ if .Viewer.ID }}

+        <form method="post" action="/{{ .Owner }}/{{ .Repo.Name }}/issues/{{ .Issue.Number }}/assignees" class="shithub-assignee-form">

+          <input type="hidden" name="csrf_token" value="{{ .CSRFToken }}">

+          <input type="text" name="username" placeholder="username" required>

+          <button type="submit" name="mode" value="add" class="shithub-button">Add</button>

+          <button type="submit" name="mode" value="remove" class="shithub-button">Remove</button>

+        </form>

+        {{ end }}

+      </section>

+

+      <section>

+        <h3>Milestone</h3>

+        {{ if .Issue.MilestoneID.Valid }}

+          {{ $mid := .Issue.MilestoneID.Int64 }}

+          {{ range .Milestones }}{{ if eq .ID $mid }}<a href="/{{ $.Owner }}/{{ $.Repo.Name }}/milestones">{{ .Title }}</a>{{ end }}{{ end }}

+        {{ else }}<p class="shithub-muted">No milestone</p>{{ end }}

+        {{ if .Viewer.ID }}

+        <form method="post" action="/{{ .Owner }}/{{ .Repo.Name }}/issues/{{ .Issue.Number }}/milestone">

+          <input type="hidden" name="csrf_token" value="{{ .CSRFToken }}">

+          <select name="milestone_id">

+            <option value="0">— None —</option>

+            {{ range .Milestones }}<option value="{{ .ID }}">{{ .Title }}</option>{{ end }}

+          </select>

+          <button type="submit" class="shithub-button">Set</button>

+        </form>

+        {{ end }}

+      </section>

+

+      {{ if .Viewer.ID }}

+      <section>

+        <h3>Lock</h3>

+        <form method="post" action="/{{ .Owner }}/{{ .Repo.Name }}/issues/{{ .Issue.Number }}/lock">

+          <input type="hidden" name="csrf_token" value="{{ .CSRFToken }}">

+          {{ if .Issue.Locked }}

+          <button type="submit" name="lock" value="false" class="shithub-button">Unlock</button>

+          {{ else }}

+          <button type="submit" name="lock" value="true" class="shithub-button">Lock conversation</button>

+          {{ end }}

+        </form>

+      </section>

+      {{ end }}

+    </aside>

+  </div>

+</section>

+{{- end }}

+{{ define "page" -}}

+<section class="shithub-issues">

+  <header class="shithub-issues-head">

+    <h1>

+      <a href="/{{ .Owner }}/{{ .Repo.Name }}">{{ .Owner }}/{{ .Repo.Name }}</a>

+      <span class="shithub-code-sep">/</span>

+      Issues

+    </h1>

+    <div class="shithub-issues-actions">

+      <a href="/{{ .Owner }}/{{ .Repo.Name }}/labels" class="shithub-button">Labels</a>

+      <a href="/{{ .Owner }}/{{ .Repo.Name }}/milestones" class="shithub-button">Milestones</a>

+      <a href="/{{ .Owner }}/{{ .Repo.Name }}/issues/new" class="shithub-button shithub-button-primary">New issue</a>

+    </div>

+  </header>

+

+  <nav class="shithub-issues-filter">

+    <a href="?state=open" class="shithub-issues-tab {{ if eq .State "open" }}shithub-issues-tab-active{{ end }}">

+      <span class="shithub-issues-dot shithub-issues-dot-open"></span>

+      {{ .OpenCount }} Open

+    </a>

+    <a href="?state=closed" class="shithub-issues-tab {{ if eq .State "closed" }}shithub-issues-tab-active{{ end }}">

+      <span class="shithub-issues-dot shithub-issues-dot-closed"></span>

+      {{ .ClosedCount }} Closed

+    </a>

+  </nav>

+

+  {{ if .Items }}

+  <ul class="shithub-issues-list">

+    {{ range .Items }}

+    <li class="shithub-issues-row">

+      <span class="shithub-issues-state shithub-issues-state-{{ printf "%s" .Issue.State }}">

+        {{ if eq (printf "%s" .Issue.State) "open" }}●{{ else }}✓{{ end }}

+      </span>

+      <div class="shithub-issues-body">

+        <a class="shithub-issues-title" href="/{{ $.Owner }}/{{ $.Repo.Name }}/issues/{{ .Issue.Number }}">

+          {{ .Issue.Title }}

+        </a>

+        {{ range .Labels }}

+          <span class="shithub-label" style="background-color: #{{ .Color }}">{{ .Name }}</span>

+        {{ end }}

+        <div class="shithub-issues-meta">

+          #{{ .Issue.Number }} opened

+          <time datetime="{{ .Issue.CreatedAt.Time.Format "2006-01-02T15:04:05Z" }}">{{ relativeTime .Issue.CreatedAt.Time }}</time>

+          {{ if .AuthorName }}by <a href="/{{ .AuthorName }}">{{ .AuthorName }}</a>{{ end }}

+        </div>

+      </div>

+      {{ if .Assignees }}

+      <div class="shithub-issues-assignees">

+        {{ range .Assignees }}<a href="/{{ .Username }}" title="{{ .Username }}">@{{ .Username }}</a>{{ end }}

+      </div>

+      {{ end }}

+    </li>

+    {{ end }}

+  </ul>

+  {{ else }}

+  <p class="shithub-issues-empty">No {{ .State }} issues. <a href="/{{ .Owner }}/{{ .Repo.Name }}/issues/new">Open one</a>.</p>

+  {{ end }}

+</section>

+{{- end }}

+{{ define "page" -}}

+<section class="shithub-labels">

+  <header class="shithub-issues-head">

+    <h1>

+      <a href="/{{ .Owner }}/{{ .Repo.Name }}">{{ .Owner }}/{{ .Repo.Name }}</a>

+      <span class="shithub-code-sep">/</span>

+      Labels

+    </h1>

+  </header>

+

+  {{ if .Viewer.ID }}

+  <details class="shithub-label-create">

+    <summary class="shithub-button shithub-button-primary">New label</summary>

+    <form method="post" action="/{{ .Owner }}/{{ .Repo.Name }}/labels" class="shithub-label-form">

+      <input type="hidden" name="csrf_token" value="{{ .CSRFToken }}">

+      <input type="text" name="name" placeholder="name" maxlength="50" required>

+      <input type="text" name="color" placeholder="color (6 hex)" maxlength="7" value="d0d7de">

+      <input type="text" name="description" placeholder="description (optional)">

+      <button type="submit" class="shithub-button">Create</button>

+    </form>

+  </details>

+  {{ end }}

+

+  <ul class="shithub-labels-list">

+    {{ range .Labels }}

+    <li class="shithub-labels-row">

+      <span class="shithub-label" style="background-color: #{{ .Color }}">{{ .Name }}</span>

+      {{ if .Description }}<span class="shithub-muted">{{ .Description }}</span>{{ end }}

+      {{ if $.Viewer.ID }}

+      <details class="shithub-label-edit">

+        <summary class="shithub-button">Edit</summary>

+        <form method="post" action="/{{ $.Owner }}/{{ $.Repo.Name }}/labels/{{ .ID }}/update" class="shithub-label-form">

+          <input type="hidden" name="csrf_token" value="{{ $.CSRFToken }}">

+          <input type="text" name="name" value="{{ .Name }}" required>

+          <input type="text" name="color" value="{{ .Color }}" required>

+          <input type="text" name="description" value="{{ .Description }}">

+          <button type="submit" class="shithub-button">Save</button>

+        </form>

+        <form method="post" action="/{{ $.Owner }}/{{ $.Repo.Name }}/labels/{{ .ID }}/delete">

+          <input type="hidden" name="csrf_token" value="{{ $.CSRFToken }}">

+          <button type="submit" class="shithub-button shithub-button-danger">Delete</button>

+        </form>

+      </details>

+      {{ end }}

+    </li>

+    {{ end }}

+  </ul>

+</section>

+{{- end }}

+{{ define "page" -}}

+<section class="shithub-milestones">

+  <header class="shithub-issues-head">

+    <h1>

+      <a href="/{{ .Owner }}/{{ .Repo.Name }}">{{ .Owner }}/{{ .Repo.Name }}</a>

+      <span class="shithub-code-sep">/</span>

+      Milestones

+    </h1>

+  </header>

+

+  {{ if .Viewer.ID }}

+  <details class="shithub-milestone-create">

+    <summary class="shithub-button shithub-button-primary">New milestone</summary>

+    <form method="post" action="/{{ .Owner }}/{{ .Repo.Name }}/milestones" class="shithub-milestone-form">

+      <input type="hidden" name="csrf_token" value="{{ .CSRFToken }}">

+      <input type="text" name="title" placeholder="title" maxlength="200" required>

+      <input type="date" name="due_on">

+      <textarea name="description" placeholder="description (optional)" rows="3"></textarea>

+      <button type="submit" class="shithub-button">Create</button>

+    </form>

+  </details>

+  {{ end }}

+

+  <ul class="shithub-milestones-list">

+    {{ range .Milestones }}

+    <li class="shithub-milestones-row">

+      <h3>{{ .Title }}

+        <span class="shithub-pill shithub-issues-state-{{ printf "%s" .State }}">{{ printf "%s" .State }}</span>

+        {{ if .DueOn.Valid }}<small>due {{ .DueOn.Time.Format "Jan 2, 2006" }}</small>{{ end }}

+      </h3>

+      {{ if .Description }}<p>{{ .Description }}</p>{{ end }}

+      {{ if $.Viewer.ID }}

+      <div class="shithub-milestone-actions">

+        <form method="post" action="/{{ $.Owner }}/{{ $.Repo.Name }}/milestones/{{ .ID }}/state">

+          <input type="hidden" name="csrf_token" value="{{ $.CSRFToken }}">

+          {{ if eq (printf "%s" .State) "open" }}

+          <button type="submit" name="state" value="closed" class="shithub-button">Close milestone</button>

+          {{ else }}

+          <button type="submit" name="state" value="open" class="shithub-button">Reopen milestone</button>

+          {{ end }}

+        </form>

+        <form method="post" action="/{{ $.Owner }}/{{ $.Repo.Name }}/milestones/{{ .ID }}/delete">

+          <input type="hidden" name="csrf_token" value="{{ $.CSRFToken }}">

+          <button type="submit" class="shithub-button shithub-button-danger">Delete</button>

+        </form>

+      </div>

+      {{ end }}

+    </li>

+    {{ end }}

+  </ul>

+</section>

+{{- end }}