feat(pages): Standalone templates without Gitea navbar
Some checks failed
Build and Release / Create Release (push) Has been skipped
Build and Release / Integration Tests (PostgreSQL) (push) Successful in 1m40s
Build and Release / Unit Tests (push) Successful in 1m53s
Build and Release / Lint (push) Failing after 1m59s
Build and Release / Build Binaries (amd64, darwin) (push) Has been skipped
Build and Release / Build Binaries (amd64, linux) (push) Has been skipped
Build and Release / Build Binaries (amd64, windows) (push) Has been skipped
Build and Release / Build Binaries (arm64, darwin) (push) Has been skipped
Build and Release / Build Binaries (arm64, linux) (push) Has been skipped

- Add base_head.tmpl with standalone HTML/CSS (no Gitea navbar)
- Add base_footer.tmpl for clean HTML closing
- Update simple.tmpl: clean minimal design with hero and stats
- Update documentation.tmpl: dark header, sidebar navigation
- Update product.tmpl: gradient hero, features grid, marketing style
- Update portfolio.tmpl: dark theme, gallery grid with hover effects

Pages now render as standalone landing pages without Gitea UI.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
David H Friedel Jr 2026-01-11 00:50:58 +00:00
parent 69d7c72ba8
commit e57b4f1654
6 changed files with 560 additions and 35 deletions

View File

@ -0,0 +1,2 @@
</body>
</html>

View File

