[KEYCLOAK-12744] rh-sso-preview theme for product build

* change logo for RH-SSO
* Small fixes to rh-sso-preview theme
* rh-sso-preview theme

Co-authored-by: Erik Jan de Wit <erikjan.dewit@gmail.com>

services/src/main/java/org/keycloak/services/resources/admin/info/ServerInfoAdminResource.java

@@ -173,6 +173,7 @@ public class ServerInfoAdminResource {
 
             if (!Profile.isFeatureEnabled(Profile.Feature.ACCOUNT2)) {
                 themeNames.remove("keycloak-preview");
+                themeNames.remove("rh-sso-preview");
             }
 
             List<ThemeInfoRepresentation> themes = new LinkedList<>();

themes/src/main/resources-product/theme/rh-sso-preview/account/messages/messages_en.properties

@@ -0,0 +1,4 @@
+# Put new messages for Account Console Here
+# Feel free to use any existing messages from the base theme
+accountManagementWelcomeMessage=Welcome to RH-SSO Account Management
+accountManagementTitle=RH-SSO Account Management

themes/src/main/resources-product/theme/rh-sso-preview/account/resources/public/layout.css

@@ -0,0 +1,3 @@
+.brand {
+  height: 16px;
+}

themes/src/main/resources-product/theme/rh-sso-preview/account/resources/public/logo.svg

@@ -0,0 +1,101 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 223.4 12.5" style="enable-background:new 0 0 223.4 12.5;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FFFFFF;}
+</style>
+<g>
+	<g>
+		<g>
+			<path class="st0" d="M6.5,12.3l-2-4H3.2v4H0V0.3h5.3c0.7,0,1.3,0.1,1.9,0.2c0.6,0.1,1.1,0.4,1.5,0.7c0.4,0.3,0.7,0.7,0.9,1.2
+				C9.9,2.9,10,3.5,10,4.2c0,0.9-0.2,1.6-0.6,2.2C9,7,8.5,7.4,7.8,7.7l2.4,4.6H6.5z M6.4,3.4C6.1,3.1,5.8,3,5.2,3h-2v2.6h2
+				c0.5,0,0.9-0.1,1.2-0.3c0.2-0.2,0.3-0.6,0.3-1C6.7,3.9,6.6,3.6,6.4,3.4z"/>
+		</g>
+		<g>
+			<path class="st0" d="M12.2,12.3V0.3h9.1v2.8h-5.9v1.6H19v2.7h-3.5v2h6v2.8H12.2z"/>
+		</g>
+		<g>
+			<path class="st0" d="M33.5,9.1c-0.3,0.8-0.7,1.4-1.2,1.9c-0.5,0.5-1.2,0.8-2,1c-0.8,0.2-1.7,0.3-2.8,0.3h-3.9V0.3h4.2
+				c0.9,0,1.8,0.1,2.5,0.3c0.8,0.2,1.4,0.5,1.9,1c0.5,0.5,0.9,1.1,1.2,1.8c0.3,0.7,0.4,1.7,0.4,2.8C33.9,7.3,33.8,8.3,33.5,9.1z
+				 M30.4,4.9c-0.1-0.4-0.3-0.7-0.5-1c-0.2-0.2-0.5-0.4-0.9-0.6c-0.4-0.1-0.8-0.2-1.3-0.2h-0.8v6.3h0.7c0.5,0,1-0.1,1.3-0.2
+				c0.4-0.1,0.7-0.3,0.9-0.5c0.2-0.2,0.4-0.6,0.5-1c0.1-0.4,0.2-0.9,0.2-1.5C30.5,5.7,30.5,5.3,30.4,4.9z"/>
+		</g>
+		<g>
+			<path class="st0" d="M48,12.3V7.6h-3.7v4.7h-3.4V0.3h3.4v4.4H48V0.3h3.4v11.9H48z"/>
+		</g>
+		<g>
+			<path class="st0" d="M61.5,12.3l-0.6-2.1h-3.6l-0.6,2.1h-3.5l4.3-11.9h3.3l4.3,11.9H61.5z M59.8,6.7c-0.1-0.4-0.2-0.7-0.3-1
+				c-0.1-0.3-0.2-0.5-0.2-0.8c-0.1-0.2-0.1-0.4-0.2-0.6c0-0.2-0.1-0.4-0.1-0.6C59,4,59,4.2,58.9,4.4c0,0.2-0.1,0.4-0.2,0.6
+				c-0.1,0.2-0.1,0.5-0.2,0.8c-0.1,0.3-0.2,0.6-0.3,1l-0.2,0.8h2L59.8,6.7z"/>
+		</g>
+		<g>
+			<path class="st0" d="M71.3,3.2v9.1H68V3.2h-3.3V0.3h10v2.9H71.3z"/>
+		</g>
+	</g>
+	<g>
+		<path class="st0" d="M78.6,2c-0.1,0.1-0.1,0.3-0.3,0.4c-0.1,0.1-0.2,0.2-0.4,0.3c-0.1,0.1-0.3,0.1-0.5,0.1c-0.2,0-0.3,0-0.5-0.1
+			c-0.1-0.1-0.3-0.1-0.4-0.3c-0.1-0.1-0.2-0.2-0.3-0.4c-0.1-0.1-0.1-0.3-0.1-0.5c0-0.2,0-0.3,0.1-0.5c0.1-0.1,0.1-0.3,0.3-0.4
+			c0.1-0.1,0.2-0.2,0.4-0.3c0.1-0.1,0.3-0.1,0.5-0.1c0.2,0,0.3,0,0.5,0.1c0.1,0.1,0.3,0.1,0.4,0.3c0.1,0.1,0.2,0.2,0.3,0.4
+			c0.1,0.1,0.1,0.3,0.1,0.5C78.7,1.7,78.6,1.8,78.6,2z M78.4,1.1c-0.1-0.1-0.1-0.2-0.2-0.3c-0.1-0.1-0.2-0.2-0.3-0.2
+			c-0.1-0.1-0.3-0.1-0.4-0.1c-0.1,0-0.3,0-0.4,0.1c-0.1,0.1-0.2,0.1-0.3,0.2c-0.1,0.1-0.2,0.2-0.2,0.3c-0.1,0.1-0.1,0.3-0.1,0.4
+			c0,0.1,0,0.3,0.1,0.4s0.1,0.2,0.2,0.3c0.1,0.1,0.2,0.2,0.3,0.2c0.1,0,0.3,0.1,0.4,0.1c0.1,0,0.3,0,0.4-0.1
+			c0.1-0.1,0.2-0.1,0.3-0.2c0.1-0.1,0.2-0.2,0.2-0.3c0.1-0.1,0.1-0.3,0.1-0.4C78.5,1.4,78.4,1.2,78.4,1.1z M77.9,1.5
+			c-0.1,0.1-0.1,0.1-0.2,0.1L78,2.1h-0.3l-0.3-0.5h-0.3v0.5H77V0.8h0.6c0.1,0,0.1,0,0.2,0c0.1,0,0.1,0,0.1,0.1C77.9,1,77.9,1,78,1
+			c0,0,0,0.1,0,0.2C78,1.3,78,1.4,77.9,1.5z M77.7,1.1c0,0-0.1,0-0.1,0h-0.3v0.4h0.3c0.1,0,0.1,0,0.1,0c0,0,0.1-0.1,0.1-0.1
+			C77.8,1.2,77.8,1.1,77.7,1.1z"/>
+	</g>
+	<g>
+		<path class="st0" d="M91.4,10.2c-0.2,0.5-0.5,0.9-0.9,1.2S89.6,12,89,12.2c-0.6,0.2-1.3,0.3-2.1,0.3c-1,0-1.9-0.2-2.8-0.6
+			c-0.8-0.4-1.5-0.9-1.9-1.6l1.7-1.6c0.4,0.5,0.9,0.8,1.4,1.1s1.1,0.3,1.7,0.3c0.7,0,1.3-0.1,1.6-0.3s0.5-0.5,0.5-1
+			c0-0.2,0-0.4-0.1-0.5C89,8.1,88.8,8,88.6,7.9c-0.2-0.1-0.5-0.2-0.8-0.4c-0.4-0.1-0.8-0.2-1.4-0.4c-0.6-0.1-1.1-0.3-1.5-0.4
+			C84.4,6.5,84,6.3,83.7,6c-0.3-0.3-0.6-0.6-0.8-1c-0.2-0.4-0.3-0.9-0.3-1.5c0-0.6,0.1-1,0.3-1.5c0.2-0.4,0.5-0.8,0.9-1.1
+			c0.4-0.3,0.8-0.5,1.4-0.7C85.8,0.1,86.4,0,87,0c0.9,0,1.8,0.2,2.5,0.5c0.7,0.3,1.3,0.8,1.9,1.4l-1.7,1.7c-0.4-0.4-0.8-0.7-1.3-0.9
+			s-0.9-0.3-1.5-0.3c-0.3,0-0.6,0-0.8,0.1c-0.2,0.1-0.4,0.1-0.5,0.2s-0.2,0.2-0.3,0.3c-0.1,0.1-0.1,0.3-0.1,0.4c0,0.2,0,0.4,0.1,0.5
+			c0.1,0.1,0.2,0.2,0.4,0.4c0.2,0.1,0.4,0.2,0.7,0.3c0.3,0.1,0.7,0.2,1.2,0.3c0.5,0.1,1,0.2,1.4,0.4c0.5,0.2,0.9,0.4,1.3,0.6
+			C90.7,6.2,91,6.6,91.3,7c0.2,0.4,0.4,1,0.4,1.6C91.6,9.2,91.5,9.7,91.4,10.2z"/>
+		<path class="st0" d="M94.4,12.3V0.2h2.4v12.1H94.4z"/>
+		<path class="st0" d="M107.7,12.3l-4.4-6.6c-0.1-0.2-0.3-0.5-0.5-0.7c-0.2-0.3-0.3-0.5-0.4-0.6c0,0.1,0,0.3,0,0.5
+			c0,0.2,0,0.5,0,0.7c0,0.3,0,0.5,0,0.8c0,0.3,0,0.5,0,0.6v5.3h-2.4V0.2h2.3l4.3,6.4c0.1,0.2,0.3,0.5,0.5,0.7
+			c0.2,0.3,0.3,0.5,0.4,0.6c0-0.1,0-0.3,0-0.5c0-0.2,0-0.5,0-0.7c0-0.3,0-0.5,0-0.8c0-0.3,0-0.5,0-0.6V0.2h2.4v12.1H107.7z"/>
+		<path class="st0" d="M122.1,9.7c-0.2,0.6-0.6,1.1-1,1.5c-0.4,0.4-0.9,0.7-1.5,0.9c-0.6,0.2-1.2,0.3-1.9,0.3
+			c-0.8,0-1.5-0.1-2.2-0.4c-0.6-0.3-1.2-0.7-1.7-1.3c-0.5-0.5-0.8-1.2-1.1-2c-0.3-0.8-0.4-1.6-0.4-2.6c0-0.9,0.1-1.8,0.4-2.5
+			c0.3-0.8,0.6-1.4,1.1-2s1-1,1.7-1.3c0.7-0.3,1.4-0.5,2.2-0.5c0.6,0,1.2,0.1,1.6,0.2c0.5,0.1,0.9,0.3,1.3,0.6s0.7,0.6,1,1
+			c0.3,0.4,0.5,0.8,0.7,1.3L120,4c-0.1-0.2-0.2-0.4-0.4-0.6s-0.3-0.4-0.5-0.5c-0.2-0.1-0.4-0.2-0.6-0.3c-0.2-0.1-0.5-0.1-0.8-0.1
+			c-0.4,0-0.9,0.1-1.2,0.3c-0.4,0.2-0.7,0.5-0.9,0.8s-0.4,0.7-0.6,1.2c-0.1,0.5-0.2,1-0.2,1.5c0,0.6,0.1,1.1,0.2,1.5
+			c0.1,0.5,0.3,0.9,0.6,1.2c0.2,0.3,0.5,0.6,0.9,0.8c0.4,0.2,0.8,0.3,1.2,0.3c0.4,0,0.8,0,1.1-0.1c0.3-0.1,0.5-0.2,0.7-0.4
+			c0.2-0.2,0.3-0.4,0.4-0.6s0.2-0.5,0.2-0.7h-1.9V6h4.3v1.6C122.4,8.4,122.3,9.1,122.1,9.7z"/>
+		<path class="st0" d="M125,12.3V0.2h2.4v9.7h6.1v2.4H125z"/>
+		<path class="st0" d="M135.7,12.3V0.2h8.4v2.4h-6v2.1h3.5V7h-3.5v2.9h6.2v2.4H135.7z"/>
+		<path class="st0" d="M160.5,10.2c-0.2,0.5-0.5,0.9-0.9,1.2s-0.9,0.6-1.5,0.8c-0.6,0.2-1.3,0.3-2.1,0.3c-1,0-1.9-0.2-2.8-0.6
+			s-1.5-0.9-1.9-1.6l1.7-1.6c0.4,0.5,0.9,0.8,1.4,1.1s1.1,0.3,1.7,0.3c0.7,0,1.3-0.1,1.6-0.3c0.3-0.2,0.5-0.5,0.5-1
+			c0-0.2,0-0.4-0.1-0.5c-0.1-0.1-0.2-0.3-0.4-0.4c-0.2-0.1-0.5-0.2-0.8-0.4c-0.4-0.1-0.8-0.2-1.4-0.4C155,7,154.5,6.9,154,6.7
+			c-0.5-0.2-0.9-0.4-1.2-0.7c-0.3-0.3-0.6-0.6-0.8-1c-0.2-0.4-0.3-0.9-0.3-1.5c0-0.6,0.1-1,0.3-1.5c0.2-0.4,0.5-0.8,0.9-1.1
+			c0.4-0.3,0.8-0.5,1.4-0.7c0.5-0.2,1.1-0.2,1.7-0.2c0.9,0,1.8,0.2,2.5,0.5c0.7,0.3,1.3,0.8,1.9,1.4l-1.7,1.7
+			c-0.4-0.4-0.8-0.7-1.3-0.9s-0.9-0.3-1.5-0.3c-0.3,0-0.6,0-0.8,0.1c-0.2,0.1-0.4,0.1-0.5,0.2s-0.2,0.2-0.3,0.3
+			c-0.1,0.1-0.1,0.3-0.1,0.4c0,0.2,0,0.4,0.1,0.5c0.1,0.1,0.2,0.2,0.4,0.4c0.2,0.1,0.4,0.2,0.7,0.3c0.3,0.1,0.7,0.2,1.2,0.3
+			c0.5,0.1,1,0.2,1.4,0.4c0.5,0.2,0.9,0.4,1.3,0.6c0.4,0.3,0.7,0.6,0.9,1.1c0.2,0.4,0.4,1,0.4,1.6C160.8,9.2,160.7,9.7,160.5,10.2z"
+			/>
+		<path class="st0" d="M163.5,12.3V0.2h2.4v12.1H163.5z"/>
+		<path class="st0" d="M178.3,9.7c-0.2,0.6-0.6,1.1-1,1.5c-0.4,0.4-0.9,0.7-1.5,0.9c-0.6,0.2-1.2,0.3-1.9,0.3
+			c-0.8,0-1.5-0.1-2.2-0.4s-1.2-0.7-1.7-1.3c-0.5-0.5-0.8-1.2-1.1-2c-0.3-0.8-0.4-1.6-0.4-2.6c0-0.9,0.1-1.8,0.4-2.5
+			c0.3-0.8,0.6-1.4,1.1-2s1-1,1.7-1.3c0.7-0.3,1.4-0.5,2.2-0.5c0.6,0,1.2,0.1,1.6,0.2c0.5,0.1,0.9,0.3,1.3,0.6c0.4,0.3,0.7,0.6,1,1
+			s0.5,0.8,0.7,1.3L176.2,4c-0.1-0.2-0.2-0.4-0.4-0.6c-0.1-0.2-0.3-0.4-0.5-0.5c-0.2-0.1-0.4-0.2-0.6-0.3c-0.2-0.1-0.5-0.1-0.8-0.1
+			c-0.4,0-0.9,0.1-1.2,0.3c-0.4,0.2-0.7,0.5-0.9,0.8c-0.2,0.3-0.4,0.7-0.6,1.2c-0.1,0.5-0.2,1-0.2,1.5c0,0.6,0.1,1.1,0.2,1.5
+			c0.1,0.5,0.3,0.9,0.6,1.2c0.2,0.3,0.5,0.6,0.9,0.8c0.4,0.2,0.8,0.3,1.2,0.3c0.4,0,0.8,0,1.1-0.1c0.3-0.1,0.5-0.2,0.7-0.4
+			c0.2-0.2,0.3-0.4,0.4-0.6s0.2-0.5,0.2-0.7h-1.9V6h4.3v1.6C178.7,8.4,178.6,9.1,178.3,9.7z"/>
+		<path class="st0" d="M188.9,12.3l-4.4-6.6c-0.2-0.2-0.3-0.5-0.5-0.7c-0.2-0.3-0.3-0.5-0.4-0.6c0,0.1,0,0.3,0,0.5
+			c0,0.2,0,0.5,0,0.7c0,0.3,0,0.5,0,0.8c0,0.3,0,0.5,0,0.6v5.3h-2.4V0.2h2.3l4.3,6.4c0.1,0.2,0.3,0.5,0.5,0.7
+			c0.2,0.3,0.3,0.5,0.4,0.6c0-0.1,0-0.3,0-0.5c0-0.2,0-0.5,0-0.7c0-0.3,0-0.5,0-0.8c0-0.3,0-0.5,0-0.6V0.2h2.4v12.1H188.9z"/>
+		<path class="st0" d="M193.6,7.2V4.8h5v2.4H193.6z"/>
+		<path class="st0" d="M210.7,8.8c-0.3,0.8-0.6,1.4-1.1,2c-0.5,0.5-1,0.9-1.7,1.2c-0.7,0.3-1.4,0.4-2.2,0.4c-0.8,0-1.5-0.1-2.2-0.4
+			s-1.2-0.7-1.7-1.2c-0.5-0.5-0.8-1.2-1.1-2c-0.3-0.8-0.4-1.6-0.4-2.6s0.1-1.9,0.4-2.6c0.3-0.8,0.6-1.4,1.1-2c0.5-0.5,1-0.9,1.7-1.2
+			c0.7-0.3,1.4-0.4,2.2-0.4c0.8,0,1.5,0.1,2.1,0.4s1.2,0.7,1.7,1.2c0.5,0.5,0.8,1.2,1.1,2c0.3,0.8,0.4,1.6,0.4,2.6
+			S211,8.1,210.7,8.8z M207.9,3.4c-0.5-0.7-1.2-1-2.1-1s-1.5,0.3-2,1S203,5,203,6.2c0,1.2,0.3,2.2,0.8,2.8c0.5,0.7,1.2,1,2.1,1
+			s1.5-0.3,2-1s0.8-1.6,0.8-2.8S208.4,4.1,207.9,3.4z"/>
+		<path class="st0" d="M221.2,12.3l-4.4-6.6c-0.2-0.2-0.3-0.5-0.5-0.7c-0.2-0.3-0.3-0.5-0.4-0.6c0,0.1,0,0.3,0,0.5
+			c0,0.2,0,0.5,0,0.7c0,0.3,0,0.5,0,0.8c0,0.3,0,0.5,0,0.6v5.3h-2.4V0.2h2.3l4.3,6.4c0.1,0.2,0.3,0.5,0.5,0.7
+			c0.2,0.3,0.3,0.5,0.4,0.6c0-0.1,0-0.3,0-0.5c0-0.2,0-0.5,0-0.7c0-0.3,0-0.5,0-0.8c0-0.3,0-0.5,0-0.6V0.2h2.4v12.1H221.2z"/>
+	</g>
+</g>
+</svg>

