mirror of
https://codeberg.org/forgejo/forgejo.git
synced 2024-09-06 03:45:20 +02:00
Backport #25111 by @silverwind Improvements to the notification icon and `<nav>`: - Add a opaque color for header hover and use it, allowing the border to be the right color on hover (sadly, not otherwise possible with CSS, not even `color-mix`). - Increase font size by 1px - Use flexbox for slightly better text centering - Reduce padding of user and add repo button, add margin on right side of user menu - Remove the `following bar` wrapper on navbar <img width="176" alt="Screenshot 2023-06-07 at 00 07 08" src="https://github.com/go-gitea/gitea/assets/115237/23cdc3d6-7f63-49df-bec3-f2e75e32a304"> <img width="63" alt="Screenshot 2023-06-07 at 00 07 14" src="https://github.com/go-gitea/gitea/assets/115237/fae602c2-4467-4d50-b1ec-56317843f9a2"> <img width="84" alt="Screenshot 2023-06-07 at 00 07 36" src="https://github.com/go-gitea/gitea/assets/115237/c48141b8-0b3c-48cc-846a-3a272524dbdb"> <img width="329" alt="Screenshot 2023-06-07 at 00 25 10" src="https://github.com/go-gitea/gitea/assets/115237/cda612f1-426e-466b-a351-fc992bfd18fd"> <img width="186" alt="Screenshot 2023-06-07 at 00 35 45" src="https://github.com/go-gitea/gitea/assets/115237/04484a2e-9bbf-493c-aa26-8e936da008fa"> <img width="797" alt="Screenshot 2023-06-07 at 16 57 40" src="https://github.com/go-gitea/gitea/assets/115237/e7ccb672-5807-4cb6-b306-b18ae0c7e321"> --------- Co-authored-by: silverwind <me@silverwind.io>
60 lines
2.8 KiB
Handlebars
60 lines
2.8 KiB
Handlebars
{{/* This page should only depend the minimal template functions/variables, to avoid triggering new panics.
|
|
* base template functions: AppName, AssetUrlPrefix, AssetVersion, AppSubUrl, DefaultTheme, Str2html
|
|
* locale
|
|
* ErrorMsg
|
|
* SignedUser (optional)
|
|
*/}}
|
|
<!DOCTYPE html>
|
|
<html lang="{{.locale.Lang}}" class="theme-{{if .SignedUser.Theme}}{{.SignedUser.Theme}}{{else}}{{DefaultTheme}}{{end}}">
|
|
<head>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Internal Server Error - {{AppName}}</title>
|
|
<link rel="icon" href="{{AssetUrlPrefix}}/img/favicon.svg" type="image/svg+xml">
|
|
<link rel="alternate icon" href="{{AssetUrlPrefix}}/img/favicon.png" type="image/png">
|
|
{{template "base/head_style" .}}
|
|
</head>
|
|
<body>
|
|
<div class="full height">
|
|
<nav class="ui container secondary stackable main menu" id="navbar">
|
|
<div class="ui container gt-df">
|
|
<div class="item brand gt-f1">
|
|
<a href="{{AppSubUrl}}/" aria-label="{{.locale.Tr "home"}}">
|
|
<img width="30" height="30" src="{{AssetUrlPrefix}}/img/logo.svg" alt="{{.locale.Tr "logo"}}" aria-hidden="true">
|
|
</a>
|
|
</div>
|
|
<button class="item ui icon button">{{svg "octicon-three-bars"}}</button>{{/* a fake button to make the UI looks better*/}}
|
|
</div>
|
|
</nav>
|
|
<div role="main" class="page-content status-page-500">
|
|
<p class="gt-mt-5 center"><img src="{{AssetUrlPrefix}}/img/500.png" alt="Internal Server Error"></p>
|
|
<div class="ui divider"></div>
|
|
<div class="ui container gt-my-5">
|
|
{{if .ErrorMsg}}
|
|
<p>{{.locale.Tr "error.occurred"}}:</p>
|
|
<pre class="gt-whitespace-pre-wrap gt-break-all">{{.ErrorMsg}}</pre>
|
|
{{end}}
|
|
<div class="center gt-mt-5">
|
|
{{if or .SignedUser.IsAdmin .ShowFooterVersion}}<p>{{.locale.Tr "admin.config.app_ver"}}: {{AppVer}}</p>{{end}}
|
|
{{if .SignedUser.IsAdmin}}<p>{{.locale.Tr "error.report_message" | Str2html}}</p>{{end}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{{/* When a sub-template triggers an 500 error, its parent template has been partially rendered, then the 500 page
|
|
will be rendered after that partially rendered page, the HTML/JS are totally broken. Use this inline script to try to move it to main viewport.
|
|
And this page shouldn't include any other JS file, avoid duplicate JS execution (still due to the partial rendering).*/}}
|
|
<script type="module">
|
|
const embedded = document.querySelector('.page-content .page-content.status-page-500');
|
|
if (embedded) {
|
|
// move the 500 error page content to main view
|
|
const embeddedParent = embedded.parentNode;
|
|
let main = document.querySelector('.page-content');
|
|
main = main ?? document.querySelector('body');
|
|
main.prepend(document.createElement('hr'));
|
|
main.prepend(embedded);
|
|
embeddedParent.remove(); // remove the unrelated 500-page elements (eg: the duplicate nav bar)
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|