forked from tangled.org/core
Monorepo for Tangled

style commit view

Changed files
+213 -180
appview
+3 -1
appview/pages/templates/layouts/base.html
··· 11 11 <link href="/static/tw.css" rel="stylesheet" type="text/css" /> 12 12 <title>{{ block "title" . }}tangled{{ end }}</title> 13 13 </head> 14 - <body class="container mx-auto px-10"> 14 + <body> 15 15 <header> 16 16 {{ block "topbar" . }} 17 17 {{ template "layouts/topbar" . }} 18 18 {{ end }} 19 19 </header> 20 + <div class="container mx-auto px-10"> 20 21 <main class="content">{{ block "content" . }}{{ end }}</main> 21 22 <script src="/static/lucide.min.js"></script> 22 23 <script> 23 24 lucide.createIcons(); 24 25 </script> 26 + </div> 25 27 </body> 26 28 </html> 27 29 {{ end }}
+2 -2
appview/pages/templates/layouts/repobase.html
··· 39 39 </div> 40 40 </nav> 41 41 <section 42 - class="bg-white p-6 min-h-[200px] border-l border-r border-b border-black relative z-20 w-full mx-auto" 43 - > 42 + class="bg-white p-6 min-h-[200px] border-l border-r border-b border-black relative z-20 w-full mx-auto"> 44 43 {{ block "repoContent" . }}{{ end }} 45 44 </section> 45 + {{ block "repoAfter" . }} {{ end }} 46 46 </section> 47 47 {{ end }} 48 48
+1 -1
appview/pages/templates/layouts/topbar.html
··· 1 1 {{ define "layouts/topbar" }} 2 2 {{ with .LoggedInUser }} 3 - <nav class="flex items-center justify-center space-x-4 text-sm mb-4 border-b border-l border-r border-black"> 3 + <nav class="flex items-center justify-center space-x-4 mb-4 py-2 border-b border-l border-r border-black"> 4 4 <a 5 5 href="/" 6 6 hx-boost="true"
+75 -44
appview/pages/templates/repo/commit.html
··· 43 43 <strong>jump to</strong> 44 44 {{ range $diff }} 45 45 <ul> 46 - <li><a href="#{{ .Name.New }}">{{ .Name.New }}</a></li> 46 + <li><a href="#file-{{ .Name.New }}">{{ .Name.New }}</a></li> 47 47 </ul> 48 48 {{ end }} 49 49 </div> 50 50 </section> 51 - <section> 51 + 52 + {{end}} 53 + 54 + {{ define "repoAfter" }} 55 + 56 + {{ $repo := .RepoInfo.FullName }} 57 + {{ $commit := .Diff.Commit }} 58 + {{ $stat := .Diff.Stat }} 59 + {{ $diff := .Diff.Diff }} 60 + 52 61 {{ $this := $commit.This }} 53 62 {{ $parent := $commit.Parent }} 63 + 54 64 {{ range $diff }} 55 - <div id="{{ .Name.New }}"> 56 - <div class="diff"> 57 - {{ if .IsNew }} 58 - <span class="diff-type">A</span> 59 - {{ end }} 60 - {{ if .IsDelete }} 61 - <span class="diff-type">D</span> 62 - {{ end }} 63 - {{ if not (or .IsNew .IsDelete) }} 64 - <span class="diff-type">M</span> 65 - {{ end }} 66 - {{ if .Name.Old }} 67 - <a href="/{{ $repo }}/blob/{{ $parent }}/{{ .Name.Old }}">{{ .Name.Old }}</a> 68 - {{ if .Name.New }} 69 - &#8594; 70 - <a href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}">{{ .Name.New }}</a> 71 - {{ end }} 72 - {{ else }} 73 - <a href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}">{{ .Name.New }}</a> 74 - {{- end -}} 75 - {{ if .IsBinary }} 76 - <p>Not showing binary file.</p> 77 - {{ else }} 78 - <pre class="overflow-auto"> 79 - {{- range .TextFragments -}} 80 - <p>{{- .Header -}}</p> 81 - {{- range .Lines -}} 82 - {{- if eq .Op.String "+" -}} 83 - <span class="diff-add">{{ .String }}</span> 84 - {{- end -}} 85 - {{- if eq .Op.String "-" -}} 86 - <span class="diff-del">{{ .String }}</span> 87 - {{- end -}} 88 - {{- if eq .Op.String " " -}} 89 - <span class="diff-noop">{{ .String }}</span> 90 - {{- end -}} 91 - {{- end -}} 92 - {{- end -}} 93 - {{- end -}} 94 - </pre> 65 + <section class="mt-4 border border-black w-full mx-auto"> 66 + <div id="file-{{ .Name.New }}"> 67 + <div id="diff-file"> 68 + <details open> 69 + <summary class="list-none cursor-pointer sticky top-0"> 70 + <div id="diff-file-header" class="border-b cursor-pointer bg-white border-black flex justify-between"> 71 + <div id="left-side-items" class="p-2"> 72 + {{ if .IsNew }} 73 + <span class="diff-type">A</span> 74 + {{ end }} 75 + {{ if .IsDelete }} 76 + <span class="diff-type">D</span> 77 + {{ end }} 78 + {{ if not (or .IsNew .IsDelete) }} 79 + <span class="diff-type">M</span> 80 + {{ end }} 81 + 82 + {{ if .Name.Old }} 83 + <a href="/{{ $repo }}/blob/{{ $parent }}/{{ .Name.Old }}" class="no-underline hover:underline">{{ .Name.Old }}</a> 84 + {{ if .Name.New }} 85 + &#8594; 86 + <a href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}" class="no-underline hover:underline">{{ .Name.New }}</a> 87 + {{ end }} 88 + {{ else }} 89 + <a href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}" class="no-underline hover:underline">{{ .Name.New }}</a> 90 + {{- end -}} 91 + </div> 92 + 93 + <div id="right-side-items" class="p-2"> 94 + <a href="#file-{{ .Name.New }}" class="no-underline hover:underline">to top of file</a> 95 + </div> 96 + 97 + </div> 98 + </summary> 99 + 100 + {{ if .IsBinary }} 101 + <p>Not showing binary file.</p> 102 + {{ else }} 103 + <pre class="overflow-auto"> 104 + {{- range .TextFragments -}} 105 + <div class="bg-gray-100 text-gray-500">{{ .Header }}</div> 106 + {{- range .Lines -}} 107 + {{- if eq .Op.String "+" -}} 108 + <div class="bg-green-100 text-green-700">{{ .String }}</div> 109 + {{- end -}} 110 + 111 + {{- if eq .Op.String "-" -}} 112 + <div class="bg-red-100 text-red-700">{{ .String }}</div> 113 + {{- end -}} 114 + 115 + {{- if eq .Op.String " " -}} 116 + <div class="text-gray-500">{{ .String }}</div> 117 + {{- end -}} 118 + 119 + {{- end -}} 120 + {{- end -}} 121 + </pre> 122 + {{- end -}} 123 + 124 + </details> 125 + 126 + </div> 95 127 </div> 96 - </div> 128 + </section> 97 129 {{ end }} 98 - </section> 99 130 100 131 {{end}}
+132 -132
appview/pages/templates/repo/index.html
··· 1 1 {{ define "repoContent" }} 2 - <main> 3 - {{- if .IsEmpty }} 4 - this repo is empty 5 - {{ else }} 6 - <div class="flex gap-4"> 7 - <div id="file-tree" class="w-1/2"> 8 - {{ $containerstyle := "py-1" }} 9 - {{ $linkstyle := "no-underline hover:underline" }} 2 + <main> 3 + {{- if .IsEmpty }} 4 + this repo is empty 5 + {{ else }} 6 + <div class="flex gap-4"> 7 + <div id="file-tree" class="w-1/2"> 8 + {{ $containerstyle := "py-1" }} 9 + {{ $linkstyle := "no-underline hover:underline" }} 10 10 11 - <div class="flex justify-end"> 12 - <select 13 - onchange="window.location.href = '/{{ .RepoInfo.FullName }}/tree/' + this.value" 14 - class="p-1 border border-gray-500 bg-white" 15 - > 16 - <optgroup label="branches" class="uppercase bold text-sm"> 17 - {{ range .Branches }} 18 - <option 19 - value="{{ .Reference.Name }}" 20 - class="py-1" 21 - {{if eq .Reference.Name $.Ref}}selected{{end}} 22 - > 23 - {{ .Reference.Name }} 24 - </option> 25 - {{ end }} 26 - </optgroup> 27 - <optgroup label="tags" class="uppercase bold text-sm"> 28 - {{ range .Tags }} 29 - <option 30 - value="{{ .Reference.Name }}" 31 - class="py-1" 32 - {{if eq .Reference.Name $.Ref}}selected{{end}} 33 - > 34 - {{ .Reference.Name }} 35 - </option> 36 - {{ end }} 37 - </optgroup> 38 - </select> 39 - </div> 11 + <div class="flex justify-end"> 12 + <select 13 + onchange="window.location.href = '/{{ .RepoInfo.FullName }}/tree/' + this.value" 14 + class="p-1 border border-gray-500 bg-white" 15 + > 16 + <optgroup label="branches" class="uppercase bold text-sm"> 17 + {{ range .Branches }} 18 + <option 19 + value="{{ .Reference.Name }}" 20 + class="py-1" 21 + {{if eq .Reference.Name $.Ref}}selected{{end}} 22 + > 23 + {{ .Reference.Name }} 24 + </option> 25 + {{ end }} 26 + </optgroup> 27 + <optgroup label="tags" class="uppercase bold text-sm"> 28 + {{ range .Tags }} 29 + <option 30 + value="{{ .Reference.Name }}" 31 + class="py-1" 32 + {{if eq .Reference.Name $.Ref}}selected{{end}} 33 + > 34 + {{ .Reference.Name }} 35 + </option> 36 + {{ end }} 37 + </optgroup> 38 + </select> 39 + </div> 40 40 41 - <section id="repo-content"> 42 - {{ range .Files }} 43 - {{ if not .IsFile }} 44 - <div class="{{ $containerstyle }}"> 45 - <a 46 - href="/{{ $.RepoInfo.FullName }}/tree/{{ $.Ref }}/{{ .Name }}" 47 - class="{{ $linkstyle }}" 48 - > 49 - <div class="flex items-center gap-2"> 50 - <i 51 - class="w-3 h-3 fill-current" 52 - data-lucide="folder" 53 - ></i 54 - >{{ .Name }}/ 55 - </div> 56 - </a> 57 - </div> 58 - {{ end }} 59 - {{ end }} 41 + {{ range .Files }} 42 + {{ if not .IsFile }} 43 + <div class="{{ $containerstyle }}"> 44 + <a 45 + href="/{{ $.RepoInfo.FullName }}/tree/{{ $.Ref }}/{{ .Name }}" 46 + class="{{ $linkstyle }}" 47 + > 48 + <div class="flex items-center gap-2"> 49 + <i 50 + class="w-3 h-3 fill-current" 51 + data-lucide="folder" 52 + ></i 53 + >{{ .Name }}/ 54 + </div> 55 + </a> 56 + </div> 57 + {{ end }} 58 + {{ end }} 60 59 61 - {{ range .Files }} 62 - {{ if .IsFile }} 63 - <div class="{{ $containerstyle }}"> 64 - <a 65 - href="/{{ $.RepoInfo.FullName }}/blob/{{ $.Ref }}/{{ .Name }}" 66 - class="{{ $linkstyle }}" 67 - > 68 - <div class="flex items-center gap-2"> 69 - <i 70 - class="w-3 h-3" 71 - data-lucide="file" 72 - ></i 73 - >{{ .Name }} 74 - </div> 75 - </a> 76 - </div> 77 - {{ end }} 78 - {{ end }} 79 - </div> 80 - <div id="commit-log" class="flex-1"> 81 - {{ range .Commits }} 82 - <div 83 - class="relative 84 - px-4 85 - py-4 86 - border-l 87 - border-black 88 - before:content-[''] 89 - before:absolute 90 - before:w-1 91 - before:h-1 92 - before:bg-black 93 - before:rounded-full 94 - before:left-[-2.2px] 95 - before:top-1/2 96 - before:-translate-y-1/2 97 - "> 60 + {{ range .Files }} 61 + {{ if .IsFile }} 62 + <div class="{{ $containerstyle }}"> 63 + <a 64 + href="/{{ $.RepoInfo.FullName }}/blob/{{ $.Ref }}/{{ .Name }}" 65 + class="{{ $linkstyle }}" 66 + > 67 + <div class="flex items-center gap-2"> 68 + <i 69 + class="w-3 h-3" 70 + data-lucide="file" 71 + ></i 72 + >{{ .Name }} 73 + </div> 74 + </a> 75 + </div> 76 + {{ end }} 77 + {{ end }} 78 + </div> 79 + <div id="commit-log" class="flex-1"> 80 + {{ range .Commits }} 81 + <div 82 + class="relative 83 + px-4 84 + py-4 85 + border-l 86 + border-black 87 + before:content-[''] 88 + before:absolute 89 + before:w-1 90 + before:h-1 91 + before:bg-black 92 + before:rounded-full 93 + before:left-[-2.2px] 94 + before:top-1/2 95 + before:-translate-y-1/2 96 + "> 98 97 99 98 <div id="commit-message"> 100 99 {{ $messageParts := splitN .Message "\n\n" 2 }} ··· 104 103 <a href="/{{ $.RepoInfo.FullName }}/commit/{{ .Hash.String }}" class="inline no-underline hover:underline">{{ index $messageParts 0 }}</a> 105 104 {{ if gt (len $messageParts) 1 }} 106 105 <button class="text-sm inline rounded-sm bg-gray-300 text-gray-700 px-1 w-fit hover:bg-gray-400" 107 - hx-on:click="this.parentElement.nextElementSibling.classList.toggle('hidden')">&hellip;</button> 106 + hx-on:click="this.parentElement.nextElementSibling.classList.toggle('hidden')">&hellip;</button> 108 107 {{ end }} 109 108 </div> 110 109 {{ if gt (len $messageParts) 1 }} ··· 114 113 </div> 115 114 </div> 116 115 117 - <div class="text-xs text-gray-500"> 118 - <span class="font-mono"> 119 - <a 120 - href="/{{ $.RepoInfo.FullName }}/commit/{{ .Hash.String }}" 121 - class="text-gray-500 no-underline hover:underline" 122 - >{{ slice .Hash.String 0 8 }}</a 123 - > 124 - </span> 125 - &nbsp;·&nbsp; 126 - <span> 127 - <a 128 - href="mailto:{{ .Author.Email }}" 129 - class="text-gray-500 no-underline hover:underline" 130 - >{{ .Author.Name }}</a 131 - > 132 - </span> 133 - &nbsp;·&nbsp; 134 - <span>{{ timeFmt .Author.When }}</span> 135 - </div> 136 - </div> 137 - {{ end }} 138 - </div> 139 - </div> 140 - </section> 141 - {{- if .Readme }} 142 - <article class="readme"> 143 - {{- .Readme -}} 144 - </article> 145 - {{- end -}} 146 - {{- end -}} 116 + <div class="text-xs text-gray-500"> 117 + <span class="font-mono"> 118 + <a 119 + href="/{{ $.RepoInfo.FullName }}/commit/{{ .Hash.String }}" 120 + class="text-gray-500 no-underline hover:underline" 121 + >{{ slice .Hash.String 0 8 }}</a 122 + > 123 + </span> 124 + &nbsp;·&nbsp; 125 + <span> 126 + <a 127 + href="mailto:{{ .Author.Email }}" 128 + class="text-gray-500 no-underline hover:underline" 129 + >{{ .Author.Name }}</a 130 + > 131 + </span> 132 + &nbsp;·&nbsp; 133 + <span>{{ timeFmt .Author.When }}</span> 134 + </div> 135 + </div> 136 + {{ end }} 137 + </div> 138 + </div> 139 + {{- end -}} 147 140 141 + </main> 142 + {{ end }} 148 143 149 - <div class="clone-url"> 150 - <strong>clone</strong> 151 - <pre> 152 - git clone https://tangled.sh/{{ .RepoInfo.OwnerWithAt }}/{{ .RepoInfo.Name }} 153 - </pre 154 - > 155 - </div> 156 - </main> 144 + {{ define "repoAfter" }} 145 + {{- if .Readme }} 146 + <section class="mt-4 p-6 border border-black w-full mx-auto"> 147 + <article class="readme"> 148 + {{- .Readme -}} 149 + </article> 150 + </section> 151 + {{- end -}} 152 + 153 + <section class="mt-4 p-6 border border-black w-full mx-auto"> 154 + <strong>clone</strong> 155 + <pre> git clone https://tangled.sh/{{ .RepoInfo.OwnerWithAt }}/{{ .RepoInfo.Name }} </pre> 156 + </section> 157 157 {{ end }}