From be07de2f57ad325d7108a218226c0926042925de Mon Sep 17 00:00:00 2001 From: "russell@unturf.com" Date: Wed, 4 Mar 2026 18:48:47 -0500 Subject: [PATCH] Modernize repo summary page with GitHub-style layout Two-column grid: main content + About sidebar. Extract clone_url_bar component from old summary_detail. Add repo stats bar (branches, tags, commits, forks). Move repo metadata (owner, description, dates) into visible About sidebar instead of hidden behind Show More toggle. Auto-load language stats when enabled. --- rhodecode/public/css/styleguide.css | 205 +++++++++++++++++++ rhodecode/templates/summary/components.mako | 36 ++++ rhodecode/templates/summary/summary.mako | 209 ++++++++++++-------- 3 files changed, 372 insertions(+), 78 deletions(-) diff --git a/rhodecode/public/css/styleguide.css b/rhodecode/public/css/styleguide.css index c0345a39..5c66d2b8 100644 --- a/rhodecode/public/css/styleguide.css +++ b/rhodecode/public/css/styleguide.css @@ -3358,3 +3358,208 @@ i[class*=" icon-"] { grid-column: 1 / -1; } } + +/* ================================================================ + REPO SUMMARY PAGE + ================================================================ */ + +.repo-summary-grid { + display: grid; + grid-template-columns: 1fr 280px; + gap: var(--space-5); + align-items: start; +} + +@media (max-width: 960px) { + .repo-summary-grid { + grid-template-columns: 1fr; + } +} + +/* Clone URL bar */ +.clone-url-bar { + display: grid; + grid-template-columns: auto 1fr; + gap: var(--space-2); + align-items: center; + padding: var(--space-3); + background: var(--surface); + border: var(--border-width) solid var(--border); + border-radius: var(--radius); + margin-bottom: var(--space-4); +} + +.clone-url-select { + padding: var(--space-1) var(--space-2); + border: var(--border-width) solid var(--border); + border-radius: var(--radius); + background: var(--surface-alt); + font-size: 0.8125rem; + font-family: var(--font-sans); +} + +.clone-url-input-wrap { + display: grid; + grid-template-columns: 1fr auto; + align-items: center; + gap: var(--space-2); +} + +.clone-url-input-wrap .clone_url_input { + width: 100%; + padding: var(--space-1) var(--space-2); + font-family: var(--font-mono); + font-size: 0.8125rem; + border: var(--border-width) solid var(--border); + border-radius: var(--radius); + background: var(--surface-alt); + color: var(--text); +} + +.clone-url-input-wrap .clipboard-action { + cursor: pointer; + color: var(--text-muted); + font-size: 1rem; +} + +.clone-url-input-wrap .clipboard-action:hover { + color: var(--accent); +} + +/* Repo stats bar (branches, tags, commits, forks) */ +.repo-stats-bar { + display: grid; + grid-auto-flow: column; + grid-auto-columns: auto; + gap: var(--space-3); + justify-content: start; + padding: var(--space-3) 0; + margin-bottom: var(--space-4); + border-bottom: var(--border-width) solid var(--border); + font-size: 0.875rem; +} + +.summary-tag { + color: var(--text-muted); +} + +.summary-tag a { + color: var(--text-muted); + text-decoration: none; +} + +.summary-tag a:hover { + color: var(--accent); +} + +.summary-tag i { + margin-right: var(--space-1); +} + +/* Repo commits section */ +.repo-commits-section { + margin-bottom: var(--space-4); +} + +/* README container */ +.readme-container { + border: var(--border-width) solid var(--border); + border-radius: var(--radius); + overflow: hidden; +} + +.readme-title { + padding: var(--space-3); + background: var(--surface-alt); + border-bottom: var(--border-width) solid var(--border); + font-size: 0.875rem; + font-weight: 600; +} + +.readme-title i { + margin-right: var(--space-1); + color: var(--text-muted); +} + +.readme-title a { + color: var(--text); + text-decoration: none; +} + +.readme-title a:hover { + color: var(--accent); +} + +.readme-container .readme_box { + padding: var(--space-4); +} + +/* Repo summary sidebar (About, Downloads, Languages) */ +.repo-summary-sidebar { + position: sticky; + top: var(--space-4); +} + +.repo-about { + margin-bottom: var(--space-5); +} + +.repo-about .sidebar-heading { + font-size: 0.875rem; + font-weight: 700; + color: var(--text); + margin-bottom: var(--space-2); + padding-bottom: var(--space-2); + border-bottom: var(--border-width) solid var(--border); +} + +.repo-description { + font-size: 0.875rem; + color: var(--text-muted); + margin-bottom: var(--space-3); + line-height: 1.5; +} + +.repo-meta-list { + display: grid; + gap: var(--space-2); +} + +.repo-meta-item { + display: grid; + grid-template-columns: 20px 1fr; + gap: var(--space-2); + align-items: center; + font-size: 0.8125rem; + color: var(--text-muted); +} + +.repo-meta-item i { + color: var(--text-muted); + font-size: 0.875rem; + justify-self: center; +} + +.repo-meta-item a { + color: var(--accent); + text-decoration: none; +} + +.repo-meta-item a:hover { + text-decoration: underline; +} + +.repo-downloads { + display: grid; + gap: var(--space-2); +} + +.repo-downloads .archive_link { + display: grid; + grid-template-columns: auto 1fr; + gap: var(--space-2); + align-items: center; + padding: var(--space-2) var(--space-3); + font-size: 0.8125rem; + text-decoration: none; +} diff --git a/rhodecode/templates/summary/components.mako b/rhodecode/templates/summary/components.mako index 0ea12d3c..bb953d02 100644 --- a/rhodecode/templates/summary/components.mako +++ b/rhodecode/templates/summary/components.mako @@ -1,5 +1,41 @@ <%namespace name="base" file="/base/base.mako"/> +<%def name="clone_url_bar()"> + <% + maybe_disabled = '' + if h.is_svn_without_proxy(c.rhodecode_db_repo): + maybe_disabled = 'disabled' + %> +
+ + + + + + + + + + + + % if maybe_disabled: +

