fix(keycloak): design logout completion page

infra/docker/keycloak/themes/tjwater/login/info.ftl

@@ -0,0 +1,44 @@
+<#import "template.ftl" as layout>
+<#assign isLogout = message.summary == msg("successLogout")>
+<@layout.registrationLayout displayMessage=false; section>
+    <#if section = "header">
+        <#if isLogout>
+            ${kcSanitize(msg("tjwaterLogoutTitle"))?no_esc}
+        <#elseif messageHeader??>
+            ${kcSanitize(msg("${messageHeader}"))?no_esc}
+        <#else>
+            ${message.summary}
+        </#if>
+    <#elseif section = "form">
+        <#if isLogout>
+            <div id="kc-info-message" class="tjwater-logout-message" role="status">
+                <div class="tjwater-logout-mark" aria-hidden="true">
+                    <span></span>
+                </div>
+                <div class="tjwater-logout-copy">
+                    <p class="tjwater-logout-eyebrow">${kcSanitize(msg("tjwaterLogoutEyebrow"))?no_esc}</p>
+                    <p class="tjwater-logout-description">${kcSanitize(msg("tjwaterLogoutDescription"))?no_esc}</p>
+                </div>
+                <#if pageRedirectUri?has_content>
+                    <a class="pf-v5-c-button pf-m-primary tjwater-logout-action" href="${pageRedirectUri}">${kcSanitize(msg("tjwaterReturnToApplication"))?no_esc}</a>
+                <#elseif (client.baseUrl)?has_content>
+                    <a class="pf-v5-c-button pf-m-primary tjwater-logout-action" href="${client.baseUrl}">${kcSanitize(msg("tjwaterReturnToApplication"))?no_esc}</a>
+                </#if>
+            </div>
+        <#else>
+            <div id="kc-info-message">
+                <p class="instruction">${message.summary}<#if requiredActions??><#list requiredActions>: <b><#items as reqActionItem>${kcSanitize(msg("requiredAction.${reqActionItem}"))?no_esc}<#sep>, </#items></b></#list><#else></#if></p>
+                <#if skipLink??>
+                <#else>
+                    <#if pageRedirectUri?has_content>
+                        <p><a href="${pageRedirectUri}">${kcSanitize(msg("backToApplication"))?no_esc}</a></p>
+                    <#elseif actionUri?has_content>
+                        <p><a href="${actionUri}">${kcSanitize(msg("proceedWithAction"))?no_esc}</a></p>
+                    <#elseif (client.baseUrl)?has_content>
+                        <p><a href="${client.baseUrl}">${kcSanitize(msg("backToApplication"))?no_esc}</a></p>
+                    </#if>
+                </#if>
+            </div>
+        </#if>
+    </#if>
+</@layout.registrationLayout>

infra/docker/keycloak/themes/tjwater/login/messages/messages_en.properties

@@ -1,3 +1,7 @@
 loginAccountTitle=Account sign in
 doLogIn=Sign in
 doForgotPassword=Forgot password
+tjwaterLogoutTitle=Signed out securely
+tjwaterLogoutEyebrow=Your session has ended
+tjwaterLogoutDescription=Your platform and identity-provider sessions have been ended securely.
+tjwaterReturnToApplication=Return to sign in

infra/docker/keycloak/themes/tjwater/login/messages/messages_zh_CN.properties

@@ -7,3 +7,7 @@ invalidUserMessage=用户名或密码错误
 invalidUsernameOrPasswordMessage=用户名或密码错误
 expiredCodeMessage=登录已超时，请重新登录
 loginTimeout=登录已超时，请重新开始登录
+tjwaterLogoutTitle=已安全退出
+tjwaterLogoutEyebrow=会话已结束
+tjwaterLogoutDescription=您的平台与身份认证会话均已安全结束。
+tjwaterReturnToApplication=返回登录页

infra/docker/keycloak/themes/tjwater/login/resources/css/tjwater-login.css

@@ -367,6 +367,60 @@ a:focus-visible {
   background: transparent;
 }
 
+.tjwater-logout-message {
+  display: grid;
+  gap: 20px;
+  padding-top: 4px;
+}
+
+.tjwater-logout-mark {
+  display: grid;
+  width: 52px;
+  height: 52px;
+  border: 1px solid oklch(0.76 0.09 184 / 52%);
+  border-radius: 50%;
+  background: oklch(0.92 0.04 184 / 58%);
+  place-items: center;
+}
+
+.tjwater-logout-mark span {
+  width: 18px;
+  height: 10px;
+  border-bottom: 3px solid var(--tjwater-teal);
+  border-left: 3px solid var(--tjwater-teal);
+  transform: translateY(-2px) rotate(-45deg);
+}
+
+.tjwater-logout-copy {
+  display: grid;
+  gap: 7px;
+}
+
+.tjwater-logout-eyebrow {
+  margin: 0;
+  color: var(--tjwater-ink);
+  font-size: 17px;
+  font-weight: 700;
+  line-height: 1.45;
+}
+
+.tjwater-logout-description {
+  margin: 0;
+  color: var(--tjwater-muted);
+  font-size: 14px;
+  line-height: 1.75;
+}
+
+.tjwater-logout-action {
+  display: inline-flex;
+  width: 100%;
+  min-height: 48px;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  text-decoration: none;
+}
+
 @keyframes tjwater-enter {
   from {
     opacity: 0;