forked from tangled.org/core
Monorepo for Tangled

appview: rework layouting templates to be simpler

Signed-off-by: oppiliappan <me@oppi.li>

oppi.li 62ef376d 75a13776

verified
Changed files
+75 -150
appview
pages
templates
pulls
+23 -35
appview/pages/templates/layouts/base.html
··· 15 {{ block "extrameta" . }}{{ end }} 16 </head> 17 <body class="bg-slate-100 dark:bg-gray-900 dark:text-white transition-colors duration-200"> 18 - {{ block "topbarLayout" . }} 19 - <div class="px-1 grid grid-cols-1 md:grid-cols-12 gap-2"> 20 - <div class="{{ layoutSide }}"> 21 - {{ block "topbarLeft" . }} {{ end }} 22 - </div> 23 - <header style="z-index: 20" class="{{ layoutCenter }}"> 24 - {{ block "topbar" . }} 25 - {{ template "layouts/topbar" . }} 26 - {{ end }} 27 </header> 28 - <div class="{{ layoutSide }}"> 29 - {{ block "topbarRight" . }} {{ end }} 30 - </div> 31 </div> 32 - {{ end }} 33 34 - <div class="flex flex-col min-h-screen"> 35 {{ block "contentLayout" . }} 36 - <div class="px-1 grid grid-cols-1 md:grid-cols-12 gap-2"> 37 - <div class="{{ layoutSide }}"> 38 {{ block "contentLeft" . }} {{ end }} 39 </div> 40 - <main class="{{ layoutCenter }}"> 41 {{ block "content" . }}{{ end }} 42 </main> 43 - <div class="{{ layoutSide }}"> 44 {{ block "contentRight" . }} {{ end }} 45 </div> 46 </div> 47 {{ end }} 48 49 {{ block "contentAfterLayout" . }} 50 - <div class="px-1 grid grid-cols-1 md:grid-cols-12 gap-2"> 51 - <div class="{{ layoutSide }}"> 52 {{ block "contentAfterLeft" . }} {{ end }} 53 </div> 54 - <main class="px-1 {{ layoutCenter }}"> 55 {{ block "contentAfter" . }}{{ end }} 56 </main> 57 - <div class="{{ layoutSide }}"> 58 {{ block "contentAfterRight" . }} {{ end }} 59 </div> 60 </div> 61 {{ end }} 62 </div> 63 64 - {{ block "footerLayout" . }} 65 - <div class="px-1 grid grid-cols-1 md:grid-cols-12 gap-2"> 66 - <div class="{{ layoutSide }}"> 67 - {{ block "footerLeft" . }} {{ end }} 68 - </div> 69 - <footer class="mt-16 {{ layoutCenter }}"> 70 - {{ block "footer" . }} 71 - {{ template "layouts/footer" . }} 72 - {{ end }} 73 </footer> 74 - <div class="{{ layoutSide }}"> 75 - {{ block "footerRight" . }} {{ end }} 76 - </div> 77 </div> 78 - {{ end }} 79 80 </body> 81 </html>
··· 15 {{ block "extrameta" . }}{{ end }} 16 </head> 17 <body class="bg-slate-100 dark:bg-gray-900 dark:text-white transition-colors duration-200"> 18 + <div class="px-1" style="z-index: 20"> 19 + {{ block "topbarLayout" . }} 20 + <div class="grid grid-cols-1 md:grid-cols-12"> 21 + <header class="col-span-1 md:col-start-3 md:col-span-8"> 22 + {{ template "layouts/topbar" . }} 23 </header> 24 </div> 25 + {{ end }} 26 + </div> 27 28 + <div class="px-1 flex flex-col min-h-screen gap-4"> 29 {{ block "contentLayout" . }} 30 + <div class="grid grid-cols-1 md:grid-cols-12 gap-4"> 31 + <div class="col-span-1 md:col-span-2"> 32 {{ block "contentLeft" . }} {{ end }} 33 </div> 34 + <main class="col-span-1 md:col-span-8"> 35 {{ block "content" . }}{{ end }} 36 </main> 37 + <div class="col-span-1 md:col-span-2"> 38 {{ block "contentRight" . }} {{ end }} 39 </div> 40 </div> 41 {{ end }} 42 43 {{ block "contentAfterLayout" . }} 44 + <div class="grid grid-cols-1 md:grid-cols-12 gap-4"> 45 + <div class="col-span-1 md:col-span-2"> 46 {{ block "contentAfterLeft" . }} {{ end }} 47 </div> 48 + <main class="col-span-1 md:col-span-8"> 49 {{ block "contentAfter" . }}{{ end }} 50 </main> 51 + <div class="col-span-1 md:col-span-2"> 52 {{ block "contentAfterRight" . }} {{ end }} 53 </div> 54 </div> 55 {{ end }} 56 </div> 57 58 + <div class="px-1 mt-16"> 59 + {{ block "footerLayout" . }} 60 + <div class="grid grid-cols-1 md:grid-cols-12"> 61 + <footer class="col-span-1 md:col-start-3 md:col-span-8"> 62 + {{ template "layouts/footer" . }} 63 </footer> 64 </div> 65 + {{ end }} 66 + </div> 67 68 </body> 69 </html>
+9 -25
appview/pages/templates/repo/commit.html
··· 80 {{end}} 81 82 {{ define "topbarLayout" }} 83 - <div class="px-1 grid grid-cols-1"> 84 - <header style="z-index: 20" class="col-span-1"> 85 - {{ block "topbar" . }} 86 - {{ template "layouts/topbar" . }} 87 - {{ end }} 88 - </header> 89 - </div> 90 {{ end }} 91 92 - {{ define "contentLayout" }} 93 - <div class="grid grid-cols-1 md:grid-cols-1 gap-2"> 94 - <main class="px-1 col-span-1"> 95 - {{ block "content" . }}{{ end }} 96 - </main> 97 - </div> 98 {{ end }} 99 100 - {{ block "contentAfterLayout" . }} 101 - <div class="grid grid-cols-1 md:grid-cols-12 gap-2"> 102 <div class="col-span-1 md:col-span-2"> 103 {{ block "contentAfterLeft" . }} {{ end }} 104 </div> 105 - <main class="px-1 col-span-1 md:col-span-10"> 106 {{ block "contentAfter" . }}{{ end }} 107 </main> 108 </div> 109 {{ end }} 110 111 - {{ block "footerLayout" . }} 112 - <div class="px-1 grid grid-cols-1"> 113 - <footer class="mt-16 col-span-1"> 114 - {{ block "footer" . }} 115 - {{ template "layouts/footer" . }} 116 - {{ end }} 117 - </footer> 118 - </div> 119 {{ end }} 120 121 {{ define "contentAfter" }} ··· 123 {{end}} 124 125 {{ define "contentAfterLeft" }} 126 - <div class="flex flex-col gap-4 col-span-1 md:col-span-2 mt-4"> 127 {{ template "repo/fragments/diffOpts" .DiffOpts }} 128 </div> 129 <div class="sticky top-0 mt-4">
··· 80 {{end}} 81 82 {{ define "topbarLayout" }} 83 + {{ template "layouts/topbar" . }} 84 {{ end }} 85 86 + {{ define "contentLayout" }} 87 + {{ block "content" . }}{{ end }} 88 {{ end }} 89 90 + {{ define "contentAfterLayout" }} 91 + <div class="grid grid-cols-1 md:grid-cols-12 gap-4"> 92 <div class="col-span-1 md:col-span-2"> 93 {{ block "contentAfterLeft" . }} {{ end }} 94 </div> 95 + <main class="col-span-1 md:col-span-10"> 96 {{ block "contentAfter" . }}{{ end }} 97 </main> 98 </div> 99 {{ end }} 100 101 + {{ define "footerLayout" }} 102 + {{ template "layouts/footer" . }} 103 {{ end }} 104 105 {{ define "contentAfter" }} ··· 107 {{end}} 108 109 {{ define "contentAfterLeft" }} 110 + <div class="flex flex-col gap-4 col-span-1 md:col-span-2"> 111 {{ template "repo/fragments/diffOpts" .DiffOpts }} 112 </div> 113 <div class="sticky top-0 mt-4">
+9 -25
appview/pages/templates/repo/compare/compare.html
··· 11 {{ end }} 12 13 {{ define "topbarLayout" }} 14 - <div class="px-1 grid grid-cols-1"> 15 - <header style="z-index: 20" class="col-span-1"> 16 - {{ block "topbar" . }} 17 - {{ template "layouts/topbar" . }} 18 - {{ end }} 19 - </header> 20 - </div> 21 {{ end }} 22 23 - {{ define "contentLayout" }} 24 - <div class="grid grid-cols-1 md:grid-cols-1 gap-2"> 25 - <main class="px-1 col-span-1"> 26 - {{ block "content" . }}{{ end }} 27 - </main> 28 - </div> 29 {{ end }} 30 31 - {{ block "contentAfterLayout" . }} 32 - <div class="grid grid-cols-1 md:grid-cols-12 gap-2"> 33 <div class="col-span-1 md:col-span-2"> 34 {{ block "contentAfterLeft" . }} {{ end }} 35 </div> 36 - <main class="px-1 col-span-1 md:col-span-10"> 37 {{ block "contentAfter" . }}{{ end }} 38 </main> 39 </div> 40 {{ end }} 41 42 - {{ block "footerLayout" . }} 43 - <div class="px-1 grid grid-cols-1"> 44 - <footer class="mt-16 col-span-1"> 45 - {{ block "footer" . }} 46 - {{ template "layouts/footer" . }} 47 - {{ end }} 48 - </footer> 49 - </div> 50 {{ end }} 51 52 {{ define "contentAfter" }} ··· 54 {{end}} 55 56 {{ define "contentAfterLeft" }} 57 - <div class="flex flex-col gap-4 col-span-1 md:col-span-2 mt-4"> 58 {{ template "repo/fragments/diffOpts" .DiffOpts }} 59 </div> 60 <div class="sticky top-0 mt-4">
··· 11 {{ end }} 12 13 {{ define "topbarLayout" }} 14 + {{ template "layouts/topbar" . }} 15 {{ end }} 16 17 + {{ define "contentLayout" }} 18 + {{ block "content" . }}{{ end }} 19 {{ end }} 20 21 + {{ define "contentAfterLayout" }} 22 + <div class="grid grid-cols-1 md:grid-cols-12 gap-4"> 23 <div class="col-span-1 md:col-span-2"> 24 {{ block "contentAfterLeft" . }} {{ end }} 25 </div> 26 + <main class="col-span-1 md:col-span-10"> 27 {{ block "contentAfter" . }}{{ end }} 28 </main> 29 </div> 30 {{ end }} 31 32 + {{ define "footerLayout" }} 33 + {{ template "layouts/footer" . }} 34 {{ end }} 35 36 {{ define "contentAfter" }} ··· 38 {{end}} 39 40 {{ define "contentAfterLeft" }} 41 + <div class="flex flex-col gap-4 col-span-1 md:col-span-2"> 42 {{ template "repo/fragments/diffOpts" .DiffOpts }} 43 </div> 44 <div class="sticky top-0 mt-4">
+12 -10
appview/pages/templates/repo/fragments/diff.html
··· 1 {{ define "repo/fragments/diff" }} 2 - {{ $repo := index . 0 }} 3 - {{ $diff := index . 1 }} 4 - {{ $opts := index . 2 }} 5 6 - {{ $commit := $diff.Commit }} 7 - {{ $diff := $diff.Diff }} 8 - {{ $isSplit := $opts.Split }} 9 - {{ $this := $commit.This }} 10 - {{ $parent := $commit.Parent }} 11 12 - {{ $last := sub (len $diff) 1 }} 13 {{ range $idx, $hunk := $diff }} 14 {{ with $hunk }} 15 - <section class="mt-4 border border-gray-200 dark:border-gray-700 w-full mx-auto rounded bg-white dark:bg-gray-800 drop-shadow-sm"> 16 <div id="file-{{ .Name.New }}"> 17 <div id="diff-file"> 18 <details open> ··· 103 </section> 104 {{ end }} 105 {{ end }} 106 {{ end }}
··· 1 {{ define "repo/fragments/diff" }} 2 + {{ $repo := index . 0 }} 3 + {{ $diff := index . 1 }} 4 + {{ $opts := index . 2 }} 5 6 + {{ $commit := $diff.Commit }} 7 + {{ $diff := $diff.Diff }} 8 + {{ $isSplit := $opts.Split }} 9 + {{ $this := $commit.This }} 10 + {{ $parent := $commit.Parent }} 11 + {{ $last := sub (len $diff) 1 }} 12 13 + <div class="flex flex-col gap-4"> 14 {{ range $idx, $hunk := $diff }} 15 {{ with $hunk }} 16 + <section class="border border-gray-200 dark:border-gray-700 w-full mx-auto rounded bg-white dark:bg-gray-800 drop-shadow-sm"> 17 <div id="file-{{ .Name.New }}"> 18 <div id="diff-file"> 19 <details open> ··· 104 </section> 105 {{ end }} 106 {{ end }} 107 + </div> 108 {{ end }}
+3 -1
appview/pages/templates/repo/fragments/interdiff.html
··· 7 {{ $last := sub (len $diff) 1 }} 8 {{ $isSplit := $opts.Split }} 9 10 {{ range $idx, $hunk := $diff }} 11 {{ with $hunk }} 12 - <section class="mt-4 border border-gray-200 dark:border-gray-700 w-full mx-auto rounded bg-white dark:bg-gray-800 drop-shadow-sm"> 13 <div id="file-{{ .Name }}"> 14 <div id="diff-file"> 15 <details {{ if not (.Status.IsOnlyInOne) }}open{{end}}> ··· 86 </section> 87 {{ end }} 88 {{ end }} 89 {{ end }} 90
··· 7 {{ $last := sub (len $diff) 1 }} 8 {{ $isSplit := $opts.Split }} 9 10 + <div class="flex flex-col gap-4"> 11 {{ range $idx, $hunk := $diff }} 12 {{ with $hunk }} 13 + <section class="border border-gray-200 dark:border-gray-700 w-full mx-auto rounded bg-white dark:bg-gray-800 drop-shadow-sm"> 14 <div id="file-{{ .Name }}"> 15 <div id="diff-file"> 16 <details {{ if not (.Status.IsOnlyInOne) }}open{{end}}> ··· 87 </section> 88 {{ end }} 89 {{ end }} 90 + </div> 91 {{ end }} 92
+10 -25
appview/pages/templates/repo/pulls/interdiff.html
··· 29 {{ end }} 30 31 {{ define "topbarLayout" }} 32 - <div class="px-1 grid grid-cols-1"> 33 - <header style="z-index: 20" class="col-span-1"> 34 - {{ block "topbar" . }} 35 - {{ template "layouts/topbar" . }} 36 - {{ end }} 37 - </header> 38 - </div> 39 {{ end }} 40 41 - {{ define "contentLayout" }} 42 - <div class="grid grid-cols-1 md:grid-cols-1 gap-2"> 43 - <main class="px-1 col-span-1"> 44 - {{ block "content" . }}{{ end }} 45 - </main> 46 - </div> 47 {{ end }} 48 49 - {{ block "contentAfterLayout" . }} 50 - <div class="grid grid-cols-1 md:grid-cols-12 gap-2"> 51 <div class="col-span-1 md:col-span-2"> 52 {{ block "contentAfterLeft" . }} {{ end }} 53 </div> 54 - <main class="px-1 col-span-1 md:col-span-10"> 55 {{ block "contentAfter" . }}{{ end }} 56 </main> 57 </div> 58 {{ end }} 59 60 - {{ block "footerLayout" . }} 61 - <div class="px-1 grid grid-cols-1"> 62 - <footer class="mt-16 col-span-1"> 63 - {{ block "footer" . }} 64 - {{ template "layouts/footer" . }} 65 - {{ end }} 66 - </footer> 67 - </div> 68 {{ end }} 69 70 {{ define "contentAfter" }} 71 {{ template "repo/fragments/interdiff" (list .RepoInfo.FullName .Interdiff .DiffOpts) }} 72 {{end}} 73 74 {{ define "contentAfterLeft" }} 75 - <div class="flex flex-col gap-4 col-span-1 md:col-span-2 mt-4"> 76 {{ template "repo/fragments/diffOpts" .DiffOpts }} 77 </div> 78 <div class="sticky top-0 mt-4">
··· 29 {{ end }} 30 31 {{ define "topbarLayout" }} 32 + {{ template "layouts/topbar" . }} 33 {{ end }} 34 35 + {{ define "contentLayout" }} 36 + {{ block "content" . }}{{ end }} 37 {{ end }} 38 39 + {{ define "contentAfterLayout" }} 40 + <div class="grid grid-cols-1 md:grid-cols-12 gap-4"> 41 <div class="col-span-1 md:col-span-2"> 42 {{ block "contentAfterLeft" . }} {{ end }} 43 </div> 44 + <main class="col-span-1 md:col-span-10"> 45 {{ block "contentAfter" . }}{{ end }} 46 </main> 47 </div> 48 {{ end }} 49 50 + {{ define "footerLayout" }} 51 + {{ template "layouts/footer" . }} 52 {{ end }} 53 + 54 55 {{ define "contentAfter" }} 56 {{ template "repo/fragments/interdiff" (list .RepoInfo.FullName .Interdiff .DiffOpts) }} 57 {{end}} 58 59 {{ define "contentAfterLeft" }} 60 + <div class="flex flex-col gap-4 col-span-1 md:col-span-2"> 61 {{ template "repo/fragments/diffOpts" .DiffOpts }} 62 </div> 63 <div class="sticky top-0 mt-4">
+9 -25
appview/pages/templates/repo/pulls/patch.html
··· 35 {{ end }} 36 37 {{ define "topbarLayout" }} 38 - <div class="px-1 grid grid-cols-1"> 39 - <header style="z-index: 20" class="col-span-1"> 40 - {{ block "topbar" . }} 41 - {{ template "layouts/topbar" . }} 42 - {{ end }} 43 - </header> 44 - </div> 45 {{ end }} 46 47 - {{ define "contentLayout" }} 48 - <div class="grid grid-cols-1 md:grid-cols-1 gap-2"> 49 - <main class="px-1 col-span-1"> 50 - {{ block "content" . }}{{ end }} 51 - </main> 52 - </div> 53 {{ end }} 54 55 - {{ block "contentAfterLayout" . }} 56 - <div class="grid grid-cols-1 md:grid-cols-12 gap-2"> 57 <div class="col-span-1 md:col-span-2"> 58 {{ block "contentAfterLeft" . }} {{ end }} 59 </div> 60 - <main class="px-1 col-span-1 md:col-span-10"> 61 {{ block "contentAfter" . }}{{ end }} 62 </main> 63 </div> 64 {{ end }} 65 66 - {{ block "footerLayout" . }} 67 - <div class="px-1 grid grid-cols-1"> 68 - <footer class="mt-16 col-span-1"> 69 - {{ block "footer" . }} 70 - {{ template "layouts/footer" . }} 71 - {{ end }} 72 - </footer> 73 - </div> 74 {{ end }} 75 76 {{ define "contentAfter" }} ··· 78 {{end}} 79 80 {{ define "contentAfterLeft" }} 81 - <div class="flex flex-col gap-4 col-span-1 md:col-span-2 mt-4"> 82 {{ template "repo/fragments/diffOpts" .DiffOpts }} 83 </div> 84 <div class="sticky top-0 mt-4">
··· 35 {{ end }} 36 37 {{ define "topbarLayout" }} 38 + {{ template "layouts/topbar" . }} 39 {{ end }} 40 41 + {{ define "contentLayout" }} 42 + {{ block "content" . }}{{ end }} 43 {{ end }} 44 45 + {{ define "contentAfterLayout" }} 46 + <div class="grid grid-cols-1 md:grid-cols-12 gap-4"> 47 <div class="col-span-1 md:col-span-2"> 48 {{ block "contentAfterLeft" . }} {{ end }} 49 </div> 50 + <main class="col-span-1 md:col-span-10"> 51 {{ block "contentAfter" . }}{{ end }} 52 </main> 53 </div> 54 {{ end }} 55 56 + {{ define "footerLayout" }} 57 + {{ template "layouts/footer" . }} 58 {{ end }} 59 60 {{ define "contentAfter" }} ··· 62 {{end}} 63 64 {{ define "contentAfterLeft" }} 65 + <div class="flex flex-col gap-4 col-span-1 md:col-span-2"> 66 {{ template "repo/fragments/diffOpts" .DiffOpts }} 67 </div> 68 <div class="sticky top-0 mt-4">
-4
appview/pulls/pulls.go
··· 467 468 interdiff := patchutil.Interdiff(previousPatch, currentPatch) 469 470 - for _, f := range interdiff.Files { 471 - log.Println("", "", f.Split()) 472 - } 473 - 474 s.pages.RepoPullInterdiffPage(w, pages.RepoPullInterdiffParams{ 475 LoggedInUser: s.oauth.GetUser(r), 476 RepoInfo: f.RepoInfo(user),
··· 467 468 interdiff := patchutil.Interdiff(previousPatch, currentPatch) 469 470 s.pages.RepoPullInterdiffPage(w, pages.RepoPullInterdiffParams{ 471 LoggedInUser: s.oauth.GetUser(r), 472 RepoInfo: f.RepoInfo(user),