mirror of
https://github.com/imgfloat/server.git
synced 2026-02-05 11:49:25 +00:00
Add staging banner
This commit is contained in:
@@ -22,6 +22,34 @@ body {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body.has-staging-banner {
|
||||
padding-top: 44px;
|
||||
}
|
||||
|
||||
.staging-banner {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 1000;
|
||||
padding: 8px 16px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0.18em;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
background: repeating-linear-gradient(135deg, #111827 0 18px, #facc15 18px 36px);
|
||||
}
|
||||
|
||||
.staging-banner span {
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 999px;
|
||||
background: #111827;
|
||||
color: #facc15;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
|
||||
.landing-body {
|
||||
min-height: 100vh;
|
||||
background:
|
||||
|
||||
@@ -29,7 +29,8 @@
|
||||
<script src="/js/vendor/OBJLoader.js"></script>
|
||||
<script src="/js/csrf.js"></script>
|
||||
</head>
|
||||
<body class="admin-body">
|
||||
<body class="admin-body" th:classappend="${isStaging} ? ' has-staging-banner' : ''">
|
||||
<div th:insert="~{fragments/staging :: banner}"></div>
|
||||
<div class="admin-frame">
|
||||
<header class="admin-topbar">
|
||||
<div class="topbar-left">
|
||||
|
||||
@@ -6,7 +6,8 @@
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<link rel="stylesheet" href="/css/styles.css" />
|
||||
</head>
|
||||
<body>
|
||||
<body th:classappend="${isStaging} ? ' has-staging-banner' : ''">
|
||||
<div th:insert="~{fragments/staging :: banner}"></div>
|
||||
<main class="landing">
|
||||
<header class="landing-header">
|
||||
<div class="brand">
|
||||
|
||||
@@ -8,7 +8,8 @@
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<link rel="stylesheet" href="/css/styles.css" />
|
||||
</head>
|
||||
<body class="dashboard-body">
|
||||
<body class="dashboard-body" th:classappend="${isStaging} ? ' has-staging-banner' : ''">
|
||||
<div th:insert="~{fragments/staging :: banner}"></div>
|
||||
<div class="dashboard-shell">
|
||||
<header class="dashboard-topbar">
|
||||
<div class="brand">
|
||||
|
||||
@@ -6,7 +6,8 @@
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<link rel="stylesheet" href="/css/styles.css" />
|
||||
</head>
|
||||
<body class="error-body">
|
||||
<body class="error-body" th:classappend="${isStaging} ? ' has-staging-banner' : ''">
|
||||
<div th:insert="~{fragments/staging :: banner}"></div>
|
||||
<div class="error-shell">
|
||||
<header class="error-header">
|
||||
<div class="brand">
|
||||
|
||||
8
src/main/resources/templates/fragments/staging.html
Normal file
8
src/main/resources/templates/fragments/staging.html
Normal file
@@ -0,0 +1,8 @@
|
||||
<!doctype html>
|
||||
<html lang="en" xmlns:th="http://www.thymeleaf.org">
|
||||
<body>
|
||||
<div th:fragment="banner" th:if="${isStaging}" class="staging-banner" role="status">
|
||||
<span>Staging environment</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -6,7 +6,8 @@
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<link rel="stylesheet" href="/css/styles.css" />
|
||||
</head>
|
||||
<body class="landing-body">
|
||||
<body class="landing-body" th:classappend="${isStaging} ? ' has-staging-banner' : ''">
|
||||
<div th:insert="~{fragments/staging :: banner}"></div>
|
||||
<div class="landing">
|
||||
<header class="landing-header">
|
||||
<div class="brand">
|
||||
|
||||
@@ -6,7 +6,8 @@
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<link rel="stylesheet" href="/css/styles.css" />
|
||||
</head>
|
||||
<body>
|
||||
<body th:classappend="${isStaging} ? ' has-staging-banner' : ''">
|
||||
<div th:insert="~{fragments/staging :: banner}"></div>
|
||||
<main class="landing">
|
||||
<header class="landing-header">
|
||||
<div class="brand">
|
||||
|
||||
@@ -18,7 +18,8 @@
|
||||
<script src="https://cdn.jsdelivr.net/npm/stompjs@2.3.3/lib/stomp.min.js"></script>
|
||||
<script src="/js/csrf.js"></script>
|
||||
</head>
|
||||
<body class="settings-body">
|
||||
<body class="settings-body" th:classappend="${isStaging} ? ' has-staging-banner' : ''">
|
||||
<div th:insert="~{fragments/staging :: banner}"></div>
|
||||
<div class="settings-shell">
|
||||
<header class="settings-header">
|
||||
<div class="brand">
|
||||
|
||||
@@ -6,7 +6,8 @@
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<link rel="stylesheet" href="/css/styles.css" />
|
||||
</head>
|
||||
<body>
|
||||
<body th:classappend="${isStaging} ? ' has-staging-banner' : ''">
|
||||
<div th:insert="~{fragments/staging :: banner}"></div>
|
||||
<main class="landing">
|
||||
<header class="landing-header">
|
||||
<div class="brand">
|
||||
|
||||
Reference in New Issue
Block a user