Skip to content

Commit 416203d

Browse files
fnetXjtbx
authored andcommitted
CB/ui: Codeberg Custom footer
- Dark theme footer has different colours (optional) - Update footer to work nice with any theme - Add social links to footer CB/tmp: Change "What is that?" to "Who are we" in the footer (!49) Reviewed-on: https://codeberg.org/Codeberg/gitea/pulls/49 Co-authored-by: Jeremy <[email protected]> Co-committed-by: Jeremy <[email protected]>
1 parent 363ea9d commit 416203d

File tree

4 files changed

+106
-57
lines changed

4 files changed

+106
-57
lines changed

templates/base/footer_content.tmpl

Lines changed: 60 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,66 @@
1-
<footer role="group" aria-label="{{.locale.Tr "aria.footer"}}">
2-
<div class="ui container">
3-
<div class="ui left" role="contentinfo" aria-label="{{.locale.Tr "aria.footer.software"}}">
4-
<a target="_blank" rel="noopener noreferrer" href="https://forgejo.org">{{.locale.Tr "powered_by" "Forgejo"}}</a>
5-
{{if (or .ShowFooterVersion .PageIsAdmin)}}
6-
{{.locale.Tr "version"}}:
7-
{{if .IsAdmin}}
8-
<a href="{{AppSubUrl}}/admin/config">{{AppVer}}</a>
9-
{{else}}
10-
{{AppVer}}
1+
<footer>
2+
<div class="grid" aria-label="{{.locale.Tr "aria.footer.links"}}">
3+
<div class="branding not-mobile">
4+
<img src="https://design.codeberg.org/logo-kit/icon_inverted.svg">
5+
</div>
6+
<div>
7+
<b>Codeberg</b>
8+
<ul>
9+
<li><a href="https://docs.codeberg.org" target="_blank">Documentation</a></li>
10+
<li><a href="/Codeberg/Community/issues">Community Issues</a></li>
11+
{{if .IsSigned}}
12+
<li><a href="/about">Landing Page</a></li>
13+
{{end}}
14+
{{if .EnableSwagger}}
15+
<li><a href="{{AppSubUrl}}/api/swagger">API</a></li>
1116
{{end}}
12-
{{end}}
13-
{{if and .TemplateLoadTimes ShowFooterTemplateLoadTime}}
14-
{{.locale.Tr "page"}}: <strong>{{LoadTimes .PageStartTime}}</strong>
15-
{{.locale.Tr "template"}}{{if .TemplateName}} {{.TemplateName}}{{end}}: <strong>{{call .TemplateLoadTimes}}</strong>
16-
{{end}}
17+
<li><a href="https://docs.{{AppDomain}}/contact/#abuse" target="_blank">Report Abuse</a>
18+
</ul>
19+
</div>
20+
<div>
21+
<b>Codeberg e.V.</b>
22+
<ul>
23+
<li><a href="https://docs.codeberg.org/getting-started/what-is-codeberg/#what-is-codeberg-e.v.%3F" target="_blank">Who are we?</a></li>
24+
<li><a href="/codeberg/org/src/en/bylaws.md" target="_blank">Bylaws/Satzung</a></li>
25+
<li><a href="https://docs.codeberg.org/improving-codeberg/#donate-to-codeberg" target="_blank">Donate</a></li>
26+
<li><a href="https://join.codeberg.org" target="_blank">Join / Support</a></li>
27+
<li><a href="https://docs.codeberg.org/contact/" target="_blank">Contact</a></li>
28+
</ul>
29+
</div>
30+
<div>
31+
<b>Service</b>
32+
<ul>
33+
<li><a href="https://codeberg.page" target="_blank">Codeberg Pages</a></li>
34+
<li><a href="https://translate.codeberg.org" target="_blank">Weblate Translations</a></li>
35+
<li><a href="/Codeberg-CI/request-access/issues" target="_blank">Woodpecker CI</a></li>
36+
<li><a href="https://status.codeberg.eu" target="_blank">Status Page</a></li>
37+
</ul>
1738
</div>
18-
<div class="ui right links" role="group" aria-label="{{.locale.Tr "aria.footer.links"}}">
19-
{{if .ShowFooterBranding}}
20-
<a target="_blank" rel="noopener noreferrer" href="https://codeberg.org/forgejo/forgejo">{{svg "octicon-git-branch"}}<span class="sr-only">Codeberg</span></a>
21-
{{end}}
22-
<div class="ui language bottom floating slide up dropdown link item">
23-
{{svg "octicon-globe"}}
24-
<div class="text">{{.locale.LangName}}</div>
25-
<div class="menu language-menu">
26-
{{range .AllLangs}}
27-
<a lang="{{.Lang}}" data-url="{{AppSubUrl}}/?lang={{.Lang}}" class="item {{if eq $.locale.Lang .Lang}}active selected{{end}}">{{.Name}}</a>
28-
{{end}}
29-
</div>
39+
<div>
40+
<b>Legal</b>
41+
<ul>
42+
<li><a href="/codeberg/org/src/Imprint.md" target="_blank">Imprint/Impressum</a></li>
43+
<li><a href="/codeberg/org/src/PrivacyPolicy.md" target="_blank">Privacy Policy</a></li>
44+
<li><a href="{{AssetUrlPrefix}}/js/licenses.txt">{{.locale.Tr "licenses"}}</a></li>
45+
<li><a href="/codeberg/org/src/TermsOfUse.md">Terms of Use</a></li>
46+
</ul>
47+
</div>
48+
</div>
49+
<center>
50+
<a href="https://blog.codeberg.org" target="_blank">Blog</a> |
51+
<a href="https://social.anoxinon.de/@Codeberg" target="_blank" rel="noopener noreferrer">Mastodon</a> |
52+
<a href="https://matrix.to/#/#codeberg-space:matrix.org" target="_blank" rel="noopener noreferrer">Matrix Space</a> |
53+
<a href="https://twitter.com/codeberg_org" target="_blank" rel="noopener noreferrer">Twitter</a>
54+
</center>
55+
<div class="ui right">
56+
<div class="ui language bottom floating slide up dropdown link item button">
57+
{{svg "octicon-globe"}}
58+
<div class="text">{{.locale.LangName}}</div>
59+
<div class="menu language-menu">
60+
{{range .AllLangs}}
61+
<a lang="{{.Lang}}" data-url="{{AppSubUrl}}/?lang={{.Lang}}" class="item {{if eq $.locale.Lang .Lang}}active selected{{end}}">{{.Name}}</a>
62+
{{end}}
3063
</div>
31-
<a href="{{AssetUrlPrefix}}/js/licenses.txt">{{.locale.Tr "licenses"}}</a>
32-
{{if .EnableSwagger}}<a href="{{AppSubUrl}}/api/swagger">API</a>{{end}}
33-
{{template "custom/extra_links_footer" .}}
3464
</div>
3565
</div>
3666
</footer>

