aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorRunxi Yu <me@runxiyu.org>2025-03-31 09:46:58 +0800
committerRunxi Yu <me@runxiyu.org>2025-03-31 10:07:28 +0800
commitd4fc25b735555cb53175dba88df258834ba650fb (patch)
tree5c999830a1dfc8512478a9b11b4bf78c7ead2d9f
parentMandoc more (diff)
downloadforge-d4fc25b735555cb53175dba88df258834ba650fb.tar.gz
forge-d4fc25b735555cb53175dba88df258834ba650fb.tar.zst
forge-d4fc25b735555cb53175dba88df258834ba650fb.zip
Proper tabs on repo index
-rw-r--r--static/style.css72
-rw-r--r--templates/_header.tmpl3
-rw-r--r--templates/repo_commit.tmpl32
-rw-r--r--templates/repo_contrib_index.tmpl32
-rw-r--r--templates/repo_contrib_one.tmpl32
-rw-r--r--templates/repo_index.tmpl20
-rw-r--r--templates/repo_log.tmpl51
-rw-r--r--templates/repo_raw_dir.tmpl15
-rw-r--r--templates/repo_tree_dir.tmpl17
-rw-r--r--templates/repo_tree_file.tmpl17
10 files changed, 243 insertions, 48 deletions
diff --git a/static/style.css b/static/style.css
index 0776d40..ba85d3f 100644
--- a/static/style.css
+++ b/static/style.css
@@ -2,8 +2,16 @@
* SPDX-License-Identifier: AGPL-3.0-only
* SPDX-FileContributor: Runxi Yu <https://runxiyu.org>
* SPDX-FileContributor: luk3yx <https://luk3yx.github.io>
+ * SPDX-FileContributor: Drew DeVault <https://drewdevault.com>
+ *
+ * Drew did not directly contribute here but we took significant portions of
+ * SourceHut's CSS.
*/
+* {
+ box-sizing: border-box;
+}
+
/* Base styles and variables */
html {
font-family: sans-serif;
@@ -90,14 +98,8 @@ footer a:link, footer a:visited {
color: inherit;
}
-/* Padding containers */
-.padding-wrapper {
- margin: 1rem auto;
- max-width: 60rem;
- padding: 0 5px;
-}
.padding {
- padding: 0 5px;
+ padding: 0 1rem;
}
/* Link styles */
@@ -351,7 +353,8 @@ header#main-header {
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
- padding: 0.625rem 1rem;
+ padding-top: 1rem;
+ padding-bottom: 1rem;
gap: 0.5rem;
}
#main-header a, #main-header a:link, main-header a:visited {
@@ -501,15 +504,19 @@ td > ul {
flex-wrap: nowrap;
padding: 0;
border-bottom: 0.25rem var(--darker-box-background-color) solid;
+ width: 100%;
+ max-width: 100%;
+ min-width: 100%;
}
-.nav-tabs-standalone li {
+.nav-tabs-standalone > li {
align-self: flex-end;
+}
+.nav-tabs-standalone > li > a {
padding: 0 1rem;
}
-.nav-item.active {
- font-weigt: bold;
+.nav-item a.active {
background-color: var(--darker-box-background-color);
}
@@ -517,3 +524,46 @@ td > ul {
text-decoration: none;
color: inherit;
}
+
+.repo-header-extension {
+ margin-bottom: 1rem;
+ background-color: var(--darker-box-background-color);
+}
+
+.repo-header > h2 {
+ display: inline;
+ margin: 0;
+ padding-right: 1rem;
+}
+
+.repo-header > .nav-tabs-standalone {
+ border: none;
+ margin: 0;
+ flex-grow: 1;
+ display: inline-flex;
+ flex-wrap: nowrap;
+ padding: 0;
+}
+
+.repo-header {
+ display: flex;
+ flex-wrap: nowrap;
+}
+
+.repo-header-extension-content {
+ padding-top: 0.3rem;
+ padding-bottom: 0.2rem;
+}
+
+.repo-header, .padding-wrapper, .repo-header-extension-content, #main-header {
+ padding-left: 1rem;
+ padding-right: 1rem;
+ max-width: 60rem;
+ width: 100%;
+ margin-left: auto;
+ margin-right: auto;
+}
+
+.padding-wrapper {
+ margin-bottom: 1rem;
+}
diff --git a/templates/_header.tmpl b/templates/_header.tmpl
index e0d69e4..3fe483a 100644
--- a/templates/_header.tmpl
+++ b/templates/_header.tmpl
@@ -13,7 +13,8 @@
{{- $dir_mode := .dir_mode -}}
{{- $ref_type := .ref_type -}}
{{- $ref := .ref_name -}}
- {{- range $i, $segment := .url_segments -}}
+ {{- range $i := .separator_index -}}
+ {{- $segment := index $url_segments $i -}}
{{- $path = printf "%s/%s" $path $segment -}}
<span class="breadcrumb-separator">/</span>
<a href="{{ $path }}{{ if or (ne $i (minus (len $url_segments) 1)) $dir_mode }}/{{ end }}{{- if $ref_type -}}?{{- $ref_type -}}={{- $ref -}}{{- end -}}">{{ $segment }}</a>
diff --git a/templates/repo_commit.tmpl b/templates/repo_commit.tmpl
index 4265f39..be71211 100644
--- a/templates/repo_commit.tmpl
+++ b/templates/repo_commit.tmpl
@@ -3,6 +3,7 @@
SPDX-FileContributor: Runxi Yu <https://runxiyu.org>
*/}}
{{- define "repo_commit" -}}
+{{- $root := . -}}
<!DOCTYPE html>
<html lang="en">
<head>
@@ -11,6 +12,37 @@
</head>
<body class="repo-commit">
{{- template "header" . -}}
+ <div class="repo-header">
+ <h2>{{- .repo_name -}}</h2>
+ <ul class="nav-tabs-standalone">
+ <li class="nav-item">
+ <a class="nav-link" href="../{{- template "ref_query" $root -}}">Summary</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../tree/{{- template "ref_query" $root -}}">Tree</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../log/{{- template "ref_query" $root -}}">Log</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../branches/">Branches</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../tags/">Tags</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../contrib/">Merge requests</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../settings/">Settings</a>
+ </li>
+ </ul>
+ </div>
+ <div class="repo-header-extension">
+ <div class="repo-header-extension-content">
+ {{- .repo_description -}}
+ </div>
+ </div>
<div class="padding-wrapper scroll">
<div class="key-val-grid-wrapper">
<section id="commit-info" class="key-val-grid">
diff --git a/templates/repo_contrib_index.tmpl b/templates/repo_contrib_index.tmpl
index 81fdb1a..671e0d3 100644
--- a/templates/repo_contrib_index.tmpl
+++ b/templates/repo_contrib_index.tmpl
@@ -3,6 +3,7 @@
SPDX-FileContributor: Runxi Yu <https://runxiyu.org>
*/}}
{{- define "repo_contrib_index" -}}
+{{- $root := . -}}
<!DOCTYPE html>
<html lang="en">
<head>
@@ -11,6 +12,37 @@
</head>
<body class="repo-contrib-index">
{{- template "header" . -}}
+ <div class="repo-header">
+ <h2>{{- .repo_name -}}</h2>
+ <ul class="nav-tabs-standalone">
+ <li class="nav-item">
+ <a class="nav-link" href="../{{- template "ref_query" $root -}}">Summary</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../tree/{{- template "ref_query" $root -}}">Tree</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../log/{{- template "ref_query" $root -}}">Log</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../branches/">Branches</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../tags/">Tags</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link active" href="../contrib/">Merge requests</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../settings/">Settings</a>
+ </li>
+ </ul>
+ </div>
+ <div class="repo-header-extension">
+ <div class="repo-header-extension-content">
+ {{- .repo_description -}}
+ </div>
+ </div>
<div class="padding-wrapper">
<table id="recent-merge_requests" class="wide">
<thead>
diff --git a/templates/repo_contrib_one.tmpl b/templates/repo_contrib_one.tmpl
index 640855a..8e10e9b 100644
--- a/templates/repo_contrib_one.tmpl
+++ b/templates/repo_contrib_one.tmpl
@@ -3,6 +3,7 @@
SPDX-FileContributor: Runxi Yu <https://runxiyu.org>
*/}}
{{- define "repo_contrib_one" -}}
+{{- $root := . -}}
<!DOCTYPE html>
<html lang="en">
<head>
@@ -11,6 +12,37 @@
</head>
<body class="repo-contrib-one">
{{- template "header" . -}}
+ <div class="repo-header">
+ <h2>{{- .repo_name -}}</h2>
+ <ul class="nav-tabs-standalone">
+ <li class="nav-item">
+ <a class="nav-link" href="../{{- template "ref_query" $root -}}">Summary</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../tree/{{- template "ref_query" $root -}}">Tree</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../log/{{- template "ref_query" $root -}}">Log</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../branches/">Branches</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../tags/">Tags</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link active" href="../contrib/">Merge requests</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../settings/">Settings</a>
+ </li>
+ </ul>
+ </div>
+ <div class="repo-header-extension">
+ <div class="repo-header-extension-content">
+ {{- .repo_description -}}
+ </div>
+ </div>
<div class="padding-wrapper">
<table id="mr-info-table">
<thead>
diff --git a/templates/repo_index.tmpl b/templates/repo_index.tmpl
index 6db5b05..d07ebf5 100644
--- a/templates/repo_index.tmpl
+++ b/templates/repo_index.tmpl
@@ -12,10 +12,11 @@
</head>
<body class="repo-index">
{{- template "header" . -}}
- <div class="padding-wrapper">
+ <div class="repo-header">
+ <h2>{{- .repo_name -}}</h2>
<ul class="nav-tabs-standalone">
- <li class="nav-item active">
- <a class="nav-link" href="./{{- template "ref_query" $root -}}">Summary</a>
+ <li class="nav-item">
+ <a class="nav-link active" href="./{{- template "ref_query" $root -}}">Summary</a>
</li>
<li class="nav-item">
<a class="nav-link" href="tree/{{- template "ref_query" $root -}}">Tree</a>
@@ -30,10 +31,18 @@
<a class="nav-link" href="tags/">Tags</a>
</li>
<li class="nav-item">
+ <a class="nav-link" href="contrib/">Merge requests</a>
+ </li>
+ <li class="nav-item">
<a class="nav-link" href="settings/">Settings</a>
</li>
</ul>
</div>
+ <div class="repo-header-extension">
+ <div class="repo-header-extension-content">
+ {{- .repo_description -}}
+ </div>
+ </div>
<div class="padding-wrapper">
<div class="key-val-grid-wrapper">
<section id="repo-info" class="key-val-grid">
@@ -75,11 +84,6 @@
</tbody>
</table>
</div>
- <div class="padding-wrapper">
- <p>
- <a href="contrib/" class="btn-normal">Merge requests</a>
- </p>
- </div>
{{- if .commits -}}
<div class="padding-wrapper scroll">
<table id="recent-commits" class="wide">
diff --git a/templates/repo_log.tmpl b/templates/repo_log.tmpl
index b8f3563..08dd0ed 100644
--- a/templates/repo_log.tmpl
+++ b/templates/repo_log.tmpl
@@ -12,26 +12,37 @@
</head>
<body class="repo-log">
{{- template "header" . -}}
- <ul class="nav-tabs-standalone">
- <li class="nav-item">
- <a class="nav-link" href="../{{- template "ref_query" $root -}}">Summary</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" href="../tree/{{- template "ref_query" $root -}}">Tree</a>
- </li>
- <li class="nav-item active">
- <a class="nav-link" href="../log/{{- template "ref_query" $root -}}">Log</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" href="../branches/">Branches</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" href="../tags/">Tags</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" href="../settings/">Settings</a>
- </li>
- </ul>
+ <div class="repo-header">
+ <h2>{{- .repo_name -}}</h2>
+ <ul class="nav-tabs-standalone">
+ <li class="nav-item">
+ <a class="nav-link" href="../{{- template "ref_query" $root -}}">Summary</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../tree/{{- template "ref_query" $root -}}">Tree</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link active" href="../log/{{- template "ref_query" $root -}}">Log</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../branches/">Branches</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../tags/">Tags</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../contrib/">Merge requests</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="../settings/">Settings</a>
+ </li>
+ </ul>
+ </div>
+ <div class="repo-header-extension">
+ <div class="repo-header-extension-content">
+ {{- .repo_description -}}
+ </div>
+ </div>
<div class="scroll">
<table id="commits" class="wide">
<thead>
diff --git a/templates/repo_raw_dir.tmpl b/templates/repo_raw_dir.tmpl
index 1b9f59b..927101b 100644
--- a/templates/repo_raw_dir.tmpl
+++ b/templates/repo_raw_dir.tmpl
@@ -12,13 +12,14 @@
</head>
<body class="repo-raw-dir">
{{- template "header" . -}}
- <div class="padding-wrapper scroll">
+ <div class="repo-header">
+ <h2>{{- .repo_name -}}</h2>
<ul class="nav-tabs-standalone">
<li class="nav-item">
<a class="nav-link" href="../{{- template "ref_query" $root -}}">Summary</a>
</li>
<li class="nav-item">
- <a class="nav-link" href="../tree/{{- template "ref_query" $root -}}">Tree</a>
+ <a class="nav-link active" href="../tree/{{- template "ref_query" $root -}}">Tree</a>
</li>
<li class="nav-item">
<a class="nav-link" href="../log/{{- template "ref_query" $root -}}">Log</a>
@@ -30,9 +31,19 @@
<a class="nav-link" href="../tags/">Tags</a>
</li>
<li class="nav-item">
+ <a class="nav-link" href="../contrib/">Merge requests</a>
+ </li>
+ <li class="nav-item">
<a class="nav-link" href="../settings/">Settings</a>
</li>
</ul>
+ </div>
+ <div class="repo-header-extension">
+ <div class="repo-header-extension-content">
+ {{- .repo_description -}}
+ </div>
+ </div>
+ <div class="padding-wrapper scroll">
<table id="file-tree" class="wide">
<thead>
<tr class="title-row">
diff --git a/templates/repo_tree_dir.tmpl b/templates/repo_tree_dir.tmpl
index cf94203..bc7279a 100644
--- a/templates/repo_tree_dir.tmpl
+++ b/templates/repo_tree_dir.tmpl
@@ -12,13 +12,14 @@
</head>
<body class="repo-tree-dir">
{{- template "header" . -}}
- <div class="padding-wrapper scroll">
+ <div class="repo-header">
+ <h2>{{- .repo_name -}}</h2>
<ul class="nav-tabs-standalone">
<li class="nav-item">
<a class="nav-link" href="../{{- template "ref_query" $root -}}">Summary</a>
</li>
- <li class="nav-item active">
- <a class="nav-link" href="../tree/{{- template "ref_query" $root -}}">Tree</a>
+ <li class="nav-item">
+ <a class="nav-link active" href="../tree/{{- template "ref_query" $root -}}">Tree</a>
</li>
<li class="nav-item">
<a class="nav-link" href="../log/{{- template "ref_query" $root -}}">Log</a>
@@ -30,9 +31,19 @@
<a class="nav-link" href="../tags/">Tags</a>
</li>
<li class="nav-item">
+ <a class="nav-link" href="../contrib/">Merge requests</a>
+ </li>
+ <li class="nav-item">
<a class="nav-link" href="../settings/">Settings</a>
</li>
</ul>
+ </div>
+ <div class="repo-header-extension">
+ <div class="repo-header-extension-content">
+ {{- .repo_description -}}
+ </div>
+ </div>
+ <div class="padding-wrapper scroll">
<table id="file-tree" class="wide">
<thead>
<tr class="title-row">
diff --git a/templates/repo_tree_file.tmpl b/templates/repo_tree_file.tmpl
index aa1c020..56159aa 100644
--- a/templates/repo_tree_file.tmpl
+++ b/templates/repo_tree_file.tmpl
@@ -13,13 +13,14 @@
</head>
<body class="repo-tree-file">
{{- template "header" . -}}
- <div class="padding">
+ <div class="repo-header">
+ <h2>{{- .repo_name -}}</h2>
<ul class="nav-tabs-standalone">
<li class="nav-item">
<a class="nav-link" href="../{{- template "ref_query" $root -}}">Summary</a>
</li>
- <li class="nav-item active">
- <a class="nav-link" href="../tree/{{- template "ref_query" $root -}}">Tree</a>
+ <li class="nav-item">
+ <a class="nav-link active" href="../tree/{{- template "ref_query" $root -}}">Tree</a>
</li>
<li class="nav-item">
<a class="nav-link" href="../log/{{- template "ref_query" $root -}}">Log</a>
@@ -31,9 +32,19 @@
<a class="nav-link" href="../tags/">Tags</a>
</li>
<li class="nav-item">
+ <a class="nav-link" href="../contrib/">Merge requests</a>
+ </li>
+ <li class="nav-item">
<a class="nav-link" href="../settings/">Settings</a>
</li>
</ul>
+ </div>
+ <div class="repo-header-extension">
+ <div class="repo-header-extension-content">
+ {{- .repo_description -}}
+ </div>
+ </div>
+ <div class="padding">
<p>
/{{ .path_spec }} (<a href="/{{ template "group_path_plain" .group_path }}/:/repos/{{ .repo_name }}/raw/{{ .path_spec }}{{- template "ref_query" $root -}}">raw</a>)
</p>