UX: Improve Error 404 page #840

Signed-off-by: Michael Mayer <michael@photoprism.app>
This commit is contained in:
Michael Mayer 2022-10-20 16:40:08 +02:00
parent a579620a2e
commit ef52c4f1e5
3 changed files with 32 additions and 18 deletions

View file

@ -4,7 +4,6 @@
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta http-equiv="refresh" content="6;url={{ .config.BaseUri }}/" />
<title>{{ .error }} {{if and .config.SiteCaption .config.Sponsor }}{{ .config.SiteCaption }}{{else}}{{ .config.Name }}{{end}}</title>
@ -12,10 +11,10 @@
<link rel="stylesheet" href="{{ .config.CssUri }}">
</head>
<body>
<div id="photoprism" class="container">
<div class="fullscreen animate-rainbow">
<div class="logo-large">
<body class="{{ .config.Flags }} nojs">
<div id="photoprism" class="container server-error">
<div class="fullscreen">
<a href="{{ .config.BaseUri }}/" class="logo-large">
<svg id="b14cd102-2241-4742-aeeb-4ebca536e025" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 342.77 342.77">
<defs>
@ -23,10 +22,10 @@
.e973c102-193a-465f-a6ce-238077277871,.fc6d24c6-9a63-4383-a118-2195cb69577d{fill:none;}
.bb0146b0-9b01-4116-a7e2-79b9809a5f83{clip-path:url(#aced1c04-d137-4184-b323-97ff0384d552);}
.b8904b42-fb62-4aa5-aae5-dc17759b185d{clip-path:url(#ed8c2ee9-6712-480b-97dc-53fde4d07a40);}
.e973c102-193a-465f-a6ce-238077277871{stroke:#141412;stroke-miterlimit:10;stroke-width:5px;}
.e973c102-193a-465f-a6ce-238077277871{stroke:#c6d2ff;stroke-miterlimit:10;stroke-width:5px;}
.f5ddff88-48c1-46f9-a031-aee9bce94bd6{clip-path:url(#a1251993-bbf1-4548-8238-fa794c0bb4e3);}
.ead6f749-dce3-444a-a4f2-acc8f3078dec{clip-path:url(#be2d8169-fac1-479f-9595-ff9fe03b48a4);}
.a34fac52-8499-4455-a7f4-105abc9df09b,.f18ba0a9-054f-4ae5-b0d0-1c52cbadb98f{font-size:63px;fill:#141412;}
.a34fac52-8499-4455-a7f4-105abc9df09b,.f18ba0a9-054f-4ae5-b0d0-1c52cbadb98f{font-size:63px;fill:#c6d2ff;}
.a34fac52-8499-4455-a7f4-105abc9df09b{font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";}
.beccc81f-4365-4373-9899-0d823daf22a9{letter-spacing:0.01em;}
.f18ba0a9-054f-4ae5-b0d0-1c52cbadb98f{font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";font-weight:300;letter-spacing:0em;}
@ -64,7 +63,7 @@
<tspan class="a1c74a14-667e-420f-8ecb-79364b36eb33" x="-37" y="0">Found</tspan>
</text>
</svg>
</div>
</a>
</div>
</div>
</body>

View file

@ -31,7 +31,7 @@ Additional information can be found in our Developer Guide:
@import url("scrollbar.css");
@import url("themes.css");
@import url("effects.css");
@import url("splash.css");
@import url("static.css");
@import url("navigation.css");
@import url("logs.css");
@import url("visibility.css");
@ -83,14 +83,6 @@ main {
/* General App Styles */
#photoprism div.fullscreen {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
#photoprism .v-badge__badge {
font-size: 12px;
height: 19px;

View file

@ -1,4 +1,4 @@
/* App Loading Animation */
/* Static Page Styles */
#photoprism.container {
position: fixed;
@ -11,10 +11,27 @@
padding: 0;
}
#photoprism div.fullscreen {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
/* Server Error */
#photoprism.container.server-error {
background: #141417;
}
/* Splash Screen */
#photoprism.container.splash-screen {
background: #131313;
}
#photoprism a.logo-large,
#photoprism div.logo-large {
position: fixed;
top: 50%;
@ -24,6 +41,12 @@
height: 300px;
}
#photoprism a.logo-large {
display: block;
text-decoration: none;
color: #c6d2ff;
}
#photoprism div.loading-bar {
position: fixed;
bottom: 15%;