戒酒的李白

【error.html】500界面美化

1 -<!-- 写一个错误页面 -->  
2 -<!DOCTYPE html> 1 +<!doctype html>
3 <html lang="en"> 2 <html lang="en">
4 <head> 3 <head>
5 <meta charset="utf-8"> 4 <meta charset="utf-8">
6 - <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">  
7 - <title>404</title>  
8 - <link rel="stylesheet" href="/static/css/backend-plugin.min.css">  
9 - <link rel="stylesheet" href="/static/css/backend.css"> 5 + <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6 + <title>Error Page</title>
  7 +
  8 + <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
  9 + <style>
  10 + body {
  11 + background-color: #f8f9fa;
  12 + color: #343a40;
  13 + }
  14 + .container {
  15 + margin-top: 10%;
  16 + }
  17 + .error-image {
  18 + max-width: 100%;
  19 + height: auto;
  20 + }
  21 + .error-msg {
  22 + font-size: 1.5rem;
  23 + margin-top: 20px;
  24 + }
  25 + .btn-custom {
  26 + background-color: #6c757d;
  27 + color: #fff;
  28 + margin-top: 20px;
  29 + }
  30 + .btn-custom:hover {
  31 + background-color: #5a6268;
  32 + }
  33 + </style>
10 </head> 34 </head>
11 - <body class=" ">  
12 - <div class="wrapper">  
13 - <div class="container">  
14 - <div class="row no-gutters height-self-center">  
15 - <div class="col-sm-12 text-center align-self-center">  
16 - <div class="iq-error position-relative">  
17 - 这是404页面  
18 - </div>  
19 - </div>  
20 - </div>  
21 - </div>  
22 - </div>  
23 - </body>  
  35 + <body>
  36 + <div class="container text-center">
  37 + <img src="/static/picture/maintenance.png" class="error-image" alt="Maintenance Image">
  38 + <div class="error-msg">{{ errorMsg }}</div>
  39 + <p>Please go back, check the issue, and fix it.</p>
  40 + <a href="/user/login" class="btn btn-custom">Return to Login Page</a>
  41 + </div>
  42 +
  43 + <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
  44 + <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js"></script>
  45 + <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
  46 + </body>
  47 +</html>