${_('SVN Protocol is disabled. To enable it, see the')} ${_('documentation here')}.

+ % endif +
+ + <%def name="refs_counters(branches, closed_branches, tags, bookmarks)"> diff --git a/rhodecode/templates/summary/summary.mako b/rhodecode/templates/summary/summary.mako index bb4a8afc..0343fb43 100644 --- a/rhodecode/templates/summary/summary.mako +++ b/rhodecode/templates/summary/summary.mako @@ -1,6 +1,7 @@ <%inherit file="/summary/summary_base.mako"/> <%namespace name="components" file="/summary/components.mako"/> +<%namespace name="base" file="/base/base.mako"/> <%def name="menu_bar_subnav()"> @@ -9,47 +10,140 @@ <%def name="main()"> -
- ${components.summary_detail(breadcrumbs_links=self.breadcrumbs_links(), show_downloads=True)} -
+
+
-
- %if not c.repo_commits: -
-
-

${_('Quick start')}

+ ## Clone URL bar + ${components.clone_url_bar()} + + ## Branch/tag stats bar +
+ + ## Recent commits +
+ %if c.repo_commits: +
+
+ <%include file='summary_commits.mako'/> +
-
-
- %endif -
-
+ %else: <%include file='summary_commits.mako'/> + %endif +
+ + ## README + %if c.readme_data: +
+
+ +
+
+ ${c.readme_data|n} +
-
- -%if c.readme_data: -
-
- -
- + %endif +
-
-
- ${c.readme_data|n} -
+ +
+ ## About section +
+ + + % if c.rhodecode_db_repo.description: +

+ <%namespace name="dt" file="/data_table/_dt_elements.mako"/> + ${dt.repo_desc(c.rhodecode_db_repo.description_safe, c.visual.stylify_metatags)} +

+ % endif + +
+
+ + ${base.gravatar_with_user(c.rhodecode_db_repo.user.email, 16, tooltip=True)} +
+ + % if c.rhodecode_db_repo.landing_ref_name: +
+ + ${c.rhodecode_db_repo.landing_ref_name} +
+ % endif + +
+ + ${h.format_date(c.rhodecode_db_repo.created_on)} +
+ + % if c.rhodecode_db_repo.fork: + + % endif +
+
+ + ## Downloads section + % if c.enable_downloads and c.rhodecode_repo and len(c.rhodecode_repo.commit_ids) > 0: +
+ +
+ % for a_type, content_type, extension in h.ARCHIVE_SPECS: + + ${c.rhodecode_db_repo.landing_ref_name}${extension} + + % endfor +
+
+ % endif + + ## Statistics + % if c.show_stats: +
+ +
+
+
+ % endif
+
-
-%endif