themes/src/main/resources-product/theme/rh-sso-preview/account/theme.properties

@@ -0,0 +1 @@
+parent=keycloak-preview

themes/src/main/resources/theme/keycloak-preview/account/index.ftl

@@ -7,7 +7,7 @@
         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
         <meta name="robots" content="noindex, nofollow">
         <meta name="viewport" content="width=device-width, initial-scale=1">
-          
+
         <script>
             <#if properties.developmentMode?has_content && properties.developmentMode == "true">
             var developmentMode = true;
@@ -25,7 +25,7 @@
             var realm = '${realm.name}';
             var resourceUrl = '${resourceUrl}';
             var isReactLoading = false;
-                
+
             var features = {
                 isRegistrationEmailAsUsername : ${realm.registrationEmailAsUsername?c},
                 isEditUserNameAllowed : ${realm.editUsernameAllowed?c},
@@ -35,7 +35,7 @@
                 isMyResourcesEnabled : ${(realm.userManagedAccessAllowed && isAuthorizationEnabled)?c},
                 isTotpConfigured : ${isTotpConfigured?c}
             }
-                
+
             var availableLocales = [];
             <#list supportedLocales as locale, label>
                 availableLocales.push({locale : '${locale}', label : '${label}'});
@@ -55,18 +55,18 @@
                 var l18Msg = {};
             </#if>
         </script>