@ -0,0 +1,170 @@
<!DOCTYPE html>
<html lang="{{ctx.Locale.Lang}}" data-theme="{{ctx.CurrentWebTheme.InternalName}}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{if .Config.Hero.Title}}{{.Config.Hero.Title}}{{else}}{{.Repository.Name}}{{end}} - {{.Repository.Owner.Name}}</title>
<meta name="description" content="{{if .Config.Hero.Tagline}}{{.Config.Hero.Tagline}}{{else}}{{.Repository.Description}}{{end}}">
<link rel="icon" href="{{AssetUrlPrefix}}/img/favicon.svg" type="image/svg+xml">
{{template "base/head_style" .}}
<style>
/* Pages standalone styles - no Gitea navbar */
:root {
--pages-primary: {{if .Config.Branding.PrimaryColor}}{{.Config.Branding.PrimaryColor}}{{else}}#4183c4{{end}};
--pages-secondary: {{if .Config.Branding.SecondaryColor}}{{.Config.Branding.SecondaryColor}}{{else}}#6c757d{{end}};
}
* { box-sizing: border-box; }
body.pages-body {
margin: 0;
padding: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
background: #fff;
}
.pages-landing {
min-height: 100vh;
display: flex;
flex-direction: column;
}
.pages-main { flex: 1; }
.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 24px;
}
/* Header styles */
.pages-header {
background: #fff;
border-bottom: 1px solid #e1e4e8;
padding: 16px 0;
position: sticky;
top: 0;
z-index: 100;
}
.pages-nav {
display: flex;
align-items: center;
justify-content: space-between;
}
.pages-nav-brand {
text-decoration: none;
font-weight: 600;
font-size: 1.25rem;
color: #24292e;
}
.pages-nav-logo { height: 32px; }
.pages-nav-links {
display: flex;
align-items: center;
gap: 24px;
}
.pages-nav-link {
color: #586069;
text-decoration: none;
font-size: 0.875rem;
}
.pages-nav-link:hover { color: var(--pages-primary); }
/* Hero styles */
.pages-hero {
padding: 80px 0;
text-align: center;
background: linear-gradient(135deg, #f6f8fa 0%, #fff 100%);
}
.pages-logo {
max-height: 80px;
margin-bottom: 24px;
}
.pages-title {
font-size: 3rem;
font-weight: 700;
margin: 0 0 16px;
color: #24292e;
}
.pages-tagline {
font-size: 1.25rem;
color: #586069;
margin: 0 0 32px;
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
.pages-cta { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
/* Stats */
.pages-stats {
padding: 48px 0;
background: #f6f8fa;
}
.pages-stats-grid {
display: flex;
justify-content: center;
gap: 48px;
flex-wrap: wrap;
}
.pages-stat {
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
}
.pages-stat-value {
font-size: 2rem;
font-weight: 700;
color: #24292e;
}
.pages-stat-label {
color: #586069;
font-size: 0.875rem;
}
/* README */
.pages-readme {
padding: 64px 0;
}
.pages-readme .markup {
max-width: 800px;
margin: 0 auto;
}
/* Footer */
.pages-footer {
background: #24292e;
color: #fff;
padding: 48px 0 24px;
margin-top: auto;
}
.pages-footer-links {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
gap: 32px;
margin-bottom: 32px;
}
.pages-footer-title {
font-size: 0.875rem;
font-weight: 600;
margin: 0 0 16px;
color: #fff;
}
.pages-footer-list {
list-style: none;
padding: 0;
margin: 0;
}
.pages-footer-list li { margin-bottom: 8px; }
.pages-footer-list a {
color: #959da5;
text-decoration: none;
font-size: 0.875rem;
}
.pages-footer-list a:hover { color: #fff; }
.pages-footer-bottom {
text-align: center;
padding-top: 24px;
border-top: 1px solid #444d56;
}
.pages-footer-copyright, .pages-footer-powered {
color: #959da5;
font-size: 0.75rem;
margin: 4px 0;
}
.pages-footer-powered a { color: #79b8ff; }
</style>
</head>
<body class="pages-body">

View File

@ -1,5 +1,118 @@
{{template "base/head" .}}
<div class="page-content pages-landing pages-documentation">
{{template "pages/base_head" .}}
<style>
/* Documentation-specific styles */
.pages-documentation {
background: #fff;
}
.pages-documentation .pages-header {
background: #24292e;
border-bottom: none;
}
.pages-documentation .pages-nav-brand,
.pages-documentation .pages-nav-link {
color: #fff;
}
.pages-documentation .pages-nav-link:hover {
color: #79b8ff;
}
.pages-docs-layout {
display: flex;
min-height: calc(100vh - 65px);
}
.pages-docs-sidebar {
width: 280px;
background: #f6f8fa;
border-right: 1px solid #e1e4e8;
padding: 24px;
position: sticky;
top: 65px;
height: calc(100vh - 65px);
overflow-y: auto;
}
.pages-docs-search {
margin-bottom: 24px;
}
.pages-search-input {
width: 100%;
padding: 8px 12px;
border: 1px solid #e1e4e8;
border-radius: 6px;
font-size: 0.875rem;
}
.pages-docs-section {
margin-bottom: 24px;
}
.pages-docs-section-title {
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
color: #586069;
margin: 0 0 12px;
}
.pages-docs-list {
list-style: none;
padding: 0;
margin: 0;
}
.pages-docs-list li {
margin-bottom: 8px;
}
.pages-docs-list a {
color: #24292e;
text-decoration: none;
font-size: 0.875rem;
display: block;
padding: 4px 8px;
border-radius: 4px;
}
.pages-docs-list a:hover {
background: #e1e4e8;
color: var(--pages-primary);
}
.pages-docs-content {
flex: 1;
padding: 48px;
max-width: 900px;
}
.pages-docs-article {
line-height: 1.7;
}
.pages-docs-article h1,
.pages-docs-article h2,
.pages-docs-article h3 {
margin-top: 32px;
padding-bottom: 8px;
border-bottom: 1px solid #e1e4e8;
}
.pages-docs-article code {
background: #f6f8fa;
padding: 2px 6px;
border-radius: 4px;
font-size: 0.875em;
}
.pages-docs-article pre {
background: #24292e;
color: #e1e4e8;
padding: 16px;
border-radius: 6px;
overflow-x: auto;
}
.pages-docs-article pre code {
background: none;
padding: 0;
color: inherit;
}
@media (max-width: 768px) {
.pages-docs-sidebar {
display: none;
}
.pages-docs-content {
padding: 24px;
}
}
</style>
<div class="pages-landing pages-documentation">
{{template "pages/header" .}}
<div class="pages-docs-layout">
@ -21,6 +134,15 @@
</ul>
</div>
{{end}}
{{else}}
<div class="pages-docs-section">
<h4 class="pages-docs-section-title">Documentation</h4>
<ul class="pages-docs-list">
<li><a href="#">Getting Started</a></li>
<li><a href="#">Installation</a></li>
<li><a href="#">Configuration</a></li>
</ul>
</div>
{{end}}
</nav>
</aside>
@ -32,12 +154,11 @@
{{.ReadmeContent}}
</div>
{{else}}
<p>{{ctx.Locale.Tr "repo.no_desc"}}</p>
<h1>{{.Repository.Name}}</h1>
<p>{{if .Repository.Description}}{{.Repository.Description}}{{else}}Welcome to the documentation.{{end}}</p>
{{end}}
</article>
</main>
</div>
{{template "pages/footer" .}}
</div>
{{template "base/footer" .}}
{{template "pages/base_footer" .}}

View File

@ -1,5 +1,131 @@
{{template "base/head" .}}
<div class="page-content pages-landing pages-portfolio">
{{template "pages/base_head" .}}
<style>
/* Portfolio-specific styles - Gallery/Creative design */
.pages-portfolio {
background: #1a1a1a;
color: #fff;
}
.pages-portfolio .pages-header {
background: transparent;
border-bottom: 1px solid rgba(255,255,255,0.1);
}
.pages-portfolio .pages-nav-brand,
.pages-portfolio .pages-nav-link {
color: #fff;
}
.pages-portfolio .pages-nav-link:hover {
color: var(--pages-primary);
}
.pages-portfolio .pages-hero {
background: linear-gradient(180deg, #1a1a1a 0%, #2d2d2d 100%);
padding: 100px 0 60px;
}
.pages-portfolio .pages-title {
color: #fff;
font-size: 2.5rem;
letter-spacing: -0.02em;
}
.pages-portfolio .pages-tagline {
color: rgba(255,255,255,0.7);
}
.pages-portfolio .pages-logo {
border-radius: 50%;
border: 3px solid rgba(255,255,255,0.2);
}
.pages-gallery {
padding: 60px 0;
background: #1a1a1a;
}
.pages-gallery-grid {
display: grid;
grid-template-columns: repeat(var(--columns, 3), 1fr);
gap: 16px;
}
.pages-gallery-item {
position: relative;
overflow: hidden;
border-radius: 8px;
aspect-ratio: 1;
background: #2d2d2d;
}
.pages-gallery-item a {
display: block;
width: 100%;
height: 100%;
}
.pages-gallery-image {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.3s ease, filter 0.3s ease;
}
.pages-gallery-item:hover .pages-gallery-image {
transform: scale(1.05);
filter: brightness(0.8);
}
.pages-gallery-caption {
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding: 16px;
background: linear-gradient(transparent, rgba(0,0,0,0.8));
color: #fff;
font-size: 0.875rem;
font-weight: 500;
opacity: 0;
transform: translateY(10px);
transition: opacity 0.3s ease, transform 0.3s ease;
}
.pages-gallery-item:hover .pages-gallery-caption {
opacity: 1;
transform: translateY(0);
}
.pages-portfolio .pages-readme {
background: #2d2d2d;
padding: 60px 0;
}
.pages-portfolio .pages-readme .markup {
color: rgba(255,255,255,0.9);
}
.pages-portfolio .pages-readme .markup h1,
.pages-portfolio .pages-readme .markup h2,
.pages-portfolio .pages-readme .markup h3 {
color: #fff;
}
.pages-portfolio .pages-readme .markup a {
color: var(--pages-primary);
}
.pages-portfolio .pages-readme .markup code {
background: rgba(255,255,255,0.1);
color: #fff;
}
.pages-portfolio .pages-footer {
background: #111;
}
/* Empty gallery placeholder */
.pages-gallery-empty {
grid-column: 1 / -1;
text-align: center;
padding: 60px;
color: rgba(255,255,255,0.5);
}
.pages-gallery-empty-icon {
font-size: 3rem;
margin-bottom: 16px;
}
@media (max-width: 768px) {
.pages-gallery-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 480px) {
.pages-gallery-grid {
grid-template-columns: 1fr;
}
}
</style>
<div class="pages-landing pages-portfolio">
{{template "pages/header" .}}
<main class="pages-main">
@ -20,7 +146,7 @@
</a>
{{end}}
{{if .Config.Hero.CTASecondary.Text}}
<a href="{{.Config.Hero.CTASecondary.Link}}" class="ui button">
<a href="{{.Config.Hero.CTASecondary.Link}}" class="ui button basic inverted">
{{.Config.Hero.CTASecondary.Text}}
</a>
{{end}}
@ -29,28 +155,31 @@
</section>
<!-- Gallery Section -->
{{if .Config.Gallery.Items}}
<section class="pages-gallery">
<div class="container">
<div class="pages-gallery-grid" style="--columns: {{if .Config.Gallery.Columns}}{{.Config.Gallery.Columns}}{{else}}4{{end}}">
{{if .Config.Gallery.Items}}
<div class="pages-gallery-grid" style="--columns: {{if .Config.Gallery.Columns}}{{.Config.Gallery.Columns}}{{else}}3{{end}}">
{{range .Config.Gallery.Items}}
<div class="pages-gallery-item">
{{if .Link}}
<a href="{{.Link}}">
{{end}}
{{if .Link}}<a href="{{.Link}}">{{end}}
<img src="{{.Image}}" alt="{{.Title}}" class="pages-gallery-image">
{{if .Title}}
<div class="pages-gallery-caption">{{.Title}}</div>
{{end}}
{{if .Link}}
</a>
{{end}}
{{if .Link}}</a>{{end}}
</div>
{{end}}
</div>
{{else}}
<div class="pages-gallery-grid" style="--columns: 3">
<div class="pages-gallery-empty">
{{svg "octicon-image" 48}}
<p>Add gallery items in your landing.yaml configuration</p>
</div>
</div>
{{end}}
</div>
</section>
{{end}}
<!-- README Section -->
{{if .ReadmeContent}}
@ -66,4 +195,4 @@
{{template "pages/footer" .}}
</div>
{{template "base/footer" .}}
{{template "pages/base_footer" .}}

View File

@ -1,11 +1,121 @@
{{template "base/head" .}}
<div class="page-content pages-landing pages-product">
{{template "pages/base_head" .}}
<style>
/* Product-specific styles - Bold marketing design */
.pages-product {
background: #fff;
}
.pages-product .pages-header {
background: transparent;
border-bottom: none;
position: absolute;
width: 100%;
z-index: 100;
}
.pages-product .pages-nav-brand,
.pages-product .pages-nav-link {
color: #fff;
text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}
.pages-hero-product {
background: linear-gradient(135deg, var(--pages-primary) 0%, #1a365d 100%);
color: #fff;
padding: 120px 0 80px;
position: relative;
overflow: hidden;
}
.pages-hero-product::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.pages-hero-product .container {
position: relative;
z-index: 1;
}
.pages-product .pages-title {
color: #fff;
font-size: 3.5rem;
margin-bottom: 24px;
}
.pages-product .pages-tagline {
color: rgba(255,255,255,0.9);
font-size: 1.5rem;
max-width: 700px;
}
.pages-product .pages-logo {
max-height: 100px;
filter: brightness(0) invert(1);
}
.pages-features {
padding: 80px 0;
background: #fff;
}
.pages-features-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 48px;
}
.pages-feature {
text-align: center;
padding: 32px;
}
.pages-feature-icon {
width: 64px;
height: 64px;
margin: 0 auto 24px;
background: linear-gradient(135deg, var(--pages-primary) 0%, #1a365d 100%);
border-radius: 16px;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
}
.pages-feature-icon img {
max-width: 32px;
max-height: 32px;
}
.pages-feature-title {
font-size: 1.25rem;
font-weight: 600;
margin: 0 0 12px;
color: #24292e;
}
.pages-feature-description {
color: #586069;
line-height: 1.6;
margin: 0;
}
.pages-product .pages-stats {
background: linear-gradient(135deg, #f6f8fa 0%, #e1e4e8 100%);
padding: 64px 0;
}
.pages-cta-bottom {
margin-top: 32px;
text-align: center;
}
.pages-product .pages-readme {
background: #fff;
padding: 80px 0;
}
@media (max-width: 768px) {
.pages-product .pages-title {
font-size: 2.5rem;
}
.pages-hero-product {
padding: 100px 0 60px;
}
}
</style>
<div class="pages-landing pages-product">
{{template "pages/header" .}}
<main class="pages-main">
<!-- Hero Section -->
<section class="pages-hero pages-hero-product" {{if .Config.Hero.Background}}style="background-image: url('{{.Config.Hero.Background}}')"{{end}}>
<div class="pages-hero-overlay"></div>
<div class="container">
{{if .Config.Branding.Logo}}
<img src="{{.Config.Branding.Logo}}" alt="{{.Repository.Name}}" class="pages-logo">
@ -16,12 +126,12 @@
{{end}}
<div class="pages-cta">
{{if .Config.Hero.CTAPrimary.Text}}
<a href="{{.Config.Hero.CTAPrimary.Link}}" class="ui large primary button">
<a href="{{.Config.Hero.CTAPrimary.Link}}" class="ui large primary button" style="background: #fff; color: var(--pages-primary);">
{{.Config.Hero.CTAPrimary.Text}}
</a>
{{end}}
{{if .Config.Hero.CTASecondary.Text}}
<a href="{{.Config.Hero.CTASecondary.Link}}" class="ui large button {{if eq .Config.Hero.CTASecondary.Style "outline"}}basic inverted{{end}}">
<a href="{{.Config.Hero.CTASecondary.Link}}" class="ui large button basic inverted">
{{.Config.Hero.CTASecondary.Text}}
</a>
{{end}}
@ -38,11 +148,7 @@
<div class="pages-feature">
{{if .Icon}}
<div class="pages-feature-icon">
{{if StringUtils.HasPrefix .Icon "./"}}
<img src="{{.Icon}}" alt="{{.Title}}">
{{else}}
{{svg (printf "octicon-%s" .Icon) 32}}
{{end}}
</div>
{{end}}
<h3 class="pages-feature-title">{{.Title}}</h3>
@ -89,4 +195,4 @@
{{template "pages/footer" .}}
</div>
{{template "base/footer" .}}
{{template "pages/base_footer" .}}

View File

@ -1,5 +1,5 @@
{{template "base/head" .}}
<div class="page-content pages-landing pages-simple">
{{template "pages/base_head" .}}
<div class="pages-landing pages-simple">
{{template "pages/header" .}}
<main class="pages-main">
@ -43,18 +43,15 @@
<div class="container">
<div class="pages-stats-grid">
<div class="pages-stat">
<span class="pages-stat-icon">{{svg "octicon-star"}}</span>
<span class="pages-stat-value">{{.NumStars}}</span>
<span class="pages-stat-label">{{ctx.Locale.Tr "repo.stars"}}</span>
</div>
<div class="pages-stat">
<span class="pages-stat-icon">{{svg "octicon-repo-forked"}}</span>
<span class="pages-stat-value">{{.NumForks}}</span>
<span class="pages-stat-label">{{ctx.Locale.Tr "repo.forks"}}</span>
</div>
{{if .Repository.PrimaryLanguage}}
<div class="pages-stat">
<span class="pages-stat-icon language-color" style="background-color: {{.Repository.PrimaryLanguage.Color}}"></span>
<span class="pages-stat-value">{{.Repository.PrimaryLanguage.Language}}</span>
<span class="pages-stat-label">{{ctx.Locale.Tr "repo.language"}}</span>
</div>
@ -66,4 +63,4 @@
{{template "pages/footer" .}}
</div>
{{template "base/footer" .}}
{{template "pages/base_footer" .}}