ui: improve error pages (#7274)

* add testing
* make each page accessible via `/devtest/error`
* allow translating the `Page not found` part of the title
* code: improve consistency, remove unused
* devtest: put index page in a container to fix alignment
* 500: make navbar more like the real one, remove fake menu button
* deadcode: remove unused `func NotFound`: it was added in bdd32f152d and the only usage was removed in 1bfb0a24d8

Preview:
https://codeberg.org/attachments/1b75afb3-e898-410f-be02-f036a5400143

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/7274
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Reviewed-by: Beowulf <beowulf@beocode.eu>
This commit is contained in:
0ko 2025-03-28 19:50:43 +00:00
parent 683eb5bf78
commit 51ff4970ec
11 changed files with 106 additions and 32 deletions

View file

@ -1,10 +1,21 @@
{{template "base/head" .}}
<ul>
{{range .SubNames}}
<li><a href="{{AppSubUrl}}/devtest/{{.}}">{{.}}</a></li>
{{end}}
</ul>
<div role="main" class="page-content ui container">
<ul>
{{range .SubNames}}
<li><a href="{{AppSubUrl}}/devtest/{{.}}">{{.}}</a></li>
{{end}}
</ul>
<article>
<h2>Error pages</h2>
<ul>
<li><a href="./error/404">Not found</a></li>
<li><a href="./error/413">Quota exhaustion</a></li>
<li><a href="./error/500">Server error</a></li>
</ul>
</article>
</div>
<style>
ul {

View file

@ -16,19 +16,14 @@
</head>
<body>
<div class="full height">
<nav class="ui secondary menu">
<div class="ui container tw-flex">
<div class="item tw-flex-1">
<a href="{{AppSubUrl}}/" aria-label="{{ctx.Locale.Tr "home"}}">
<img width="30" height="30" src="{{AssetUrlPrefix}}/img/logo.svg" alt="{{ctx.Locale.Tr "logo"}}" aria-hidden="true">
</a>
</div>
<div class="item">
<button class="ui icon button disabled">{{svg "octicon-three-bars"}}</button>{{/* a fake button to make the UI looks better*/}}
</div>
<nav id="navbar" aria-label="{{ctx.Locale.Tr "aria.navbar"}}">
<div class="navbar-left ui secondary menu">
<a class="item" id="navbar-logo" href="{{AppSubUrl}}/" aria-label="{{ctx.Locale.Tr "home"}}">
<img width="30" height="30" src="{{AssetUrlPrefix}}/img/logo.svg" alt="{{ctx.Locale.Tr "logo"}}" aria-hidden="true">
</a>
</div>
</nav>
<div class="divider tw-my-0"></div>
<div role="main" class="page-content status-page-500">
<div class="ui container" >
<style> .ui.message.flash-message { text-align: left; } </style>