-        
+
-        <link rel="icon" href="${resourceUrl}/app/assets/img/favicon.ico" type="image/x-icon"/>
+        <link rel="icon" href="${resourceUrl}/public/favicon.ico" type="image/x-icon"/>
 
         <script src="${authUrl}js/keycloak.js"></script>
-        
+
         <#if properties.developmentMode?has_content && properties.developmentMode == "true">
         <!-- Don't use this in production: -->
         <script src="${resourceUrl}/node_modules/react/umd/react.development.js" crossorigin></script>
         <script src="${resourceUrl}/node_modules/react-dom/umd/react-dom.development.js" crossorigin></script>
         <script src="https://unpkg.com/babel-standalone@6.26.0/babel.min.js"></script>
         </#if>
-        
+
         <#if properties.extensions?has_content>
             <#list properties.extensions?split(' ') as script>
                 <#if properties.developmentMode?has_content && properties.developmentMode == "true">
@@ -76,7 +76,7 @@
                 </#if>
             </#list>
         </#if>
-        
+
         <#if properties.scripts?has_content>
             <#list properties.scripts?split(' ') as script>
         <script type="text/javascript" src="${resourceUrl}/${script}"></script>
@@ -88,6 +88,8 @@
             <link href="${resourceUrl}/${style}" rel="stylesheet"/>
             </#list>
         </#if>
