Pulse page improvements (#30149)

1. add border-radius and spacing to bars
2. use tailwind background classes
3. Add more space around activity list headers

<img width="983" alt="Screenshot 2024-03-27 at 23 40 54"
src="https://github.com/go-gitea/gitea/assets/115237/70f72c30-e69f-4ecb-882f-32b8bc94d638">
<img width="1020" alt="Screenshot 2024-03-27 at 23 41 02"
src="https://github.com/go-gitea/gitea/assets/115237/a35dbbda-515c-40b0-938a-d759f9686b8e">

diff --git a/templates/repo/pulse.tmpl b/templates/repo/pulse.tmpl
index cfb3ec1d3d1e3fc8ba48d5244c1ee32d7f89dd85..bc25563d488b2275831dc2bf4eae1ba4d1b7a43a 100644 (file)
--- a/templates/repo/pulse.tmpl
+++ b/templates/repo/pulse.tmpl
@@ -25,12 +25,14 @@
                <div class="column">
                        {{if gt .Activity.ActivePRCount 0}}
                        <div class="stats-table">
-                               <a href="#merged-pull-requests" class="table-cell tiny background purple" style="width: {{.Activity.MergedPRPerc}}{{if ne .Activity.MergedPRPerc 0}}%{{end}}"></a>
-                               <a href="#proposed-pull-requests" class="table-cell tiny background green"></a>
+                               {{if gt .Activity.MergedPRPerc 0}}
+                                       <a href="#merged-pull-requests" class="table-cell tiny tw-bg-purple" style="width: {{.Activity.MergedPRPerc}}%"></a>
+                               {{end}}
+                               <a href="#proposed-pull-requests" class="table-cell tiny tw-bg-green"></a>
                        </div>
                        {{else}}
                        <div class="stats-table">
-                               <a class="table-cell tiny background light grey"></a>
+                               <a class="table-cell tiny tw-bg-grey"></a>
                        </div>
                        {{end}}
                        {{ctx.Locale.TrN .Activity.ActivePRCount "repo.activity.active_prs_count_1" "repo.activity.active_prs_count_n" .Activity.ActivePRCount}}
@@ -40,8 +42,10 @@
                <div class="column">
                        {{if gt .Activity.ActiveIssueCount 0}}
                        <div class="stats-table">
-                               <a href="#closed-issues" class="table-cell tiny background red" style="width: {{.Activity.ClosedIssuePerc}}{{if ne .Activity.ClosedIssuePerc 0}}%{{end}}"></a>
-                               <a href="#new-issues" class="table-cell tiny background green"></a>
+                               {{if gt .Activity.ClosedIssuePerc 0}}
+                                       <a href="#closed-issues" class="table-cell tiny tw-bg-red" style="width: {{.Activity.ClosedIssuePerc}}%"></a>
+                               {{end}}
+                               <a href="#new-issues" class="table-cell tiny tw-bg-green"></a>
                        </div>
                        {{else}}
                        <div class="stats-table">
@@ -108,7 +112,7 @@
 {{end}}
 
 {{if gt .Activity.PublishedReleaseCount 0}}
-       <h4 class="divider divider-text tw-normal-case" id="published-releases">
+       <h4 class="divider divider-text" id="published-releases">
                {{svg "octicon-tag" 16 "tw-mr-2"}}
                {{ctx.Locale.Tr "repo.activity.title.releases_published_by"
                        (ctx.Locale.TrN .Activity.PublishedReleaseCount "repo.activity.title.releases_1" "repo.activity.title.releases_n" .Activity.PublishedReleaseCount)
@@ -130,7 +134,7 @@
 {{end}}
 
 {{if gt .Activity.MergedPRCount 0}}
-       <h4 class="divider divider-text tw-normal-case" id="merged-pull-requests">
+       <h4 class="divider divider-text" id="merged-pull-requests">
                {{svg "octicon-git-pull-request" 16 "tw-mr-2"}}
                {{ctx.Locale.Tr "repo.activity.title.prs_merged_by"
                        (ctx.Locale.TrN .Activity.MergedPRCount "repo.activity.title.prs_1" "repo.activity.title.prs_n" .Activity.MergedPRCount)
@@ -149,7 +153,7 @@
 {{end}}
 
 {{if gt .Activity.OpenedPRCount 0}}
-       <h4 class="divider divider-text tw-normal-case" id="proposed-pull-requests">
+       <h4 class="divider divider-text" id="proposed-pull-requests">
                {{svg "octicon-git-branch" 16 "tw-mr-2"}}
                {{ctx.Locale.Tr "repo.activity.title.prs_opened_by"
                        (ctx.Locale.TrN .Activity.OpenedPRCount "repo.activity.title.prs_1" "repo.activity.title.prs_n" .Activity.OpenedPRCount)
@@ -168,7 +172,7 @@
 {{end}}
 
 {{if gt .Activity.ClosedIssueCount 0}}
-       <h4 class="divider divider-text tw-normal-case" id="closed-issues">
+       <h4 class="divider divider-text" id="closed-issues">
                {{svg "octicon-issue-closed" 16 "tw-mr-2"}}
                {{ctx.Locale.Tr "repo.activity.title.issues_closed_from"
                        (ctx.Locale.TrN .Activity.ClosedIssueCount "repo.activity.title.issues_1" "repo.activity.title.issues_n" .Activity.ClosedIssueCount)
@@ -187,7 +191,7 @@
 {{end}}
 
 {{if gt .Activity.OpenedIssueCount 0}}
-       <h4 class="divider divider-text tw-normal-case" id="new-issues">
+       <h4 class="divider divider-text" id="new-issues">
                {{svg "octicon-issue-opened" 16 "tw-mr-2"}}
                {{ctx.Locale.Tr "repo.activity.title.issues_created_by"
                        (ctx.Locale.TrN .Activity.OpenedIssueCount "repo.activity.title.issues_1" "repo.activity.title.issues_n" .Activity.OpenedIssueCount)
@@ -206,7 +210,7 @@
 {{end}}
 
 {{if gt .Activity.UnresolvedIssueCount 0}}
-       <h4 class="divider divider-text tw-normal-case" id="unresolved-conversations" data-tooltip-content="{{ctx.Locale.Tr "repo.activity.unresolved_conv_desc"}}">
+       <h4 class="divider divider-text" id="unresolved-conversations" data-tooltip-content="{{ctx.Locale.Tr "repo.activity.unresolved_conv_desc"}}">
                {{svg "octicon-comment-discussion" 16 "tw-mr-2"}}
                {{ctx.Locale.TrN .Activity.UnresolvedIssueCount "repo.activity.title.unresolved_conv_1" "repo.activity.title.unresolved_conv_n" .Activity.UnresolvedIssueCount}}
        </h4>

diff --git a/web_src/css/dashboard.css b/web_src/css/dashboard.css
index d61e0c1cf290819d0d48aaa218e243d0ea337b34..0962215ac6ad83eaf4d5c207f788c56321adff43 100644 (file)
--- a/web_src/css/dashboard.css
+++ b/web_src/css/dashboard.css
@@ -7,7 +7,6 @@
 .dashboard.feeds .context.user.menu .ui.header,
 .dashboard.issues .context.user.menu .ui.header {
   font-size: 1rem;
-  text-transform: none;
 }
 
 .dashboard.feeds .filter.menu,

diff --git a/web_src/css/modules/divider.css b/web_src/css/modules/divider.css
index 48560bd3d90898a0411bbb048bc42c2b1dc1b8a3..acc8408f37600c068683b6a3e62258acd5cea3a5 100644 (file)
--- a/web_src/css/modules/divider.css
+++ b/web_src/css/modules/divider.css
@@ -2,12 +2,16 @@
   margin: 10px 0;
   height: 0;
   font-weight: var(--font-weight-medium);
-  text-transform: uppercase;
   color: var(--color-text);
   font-size: 1rem;
   width: 100%;
 }
 
+h4.divider {
+  margin-top: 1.25rem;
+  margin-bottom: 1.25rem;
+}
+
 .divider:not(.divider-text) {
   border-top: 1px solid var(--color-secondary);
 }

diff --git a/web_src/css/modules/header.css b/web_src/css/modules/header.css
index 05381e1185e8b686dbdd961904a980f206d6b20d..9cec5fcbe63227c9e2d90cb18e22ecffb3153e7e 100644 (file)
--- a/web_src/css/modules/header.css
+++ b/web_src/css/modules/header.css
@@ -9,7 +9,6 @@
   font-family: var(--fonts-regular);
   font-weight: var(--font-weight-medium);
   line-height: 1.28571429;
-  text-transform: none;
 }
 
 .ui.header:first-child {

diff --git a/web_src/css/modules/label.css b/web_src/css/modules/label.css
index 0512c5fddbb03db2a41be7d47cb2def82938ddaa..32e772ea5b0f532e61ecc1eeb29458b70a87ed9f 100644 (file)
--- a/web_src/css/modules/label.css
+++ b/web_src/css/modules/label.css
@@ -10,7 +10,6 @@
   background: var(--color-label-bg);
   color: var(--color-label-text);
   padding: 0.3em 0.5em;
-  text-transform: none;
   font-size: 0.85714286rem;
   font-weight: var(--font-weight-medium);
   border: 0 solid transparent;

diff --git a/web_src/css/repo.css b/web_src/css/repo.css
index c579745238de64e774a68d9403c38f5f8f9cd09c..edb3bc2e872c9060bee0bcdaea8f8b2ee783b4b5 100644 (file)
--- a/web_src/css/repo.css
+++ b/web_src/css/repo.css
@@ -2304,6 +2304,8 @@ td .commit-summary {
 .stats-table {
   display: table;
   width: 100%;
+  margin: 6px 0;
+  border-spacing: 2px;
 }
 
 .stats-table .table-cell {
@@ -2311,7 +2313,17 @@ td .commit-summary {
 }
 
 .stats-table .table-cell.tiny {
-  height: 0.5em;
+  height: 8px;
+}
+
+.stats-table .table-cell:first-child {
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+}
+
+.stats-table .table-cell:last-child {
+  border-top-right-radius: 4px;
+  border-bottom-right-radius: 4px;
 }
 
 .labels-list {