forked from tangled.org/core
this repo has no description

style commit view

Changed files
+213 -180
appview
+3 -1
appview/pages/templates/layouts/base.html
···
<link href="/static/tw.css" rel="stylesheet" type="text/css" />
<title>{{ block "title" . }}tangled{{ end }}</title>
</head>
-
<body class="container mx-auto px-10">
+
<body>
<header>
{{ block "topbar" . }}
{{ template "layouts/topbar" . }}
{{ end }}
</header>
+
<div class="container mx-auto px-10">
<main class="content">{{ block "content" . }}{{ end }}</main>
<script src="/static/lucide.min.js"></script>
<script>
lucide.createIcons();
</script>
+
</div>
</body>
</html>
{{ end }}
+2 -2
appview/pages/templates/layouts/repobase.html
···
</div>
</nav>
<section
-
class="bg-white p-6 min-h-[200px] border-l border-r border-b border-black relative z-20 w-full mx-auto"
-
>
+
class="bg-white p-6 min-h-[200px] border-l border-r border-b border-black relative z-20 w-full mx-auto">
{{ block "repoContent" . }}{{ end }}
</section>
+
{{ block "repoAfter" . }} {{ end }}
</section>
{{ end }}
+1 -1
appview/pages/templates/layouts/topbar.html
···
{{ define "layouts/topbar" }}
{{ with .LoggedInUser }}
-
<nav class="flex items-center justify-center space-x-4 text-sm mb-4 border-b border-l border-r border-black">
+
<nav class="flex items-center justify-center space-x-4 mb-4 py-2 border-b border-l border-r border-black">
<a
href="/"
hx-boost="true"
+75 -44
appview/pages/templates/repo/commit.html
···
<strong>jump to</strong>
{{ range $diff }}
<ul>
-
<li><a href="#{{ .Name.New }}">{{ .Name.New }}</a></li>
+
<li><a href="#file-{{ .Name.New }}">{{ .Name.New }}</a></li>
</ul>
{{ end }}
</div>
</section>
-
<section>
+
+
{{end}}
+
+
{{ define "repoAfter" }}
+
+
{{ $repo := .RepoInfo.FullName }}
+
{{ $commit := .Diff.Commit }}
+
{{ $stat := .Diff.Stat }}
+
{{ $diff := .Diff.Diff }}
+
{{ $this := $commit.This }}
{{ $parent := $commit.Parent }}
+
{{ range $diff }}
-
<div id="{{ .Name.New }}">
-
<div class="diff">
-
{{ if .IsNew }}
-
<span class="diff-type">A</span>
-
{{ end }}
-
{{ if .IsDelete }}
-
<span class="diff-type">D</span>
-
{{ end }}
-
{{ if not (or .IsNew .IsDelete) }}
-
<span class="diff-type">M</span>
-
{{ end }}
-
{{ if .Name.Old }}
-
<a href="/{{ $repo }}/blob/{{ $parent }}/{{ .Name.Old }}">{{ .Name.Old }}</a>
-
{{ if .Name.New }}
-
&#8594;
-
<a href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}">{{ .Name.New }}</a>
-
{{ end }}
-
{{ else }}
-
<a href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}">{{ .Name.New }}</a>
-
{{- end -}}
-
{{ if .IsBinary }}
-
<p>Not showing binary file.</p>
-
{{ else }}
-
<pre class="overflow-auto">
-
{{- range .TextFragments -}}
-
<p>{{- .Header -}}</p>
-
{{- range .Lines -}}
-
{{- if eq .Op.String "+" -}}
-
<span class="diff-add">{{ .String }}</span>
-
{{- end -}}
-
{{- if eq .Op.String "-" -}}
-
<span class="diff-del">{{ .String }}</span>
-
{{- end -}}
-
{{- if eq .Op.String " " -}}
-
<span class="diff-noop">{{ .String }}</span>
-
{{- end -}}
-
{{- end -}}
-
{{- end -}}
-
{{- end -}}
-
</pre>
+
<section class="mt-4 border border-black w-full mx-auto">
+
<div id="file-{{ .Name.New }}">
+
<div id="diff-file">
+
<details open>
+
<summary class="list-none cursor-pointer sticky top-0">
+
<div id="diff-file-header" class="border-b cursor-pointer bg-white border-black flex justify-between">
+
<div id="left-side-items" class="p-2">
+
{{ if .IsNew }}
+
<span class="diff-type">A</span>
+
{{ end }}
+
{{ if .IsDelete }}
+
<span class="diff-type">D</span>
+
{{ end }}
+
{{ if not (or .IsNew .IsDelete) }}
+
<span class="diff-type">M</span>
+
{{ end }}
+
+
{{ if .Name.Old }}
+
<a href="/{{ $repo }}/blob/{{ $parent }}/{{ .Name.Old }}" class="no-underline hover:underline">{{ .Name.Old }}</a>
+
{{ if .Name.New }}
+
&#8594;
+
<a href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}" class="no-underline hover:underline">{{ .Name.New }}</a>
+
{{ end }}
+
{{ else }}
+
<a href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}" class="no-underline hover:underline">{{ .Name.New }}</a>
+
{{- end -}}
+
</div>
+
+
<div id="right-side-items" class="p-2">
+
<a href="#file-{{ .Name.New }}" class="no-underline hover:underline">to top of file</a>
+
</div>
+
+
</div>
+
</summary>
+
+
{{ if .IsBinary }}
+
<p>Not showing binary file.</p>
+
{{ else }}
+
<pre class="overflow-auto">
+
{{- range .TextFragments -}}
+
<div class="bg-gray-100 text-gray-500">{{ .Header }}</div>
+
{{- range .Lines -}}
+
{{- if eq .Op.String "+" -}}
+
<div class="bg-green-100 text-green-700">{{ .String }}</div>
+
{{- end -}}
+
+
{{- if eq .Op.String "-" -}}
+
<div class="bg-red-100 text-red-700">{{ .String }}</div>
+
{{- end -}}
+
+
{{- if eq .Op.String " " -}}
+
<div class="text-gray-500">{{ .String }}</div>
+
{{- end -}}
+
+
{{- end -}}
+
{{- end -}}
+
</pre>
+
{{- end -}}
+
+
</details>
+
+
</div>
</div>
-
</div>
+
</section>
{{ end }}
-
</section>
{{end}}
+132 -132
appview/pages/templates/repo/index.html
···
{{ define "repoContent" }}
-
<main>
-
{{- if .IsEmpty }}
-
this repo is empty
-
{{ else }}
-
<div class="flex gap-4">
-
<div id="file-tree" class="w-1/2">
-
{{ $containerstyle := "py-1" }}
-
{{ $linkstyle := "no-underline hover:underline" }}
+
<main>
+
{{- if .IsEmpty }}
+
this repo is empty
+
{{ else }}
+
<div class="flex gap-4">
+
<div id="file-tree" class="w-1/2">
+
{{ $containerstyle := "py-1" }}
+
{{ $linkstyle := "no-underline hover:underline" }}
-
<div class="flex justify-end">
-
<select
-
onchange="window.location.href = '/{{ .RepoInfo.FullName }}/tree/' + this.value"
-
class="p-1 border border-gray-500 bg-white"
-
>
-
<optgroup label="branches" class="uppercase bold text-sm">
-
{{ range .Branches }}
-
<option
-
value="{{ .Reference.Name }}"
-
class="py-1"
-
{{if eq .Reference.Name $.Ref}}selected{{end}}
-
>
-
{{ .Reference.Name }}
-
</option>
-
{{ end }}
-
</optgroup>
-
<optgroup label="tags" class="uppercase bold text-sm">
-
{{ range .Tags }}
-
<option
-
value="{{ .Reference.Name }}"
-
class="py-1"
-
{{if eq .Reference.Name $.Ref}}selected{{end}}
-
>
-
{{ .Reference.Name }}
-
</option>
-
{{ end }}
-
</optgroup>
-
</select>
-
</div>
+
<div class="flex justify-end">
+
<select
+
onchange="window.location.href = '/{{ .RepoInfo.FullName }}/tree/' + this.value"
+
class="p-1 border border-gray-500 bg-white"
+
>
+
<optgroup label="branches" class="uppercase bold text-sm">
+
{{ range .Branches }}
+
<option
+
value="{{ .Reference.Name }}"
+
class="py-1"
+
{{if eq .Reference.Name $.Ref}}selected{{end}}
+
>
+
{{ .Reference.Name }}
+
</option>
+
{{ end }}
+
</optgroup>
+
<optgroup label="tags" class="uppercase bold text-sm">
+
{{ range .Tags }}
+
<option
+
value="{{ .Reference.Name }}"
+
class="py-1"
+
{{if eq .Reference.Name $.Ref}}selected{{end}}
+
>
+
{{ .Reference.Name }}
+
</option>
+
{{ end }}
+
</optgroup>
+
</select>
+
</div>
-
<section id="repo-content">
-
{{ range .Files }}
-
{{ if not .IsFile }}
-
<div class="{{ $containerstyle }}">
-
<a
-
href="/{{ $.RepoInfo.FullName }}/tree/{{ $.Ref }}/{{ .Name }}"
-
class="{{ $linkstyle }}"
-
>
-
<div class="flex items-center gap-2">
-
<i
-
class="w-3 h-3 fill-current"
-
data-lucide="folder"
-
></i
-
>{{ .Name }}/
-
</div>
-
</a>
-
</div>
-
{{ end }}
-
{{ end }}
+
{{ range .Files }}
+
{{ if not .IsFile }}
+
<div class="{{ $containerstyle }}">
+
<a
+
href="/{{ $.RepoInfo.FullName }}/tree/{{ $.Ref }}/{{ .Name }}"
+
class="{{ $linkstyle }}"
+
>
+
<div class="flex items-center gap-2">
+
<i
+
class="w-3 h-3 fill-current"
+
data-lucide="folder"
+
></i
+
>{{ .Name }}/
+
</div>
+
</a>
+
</div>
+
{{ end }}
+
{{ end }}
-
{{ range .Files }}
-
{{ if .IsFile }}
-
<div class="{{ $containerstyle }}">
-
<a
-
href="/{{ $.RepoInfo.FullName }}/blob/{{ $.Ref }}/{{ .Name }}"
-
class="{{ $linkstyle }}"
-
>
-
<div class="flex items-center gap-2">
-
<i
-
class="w-3 h-3"
-
data-lucide="file"
-
></i
-
>{{ .Name }}
-
</div>
-
</a>
-
</div>
-
{{ end }}
-
{{ end }}
-
</div>
-
<div id="commit-log" class="flex-1">
-
{{ range .Commits }}
-
<div
-
class="relative
-
px-4
-
py-4
-
border-l
-
border-black
-
before:content-['']
-
before:absolute
-
before:w-1
-
before:h-1
-
before:bg-black
-
before:rounded-full
-
before:left-[-2.2px]
-
before:top-1/2
-
before:-translate-y-1/2
-
">
+
{{ range .Files }}
+
{{ if .IsFile }}
+
<div class="{{ $containerstyle }}">
+
<a
+
href="/{{ $.RepoInfo.FullName }}/blob/{{ $.Ref }}/{{ .Name }}"
+
class="{{ $linkstyle }}"
+
>
+
<div class="flex items-center gap-2">
+
<i
+
class="w-3 h-3"
+
data-lucide="file"
+
></i
+
>{{ .Name }}
+
</div>
+
</a>
+
</div>
+
{{ end }}
+
{{ end }}
+
</div>
+
<div id="commit-log" class="flex-1">
+
{{ range .Commits }}
+
<div
+
class="relative
+
px-4
+
py-4
+
border-l
+
border-black
+
before:content-['']
+
before:absolute
+
before:w-1
+
before:h-1
+
before:bg-black
+
before:rounded-full
+
before:left-[-2.2px]
+
before:top-1/2
+
before:-translate-y-1/2
+
">
<div id="commit-message">
{{ $messageParts := splitN .Message "\n\n" 2 }}
···
<a href="/{{ $.RepoInfo.FullName }}/commit/{{ .Hash.String }}" class="inline no-underline hover:underline">{{ index $messageParts 0 }}</a>
{{ if gt (len $messageParts) 1 }}
<button class="text-sm inline rounded-sm bg-gray-300 text-gray-700 px-1 w-fit hover:bg-gray-400"
-
hx-on:click="this.parentElement.nextElementSibling.classList.toggle('hidden')">&hellip;</button>
+
hx-on:click="this.parentElement.nextElementSibling.classList.toggle('hidden')">&hellip;</button>
{{ end }}
</div>
{{ if gt (len $messageParts) 1 }}
···
</div>
</div>
-
<div class="text-xs text-gray-500">
-
<span class="font-mono">
-
<a
-
href="/{{ $.RepoInfo.FullName }}/commit/{{ .Hash.String }}"
-
class="text-gray-500 no-underline hover:underline"
-
>{{ slice .Hash.String 0 8 }}</a
-
>
-
</span>
-
&nbsp;·&nbsp;
-
<span>
-
<a
-
href="mailto:{{ .Author.Email }}"
-
class="text-gray-500 no-underline hover:underline"
-
>{{ .Author.Name }}</a
-
>
-
</span>
-
&nbsp;·&nbsp;
-
<span>{{ timeFmt .Author.When }}</span>
-
</div>
-
</div>
-
{{ end }}
-
</div>
-
</div>
-
</section>
-
{{- if .Readme }}
-
<article class="readme">
-
{{- .Readme -}}
-
</article>
-
{{- end -}}
-
{{- end -}}
+
<div class="text-xs text-gray-500">
+
<span class="font-mono">
+
<a
+
href="/{{ $.RepoInfo.FullName }}/commit/{{ .Hash.String }}"
+
class="text-gray-500 no-underline hover:underline"
+
>{{ slice .Hash.String 0 8 }}</a
+
>
+
</span>
+
&nbsp;·&nbsp;
+
<span>
+
<a
+
href="mailto:{{ .Author.Email }}"
+
class="text-gray-500 no-underline hover:underline"
+
>{{ .Author.Name }}</a
+
>
+
</span>
+
&nbsp;·&nbsp;
+
<span>{{ timeFmt .Author.When }}</span>
+
</div>
+
</div>
+
{{ end }}
+
</div>
+
</div>
+
{{- end -}}
+
</main>
+
{{ end }}
-
<div class="clone-url">
-
<strong>clone</strong>
-
<pre>
-
git clone https://tangled.sh/{{ .RepoInfo.OwnerWithAt }}/{{ .RepoInfo.Name }}
-
</pre
-
>
-
</div>
-
</main>
+
{{ define "repoAfter" }}
+
{{- if .Readme }}
+
<section class="mt-4 p-6 border border-black w-full mx-auto">
+
<article class="readme">
+
{{- .Readme -}}
+
</article>
+
</section>
+
{{- end -}}
+
+
<section class="mt-4 p-6 border border-black w-full mx-auto">
+
<strong>clone</strong>
+
<pre> git clone https://tangled.sh/{{ .RepoInfo.OwnerWithAt }}/{{ .RepoInfo.Name }} </pre>
+
</section>
{{ end }}