+
+        <link href="${resourceUrl}/public/layout.css" rel="stylesheet"/>
     </head>
 
     <body>
@@ -108,7 +110,7 @@
                     document.getElementById("landingSignOutButton").style.display='inline';
                     document.getElementById("landingSignOutLink").style.display='inline';
                 }
-                    
+
                 loadjs("/node_modules/systemjs/dist/system.src.js", function() {
                     loadjs("/systemjs.config.js", function() {
                         System.import('${resourceUrl}/Main.js').catch(function (err) {
@@ -125,7 +127,7 @@
 
 <div id="spinner_screen" style="display:block; height:100%">
     <div style="width: 320px; height: 328px; text-align: center; position: absolute; top:0;	bottom: 0; left: 0;	right: 0; margin: auto;">
-                <img src="${resourceUrl}/app/assets/img/keycloak-logo-min.png" alt="Keycloak Logo">
+                <img src="${resourceUrl}/public/logo.svg" alt="Logo" class="brand">
                 <p>${msg("loadingMessage")}</p>
                 <div >
                     <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin: auto; background: rgb(255, 255, 255); display: block; shape-rendering: auto;" width="200px" height="200px" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid">
@@ -143,7 +145,7 @@
       <header role="banner" class="pf-c-page__header">
         <div class="pf-c-page__header-brand">
           <a class="pf-c-page__header-brand-link">
-            <img class="pf-c-brand" src="${resourceUrl}/app/assets/img/keycloak-logo-min.png" alt="Keycloak Logo">
+            <img class="pf-c-brand brand" src="${resourceUrl}/public/logo.svg" alt="Logo">
           </a>
         </div>
         <div class="pf-c-page__header-tools">
@@ -152,7 +154,7 @@
               <a id="landingReferrerLink" href="${referrer_uri}" id="referrer" tabindex="0"><span class="pf-icon pf-icon-arrow"></span>${msg("backTo",referrerName)}</a>
             </div>
             </#if>
-            
+
             <#if realm.internationalizationEnabled  && supportedLocales?size gt 1>
             <div class="pf-c-page__header-tools-group pf-m-icons">
               <div id="landing-locale-dropdown" class="pf-c-dropdown">
@@ -174,12 +176,12 @@
               </div>
             </div>
             </#if>
-            
+
             <div class="pf-c-page__header-tools-group pf-m-icons">
               <button id="landingSignInButton" tabindex="0" style="display:none" onclick="keycloak.login();" class="pf-c-button pf-m-primary" type="button">${msg("doLogIn")}</button>
               <button id="landingSignOutButton" tabindex="0" style="display:none" onclick="keycloak.logout();" class="pf-c-button pf-m-primary" type="button">${msg("doSignOut")}</button>
             </div>
-            
+
             <!-- Kebab for mobile -->
             <div class="pf-c-page__header-tools-group">
                 <div id="landingMobileKebab" class="pf-c-dropdown pf-m-mobile" onclick="toggleMobileDropdown();"> <!-- pf-m-expanded -->
@@ -192,7 +194,7 @@
                             <a id="landingMobileReferrerLink" href="${referrer_uri}" role="menuitem" tabindex="0" aria-disabled="false" class="pf-c-dropdown__menu-item">${msg("backTo",referrerName)}</a>
                         </li>
                         </#if>
-                        
+
                         <!-- locale selector for mobile -->
                         <#if realm.internationalizationEnabled  && supportedLocales?size gt 1>
                             <li role="none" aria-expanded="false" onclick="toggleMobileChooseLocale();"><a href="#" id="landing-mobile-local-toggle" class="pf-c-dropdown__menu-item">${msg("locale_" + locale)} <i id="landingMobileLocaleSelectedIcon" class="fas fa-angle-right pf-c-options-menu__menu-item-icon" aria-hidden="true"></i></a></li>
@@ -216,7 +218,7 @@
                     </ul>
                 </div>
             </div>
-            
+
         </div> <!-- end header tools -->
       </header>
 
@@ -285,7 +287,7 @@
                 document.getElementById("landingLinkedAccountsLink").style.display='block';
             };
 
-            // Hidden until feature is complete.  
+            // Hidden until feature is complete.
             //if (features.isMyResourcesEnabled) {
             //    document.getElementById("landingMyResourcesCard").style.display='block';
             //};

themes/src/main/resources/theme/keycloak-preview/account/resources/app/App.tsx

@@ -1,4 +1,4 @@
-/* 
+/*
  * Copyright 2018 Red Hat, Inc. and/or its affiliates.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -40,7 +40,7 @@ declare const locale: string;
 declare const resourceUrl: string;
 
 const pFlyImages = resourceUrl + '/node_modules/@patternfly/patternfly/assets/images/';
-const brandImg = resourceUrl + '/app/assets/img/keycloak-logo-min.png';
+const brandImg = resourceUrl + '/public/logo.svg';
 const avatarImg = pFlyImages + 'img_avatar.svg';
 
 export interface AppProps {};
@@ -65,7 +65,7 @@ export class App extends React.Component<AppProps> {
 
         const Header = (
             <PageHeader
-                logo={<Brand src={brandImg} alt="Patternfly Logo" />}
+                logo={<Brand src={brandImg} alt="Logo" className="brand"/>}
                 toolbar={<PageToolbar/>}
                 avatar={<Avatar src={avatarImg} alt="Avatar image" />}
                 showNavToggle
@@ -73,11 +73,9 @@ export class App extends React.Component<AppProps> {
         );
 
         const Sidebar = <PageSidebar nav={<PageNav/>} />;
-        
+
-        const fullHeight = { height: '100%'};
-        
         return (
-            <span style={fullHeight}>
+            <span style={{ height: '100%'}}>
                 <Page header={Header} sidebar={Sidebar} isManagedSidebar>
                     <PageSection>
                         {makeRoutes()}

themes/src/main/resources/theme/keycloak-preview/account/resources/public/layout.css

@@ -0,0 +1,3 @@
+.brand {
+  height: 35px;
+}