web_src/less/_base.less

Lines changed: 31 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -128,7 +128,8 @@
128128
--color-box-header: #f7f7f7;
129129
--color-box-body: #ffffff;
130130
--color-box-body-highlight: #f8f8f8;
131-
--color-footer: #ffffff;
131+
--color-footer: #B5DDFF;
132+
--color-footer-text: var(--color-text-light);
132133
--color-timeline: #ececec;
133134
--color-input-text: #212121;
134135
--color-input-background: #ffffff;
@@ -1685,25 +1686,36 @@ a.ui.card:hover,
16851686

16861687
footer {
16871688
background-color: var(--color-footer);
1688-
border-top: 1px solid var(--color-secondary);
16891689
width: 100%;
1690-
flex-basis: 40px;
1691-
color: var(--color-text-light);
1692-
1693-
.container {
1694-
width: 100vw !important;
1695-
padding: 0 .5rem;
1696-
max-width: calc(100vw - 1rem) !important;
1690+
color: var(--color-footer-text);
1691+
font-weight: 400;
1692+
padding: 10px;
1693+
1694+
.grid {
1695+
display: grid;
1696+
grid-gap: 40px 20px;
1697+
padding: 30px;
1698+
@media @mediaMdAndUp {
1699+
grid-template-columns: 2fr repeat(4, 3fr);
1700+
}
1701+
a, ul {
1702+
list-style-type: none;
1703+
padding: 0;
1704+
margin: 0;
1705+
margin-top: 15px;
1706+
line-height: 2em;
1707+
}
1708+
}
16971709

1698-
.links > * {
1699-
border-left: 1px solid var(--color-secondary-dark-1);
1700-
padding-left: 8px;
1701-
margin-left: 5px;
1710+
.branding img {
1711+
width: 100px;
1712+
}
1713+
* a {
1714+
color: inherit;
1715+
}
17021716

1703-
&:first-child {
1704-
border-left: 0;
1705-
}
1706-
}
1717+
* b {
1718+
font-size: 2em;
17071719
}
17081720

17091721
.ui.language {
@@ -1713,17 +1725,9 @@ footer {
17131725
margin-bottom: 7px;
17141726
}
17151727

1716-
.svg {
1728+
.svg, .text {
17171729
margin-right: .15em;
1718-
vertical-align: top;
1719-
margin-top: calc(2em - 16px);
1720-
}
1721-
}
1722-
1723-
.ui {
1724-
&.left,
1725-
&.right {
1726-
line-height: 40px;
1730+
vertical-align: middle;
17271731
}
17281732
}
17291733
}

web_src/less/themes/codeberg/base-brand.less

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,12 @@
1+
:root {
2+
--color-footer: #144B49;
3+
--color-footer-text: #ffffff;
4+
}
5+
6+
footer .button:hover {
7+
--color-hover: #73CCC6;
8+
}
9+
110
.following.bar, #navbar {
211
/* Change navbar color scheme to match Codeberg's brand */
312
background-color: var(--color-primary);
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
11
/* Basic styles for Codeberg */
22
@import "codeberg/base-brand.less";
33

4+
footer, .codeberg {
5+
--color-text-light-2: #73CCC6;
6+
* a:hover {
7+
color: var(--color-text-light-2) !important;
8+
}
9+
}

0 commit comments

Comments
 (0)