From 3db80463bdeb5806b0f645093e0750af142dc64e Mon Sep 17 00:00:00 2001
From: Pheeef <pheeef@proton.me>
Date: Fri, 14 Feb 2025 21:20:26 +0100
Subject: [PATCH] custom theme for keycloak

---
 login/resources/css/styles.css     |  46 ++++++
 login/resources/img/background.svg |  28 ++++
 login/resources/img/logo.png       | Bin 0 -> 8533 bytes
 login/resources/img/logo.svg       |  22 +++
 login/template.ftl                 | 238 +++++++++++++++++++++++++++++
 login/theme.properties             |   4 +
 6 files changed, 338 insertions(+)
 create mode 100644 login/resources/css/styles.css
 create mode 100644 login/resources/img/background.svg
 create mode 100644 login/resources/img/logo.png
 create mode 100644 login/resources/img/logo.svg
 create mode 100644 login/template.ftl
 create mode 100644 login/theme.properties

diff --git a/login/resources/css/styles.css b/login/resources/css/styles.css
new file mode 100644
index 0000000..bd0ab77
--- /dev/null
+++ b/login/resources/css/styles.css
@@ -0,0 +1,46 @@
+:root {
+    --pf-global--primary-color--100: #FFDF5D;
+    --pf-global--primary-color--200: #ffd738;
+}
+
+
+.login-pf body {
+    background-image: url('../img/background.svg');
+    background-size: cover;
+}
+
+.pf-v5-c-login__main {
+    border-radius: 0.75rem;
+    background-color: #282828;
+}
+
+.pf-v5-c-button.pf-m-primary {
+    background-color: #FFDF5D;
+    color: #282828;
+}
+
+.pf-v5-c-button.pf-m-primary:hover {
+    background-color: #ffd738;
+}
+
+.pf-v5-c-form-control:focus-within {
+	--pf-v5-c-form-control--after--BorderBottomColor: #FFDF5D;
+	--pf-v5-c-form-control--after--BorderBottomWidth: var(--pf-v5-c-form-control--focus--after--BorderBottomWidth);
+}
+
+#kc-header {
+    display: none;
+}
+
+.pf-v5-c-login__main-header {
+    display: flex;
+    flex-direction: column;
+}
+
+.cccsbg-logo {
+    background-image: url('../img/logo.svg');
+    height: 170px;
+    width: 300px;
+    background-repeat: no-repeat;
+    margin-bottom: 50px;
+}
\ No newline at end of file
diff --git a/login/resources/img/background.svg b/login/resources/img/background.svg
new file mode 100644
index 0000000..1eb10a9
--- /dev/null
+++ b/login/resources/img/background.svg
@@ -0,0 +1,28 @@
+<svg width="1928" height="1088" viewBox="0 0 1928 1088" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_126_3)" filter="url(#filter0_d_126_3)">
+<rect width="1920" height="1080" transform="translate(4)" fill="#1F1F1F"/>
+<path opacity="0.08" d="M1524.95 -329L1537.27 -321.888L538.318 1408.34L526 1401.23L1524.95 -329Z" fill="#FFDF5D"/>
+<rect opacity="0.08" x="1676.97" y="-343" width="38.2309" height="2039.94" transform="rotate(30 1676.97 -343)" fill="#FFDF5D"/>
+<rect opacity="0.08" x="1729.69" y="-307.732" width="55.7603" height="2015.38" transform="rotate(30 1729.69 -307.732)" fill="#FFDF5D"/>
+<rect opacity="0.08" x="1835.17" y="-330.327" width="75.0563" height="2070.34" transform="rotate(30 1835.17 -330.327)" fill="#FFDF5D"/>
+<rect opacity="0.08" x="1906.61" y="-251.391" width="84.9295" height="2009.21" transform="rotate(30 1906.61 -251.391)" fill="#FFDF5D"/>
+<rect opacity="0.08" x="2016.81" y="-210.952" width="99.9236" height="1985.61" transform="rotate(30 2016.81 -210.952)" fill="#FFDF5D"/>
+<rect opacity="0.08" x="1596.95" y="-306.147" width="27" height="1997.9" transform="rotate(30 1596.95 -306.147)" fill="#FFDF5D"/>
+<rect opacity="0.08" x="1554.95" y="-321" width="22.7129" height="1997.9" transform="rotate(30 1554.95 -321)" fill="#FFDF5D"/>
+</g>
+<defs>
+<filter id="filter0_d_126_3" x="0" y="0" width="1928" height="1088" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_126_3"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_126_3" result="shape"/>
+</filter>
+<clipPath id="clip0_126_3">
+<rect width="1920" height="1080" fill="white" transform="translate(4)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/login/resources/img/logo.png b/login/resources/img/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..607066894c6926920b594a5ea70baae2bb21f6fc
GIT binary patch
literal 8533
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
a9i)Olk2llD+dyR=WM*V#Sf}s#@P7bhCn~!D

literal 0
HcmV?d00001

diff --git a/login/resources/img/logo.svg b/login/resources/img/logo.svg
new file mode 100644
index 0000000..9bfbb5c
--- /dev/null
+++ b/login/resources/img/logo.svg
@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 281 173" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(1,0,0,1,-437,0)">
+        <g id="Base-Logo" serif:id="Base Logo" transform="matrix(0.142656,0,0,0.138477,819.879,-9.08095)">
+            <rect x="-2683.93" y="65.578" width="1965.88" height="1248.91" style="fill:none;"/>
+            <g transform="matrix(8.19804,0,0,8.44549,-5647.04,-12356.9)">
+                <path d="M469.172,1543.1C465.132,1543.1 461.591,1542.34 458.548,1540.82C455.505,1539.3 453.139,1537.17 451.452,1534.43C449.764,1531.69 448.92,1528.49 448.92,1524.84L448.92,1499.11C448.92,1495.4 449.764,1492.19 451.452,1489.48C453.139,1486.77 455.505,1484.66 458.548,1483.13C461.591,1481.61 465.132,1480.85 469.172,1480.85C473.266,1480.85 476.821,1481.61 479.837,1483.13C482.852,1484.66 485.204,1486.77 486.891,1489.48C488.579,1492.19 489.423,1495.4 489.423,1499.11L476.973,1499.11C476.973,1496.68 476.295,1494.82 474.94,1493.55C473.584,1492.28 471.661,1491.64 469.172,1491.64C466.682,1491.64 464.759,1492.28 463.403,1493.55C462.048,1494.82 461.37,1496.68 461.37,1499.11L461.37,1524.84C461.37,1527.22 462.048,1529.06 463.403,1530.36C464.759,1531.66 466.682,1532.31 469.172,1532.31C471.661,1532.31 473.584,1531.66 474.94,1530.36C476.295,1529.06 476.973,1527.22 476.973,1524.84L489.423,1524.84C489.423,1528.49 488.579,1531.69 486.891,1534.43C485.204,1537.17 482.852,1539.3 479.837,1540.82C476.821,1542.34 473.266,1543.1 469.172,1543.1Z" style="fill:rgb(255,223,93);fill-rule:nonzero;"/>
+                <path d="M518.97,1543.1C514.931,1543.1 511.389,1542.34 508.346,1540.82C505.303,1539.3 502.937,1537.17 501.25,1534.43C499.562,1531.69 498.718,1528.49 498.718,1524.84L498.718,1499.11C498.718,1495.4 499.562,1492.19 501.25,1489.48C502.937,1486.77 505.303,1484.66 508.346,1483.13C511.389,1481.61 514.931,1480.85 518.97,1480.85C523.064,1480.85 526.619,1481.61 529.635,1483.13C532.65,1484.66 535.002,1486.77 536.69,1489.48C538.377,1492.19 539.221,1495.4 539.221,1499.11L526.771,1499.11C526.771,1496.68 526.094,1494.82 524.738,1493.55C523.382,1492.28 521.46,1491.64 518.97,1491.64C516.48,1491.64 514.557,1492.28 513.201,1493.55C511.846,1494.82 511.168,1496.68 511.168,1499.11L511.168,1524.84C511.168,1527.22 511.846,1529.06 513.201,1530.36C514.557,1531.66 516.48,1532.31 518.97,1532.31C521.46,1532.31 523.382,1531.66 524.738,1530.36C526.094,1529.06 526.771,1527.22 526.771,1524.84L539.221,1524.84C539.221,1528.49 538.377,1531.69 536.69,1534.43C535.002,1537.17 532.65,1539.3 529.635,1540.82C526.619,1542.34 523.064,1543.1 518.97,1543.1Z" style="fill:rgb(255,223,93);fill-rule:nonzero;"/>
+                <path d="M568.768,1543.1C564.729,1543.1 561.188,1542.34 558.144,1540.82C555.101,1539.3 552.736,1537.17 551.048,1534.43C549.36,1531.69 548.517,1528.49 548.517,1524.84L548.517,1499.11C548.517,1495.4 549.36,1492.19 551.048,1489.48C552.736,1486.77 555.101,1484.66 558.144,1483.13C561.188,1481.61 564.729,1480.85 568.768,1480.85C572.862,1480.85 576.417,1481.61 579.433,1483.13C582.449,1484.66 584.8,1486.77 586.488,1489.48C588.175,1492.19 589.019,1495.4 589.019,1499.11L576.57,1499.11C576.57,1496.68 575.892,1494.82 574.536,1493.55C573.181,1492.28 571.258,1491.64 568.768,1491.64C566.278,1491.64 564.355,1492.28 563,1493.55C561.644,1494.82 560.966,1496.68 560.966,1499.11L560.966,1524.84C560.966,1527.22 561.644,1529.06 563,1530.36C564.355,1531.66 566.278,1532.31 568.768,1532.31C571.258,1532.31 573.181,1531.66 574.536,1530.36C575.892,1529.06 576.57,1527.22 576.57,1524.84L589.019,1524.84C589.019,1528.49 588.175,1531.69 586.488,1534.43C584.8,1537.17 582.449,1539.3 579.433,1540.82C576.417,1542.34 572.862,1543.1 568.768,1543.1Z" style="fill:rgb(255,223,93);fill-rule:nonzero;"/>
+                <path d="M468.674,1610.75C464.413,1610.75 460.692,1610 457.51,1608.51C454.329,1607.02 451.867,1604.9 450.124,1602.16C448.381,1599.42 447.509,1596.2 447.509,1592.49L459.627,1592.49C459.627,1594.76 460.443,1596.57 462.075,1597.93C463.708,1599.28 465.907,1599.96 468.674,1599.96C471.385,1599.96 473.501,1599.31 475.023,1598.01C476.544,1596.71 477.305,1594.98 477.305,1592.82C477.305,1591.11 476.807,1589.57 475.811,1588.22C474.815,1586.86 473.349,1585.96 471.412,1585.52L464.026,1583.78C459.267,1582.67 455.491,1580.53 452.697,1577.34C449.902,1574.16 448.505,1570.36 448.505,1565.93C448.505,1560.51 450.262,1556.25 453.776,1553.15C457.289,1550.05 462.089,1548.5 468.176,1548.5C474.262,1548.5 479.104,1550.07 482.7,1553.19C486.297,1556.32 488.095,1560.54 488.095,1565.85L475.977,1565.85C475.977,1563.75 475.286,1562.1 473.902,1560.91C472.519,1559.72 470.61,1559.13 468.176,1559.13C465.796,1559.13 463.943,1559.71 462.615,1560.87C461.287,1562.03 460.623,1563.58 460.623,1565.52C460.623,1568.67 462.532,1570.69 466.35,1571.58L473.985,1573.32C478.744,1574.37 482.52,1576.65 485.314,1580.17C488.109,1583.68 489.506,1587.9 489.506,1592.82C489.506,1596.42 488.662,1599.57 486.974,1602.29C485.287,1605 482.88,1607.09 479.754,1608.55C476.627,1610.02 472.934,1610.75 468.674,1610.75Z" style="fill:rgb(255,223,93);fill-rule:nonzero;"/>
+                <path d="M498.884,1609.92L498.884,1549.33L518.389,1549.33C522.428,1549.33 525.955,1549.98 528.971,1551.28C531.986,1552.58 534.338,1554.4 536.026,1556.72C537.713,1559.04 538.557,1561.78 538.557,1564.94C538.557,1568.37 537.616,1571.23 535.735,1573.53C533.854,1575.82 531.419,1577.19 528.431,1577.63L528.431,1577.8C530.7,1578.02 532.706,1578.81 534.449,1580.17C536.192,1581.52 537.547,1583.25 538.516,1585.35C539.484,1587.46 539.968,1589.81 539.968,1592.41C539.968,1595.89 539.096,1598.95 537.354,1601.58C535.611,1604.21 533.176,1606.26 530.05,1607.72C526.924,1609.19 523.286,1609.92 519.136,1609.92L498.884,1609.92ZM510.919,1573.73L518.223,1573.73C520.657,1573.73 522.566,1573.08 523.95,1571.78C525.333,1570.48 526.024,1568.73 526.024,1566.51C526.024,1564.25 525.333,1562.49 523.95,1561.24C522.566,1560 520.657,1559.38 518.223,1559.38L510.919,1559.38L510.919,1573.73ZM510.919,1599.88L518.721,1599.88C521.432,1599.88 523.562,1599.16 525.111,1597.72C526.661,1596.28 527.435,1594.29 527.435,1591.74C527.435,1589.2 526.661,1587.19 525.111,1585.73C523.562,1584.26 521.432,1583.53 518.721,1583.53L510.919,1583.53L510.919,1599.88Z" style="fill:rgb(255,223,93);fill-rule:nonzero;"/>
+                <path d="M568.436,1610.75C564.397,1610.75 560.856,1609.99 557.812,1608.47C554.769,1606.95 552.404,1604.82 550.716,1602.08C549.028,1599.34 548.185,1596.14 548.185,1592.49L548.185,1566.76C548.185,1563.06 549.028,1559.85 550.716,1557.13C552.404,1554.42 554.769,1552.31 557.812,1550.79C560.856,1549.26 564.397,1548.5 568.436,1548.5C572.53,1548.5 576.085,1549.26 579.101,1550.79C582.117,1552.31 584.468,1554.42 586.156,1557.13C587.843,1559.85 588.687,1563.06 588.687,1566.76L576.238,1566.76C576.238,1564.33 575.56,1562.47 574.204,1561.2C572.849,1559.93 570.926,1559.29 568.436,1559.29C565.946,1559.29 564.023,1559.93 562.668,1561.2C561.312,1562.47 560.634,1564.33 560.634,1566.76L560.634,1592.49C560.634,1594.87 561.312,1596.71 562.668,1598.01C564.023,1599.31 565.946,1599.96 568.436,1599.96C570.926,1599.96 572.849,1599.31 574.204,1598.01C575.56,1596.71 576.238,1594.87 576.238,1592.49L576.238,1586.85L567.274,1586.85L567.274,1576.31L588.687,1576.31L588.687,1592.49C588.687,1596.14 587.843,1599.34 586.156,1602.08C584.468,1604.82 582.117,1606.95 579.101,1608.47C576.085,1609.99 572.53,1610.75 568.436,1610.75Z" style="fill:rgb(255,223,93);fill-rule:nonzero;"/>
+            </g>
+            <g transform="matrix(7.00985,0,0,7.22144,-7131.09,-10254.5)">
+                <path d="M669.769,1486.09L653.146,1486.09C650.059,1486.09 647.553,1483.59 647.553,1480.5C647.553,1477.41 650.059,1474.91 653.146,1474.91L669.769,1474.91L669.769,1467.32C669.769,1464.23 672.272,1461.73 675.361,1461.73L682.861,1461.73L682.861,1446.38C682.861,1443.29 685.367,1440.78 688.453,1440.78C691.54,1440.78 694.045,1443.29 694.045,1446.38L694.045,1461.73L706.877,1461.73L706.877,1446.38C706.877,1443.29 709.383,1440.78 712.469,1440.78C715.556,1440.78 718.061,1443.29 718.061,1446.38L718.061,1461.73L729.457,1461.73L729.457,1472.91L680.953,1472.91L680.953,1536.9L729.457,1536.9L729.457,1548.08L718.061,1548.08L718.061,1563.21C718.061,1566.3 715.556,1568.81 712.469,1568.81C709.383,1568.81 706.877,1566.3 706.877,1563.21L706.877,1548.08L694.045,1548.08L694.045,1563.21C694.045,1566.3 691.54,1568.81 688.453,1568.81C685.367,1568.81 682.861,1566.3 682.861,1563.21L682.861,1548.08L675.361,1548.08C672.272,1548.08 669.769,1545.58 669.769,1542.49L669.769,1535.26L653.146,1535.26C650.059,1535.26 647.553,1532.75 647.553,1529.67C647.553,1526.58 650.059,1524.07 653.146,1524.07L669.769,1524.07L669.769,1510.24L653.146,1510.24C650.059,1510.24 647.553,1507.74 647.553,1504.65C647.553,1501.56 650.059,1499.06 653.146,1499.06L669.769,1499.06L669.769,1486.09ZM688.387,1524.1C691.461,1524.1 693.957,1526.59 693.957,1529.67C693.957,1532.74 691.461,1535.24 688.387,1535.24C685.313,1535.24 682.817,1532.74 682.817,1529.67C682.817,1526.59 685.313,1524.1 688.387,1524.1Z" style="fill:rgb(255,223,93);"/>
+            </g>
+            <g id="Ebene1">
+            </g>
+        </g>
+    </g>
+</svg>
diff --git a/login/template.ftl b/login/template.ftl
new file mode 100644
index 0000000..161df5b
--- /dev/null
+++ b/login/template.ftl
@@ -0,0 +1,238 @@
+<#import "field.ftl" as field>
+<#import "footer.ftl" as loginFooter>
+<#macro username>
+  <#assign label>
+    <#if !realm.loginWithEmailAllowed>${msg("username")}<#elseif !realm.registrationEmailAsUsername>${msg("usernameOrEmail")}<#else>${msg("email")}</#if>
+  </#assign>
+  <@field.group name="username" label=label>
+    <div class="${properties.kcInputGroup}">
+      <div class="${properties.kcInputGroupItemClass} ${properties.kcFill}">
+        <span class="${properties.kcInputClass} ${properties.kcFormReadOnlyClass}">
+          <input id="kc-attempted-username" value="${auth.attemptedUsername}" readonly>
+        </span>
+      </div>
+      <div class="${properties.kcInputGroupItemClass}">
+        <button id="reset-login" class="${properties.kcFormPasswordVisibilityButtonClass} kc-login-tooltip" type="button" 
+              aria-label="${msg('restartLoginTooltip')}" onclick="location.href='${url.loginRestartFlowUrl}'">
+            <i class="fa-sync-alt fas" aria-hidden="true"></i>
+            <span class="kc-tooltip-text">${msg("restartLoginTooltip")}</span>
+        </button>
+      </div>
+    </@field.group>
+</#macro>
+
+<#macro registrationLayout bodyClass="" displayInfo=false displayMessage=true displayRequiredFields=false>
+<!DOCTYPE html>
+<html class="${properties.kcHtmlClass!}" lang="${lang}"<#if realm.internationalizationEnabled> dir="${(locale.rtl)?then('rtl','ltr')}"</#if>>
+
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+    <meta name="robots" content="noindex, nofollow">
+    <meta name="color-scheme" content="light${darkMode?then(' dark', '')}">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <#if properties.meta?has_content>
+        <#list properties.meta?split(' ') as meta>
+            <meta name="${meta?split('==')[0]}" content="${meta?split('==')[1]}"/>
+        </#list>
+    </#if>
+    <title>${msg("loginTitle",(realm.displayName!''))}</title>
+    <link rel="icon" href="${url.resourcesPath}/img/favicon.ico" />
+    <#if properties.stylesCommon?has_content>
+        <#list properties.stylesCommon?split(' ') as style>
+            <link href="${url.resourcesCommonPath}/${style}" rel="stylesheet" />
+        </#list>
+    </#if>
+    <#if properties.styles?has_content>
+        <#list properties.styles?split(' ') as style>
+            <link href="${url.resourcesPath}/${style}" rel="stylesheet" />
+        </#list>
+    </#if>
+    <script type="importmap">
+        {
+            "imports": {
+                "rfc4648": "${url.resourcesCommonPath}/vendor/rfc4648/rfc4648.js"
+            }
+        }
+    </script>
+    <#if darkMode>
+      <script type="module" async blocking="render">
+          const DARK_MODE_CLASS = "${properties.kcDarkModeClass}";
+          const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+
+          updateDarkMode(mediaQuery.matches);
+          mediaQuery.addEventListener("change", (event) => updateDarkMode(event.matches));
+
+          function updateDarkMode(isEnabled) {
+            const { classList } = document.documentElement;
+
+            if (isEnabled) {
+              classList.add(DARK_MODE_CLASS);
+            } else {
+              classList.remove(DARK_MODE_CLASS);
+            }
+          }
+      </script>
+    </#if>
+    <#if properties.scripts?has_content>
+        <#list properties.scripts?split(' ') as script>
+            <script src="${url.resourcesPath}/${script}" type="text/javascript"></script>
+        </#list>
+    </#if>
+    <#if scripts??>
+        <#list scripts as script>
+            <script src="${script}" type="text/javascript"></script>
+        </#list>
+    </#if>
+    <script type="module" src="${url.resourcesPath}/js/passwordVisibility.js"></script>
+    <script type="module">
+        import { startSessionPolling } from "${url.resourcesPath}/js/authChecker.js";
+
+        startSessionPolling(
+            "${url.ssoLoginInOtherTabsUrl?no_esc}"
+        );
+    </script>
+    <#if authenticationSession??>
+        <script type="module">
+            import { checkAuthSession } from "${url.resourcesPath}/js/authChecker.js";
+
+            checkAuthSession(
+                "${authenticationSession.authSessionIdHash}"
+            );
+        </script>
+    </#if>
+    <script>
+      // Workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=1404468
+      const isFirefox = true;
+    </script>
+</head>
+
+<body id="keycloak-bg" class="${properties.kcBodyClass!}">
+<div class="${properties.kcLogin!}">
+  <div class="${properties.kcLoginContainer!}">
+    <header id="kc-header" class="pf-v5-c-login__header">
+      <div id="kc-header-wrapper"
+              class="pf-v5-c-brand">${kcSanitize(msg("loginTitleHtml",(realm.displayNameHtml!'')))?no_esc}</div>
+    </header>
+    <main class="${properties.kcLoginMain!}">
+      <div class="${properties.kcLoginMainHeader!}">
+        <div class="cccsbg-logo">
+        </div>
+        <h1 class="${properties.kcLoginMainTitle!}" id="kc-page-title"><#nested "header"></h1>
+        <#if realm.internationalizationEnabled  && locale.supported?size gt 1>
+        <div class="${properties.kcLoginMainHeaderUtilities!}">
+          <div class="${properties.kcInputClass!}">
+            <select
+              aria-label="${msg("languages")}"
+              id="login-select-toggle"
+              onchange="if (this.value) window.location.href=this.value"
+            >
+              <#list locale.supported?sort_by("label") as l>
+                <option
+                  value="${l.url}"
+                  ${(l.languageTag == locale.currentLanguageTag)?then('selected','')}
+                >
+                  ${l.label}
+                </option>
+              </#list>
+            </select>
+            <span class="${properties.kcFormControlUtilClass}">
+              <span class="${properties.kcFormControlToggleIcon!}">
+                <svg
+                  class="pf-v5-svg"
+                  viewBox="0 0 320 512"
+                  fill="currentColor"
+                  aria-hidden="true"
+                  role="img"
+                  width="1em"
+                  height="1em"
+                >
+                  <path
+                    d="M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z"
+                  >
+                  </path>
+                </svg>
+              </span>
+            </span>
+          </div>
+        </div>
+        </#if>
+      </div>
+      <div class="${properties.kcLoginMainBody!}">
+        <#if !(auth?has_content && auth.showUsername() && !auth.showResetCredentials())>
+            <#if displayRequiredFields>
+                <div class="${properties.kcContentWrapperClass!}">
+                    <div class="${properties.kcLabelWrapperClass!} subtitle">
+                        <span class="${properties.kcInputHelperTextItemTextClass!}">
+                          <span class="${properties.kcInputRequiredClass!}">*</span> ${msg("requiredFields")}
+                        </span>
+                    </div>
+                </div>
+            </#if>
+        <#else>
+            <#if displayRequiredFields>
+                <div class="${properties.kcContentWrapperClass!}">
+                    <div class="${properties.kcLabelWrapperClass!} subtitle">
+                        <span class="${properties.kcInputHelperTextItemTextClass!}">
+                          <span class="${properties.kcInputRequiredClass!}">*</span> ${msg("requiredFields")}
+                        </span>
+                    </div>
+                    <div class="${properties.kcFormClass} ${properties.kcContentWrapperClass}">
+                        <#nested "show-username">
+                        <@username />
+                    </div>
+                </div>
+            <#else>
+                <div class="${properties.kcFormClass} ${properties.kcContentWrapperClass}">
+                  <#nested "show-username">
+                  <@username />
+                </div>
+            </#if>
+        </#if>
+
+        <#-- App-initiated actions should not see warning messages about the need to complete the action -->
+        <#-- during login.                                                                               -->
+        <#if displayMessage && message?has_content && (message.type != 'warning' || !isAppInitiatedAction??)>
+            <div class="${properties.kcAlertClass!} pf-m-${(message.type = 'error')?then('danger', message.type)}">
+                <div class="${properties.kcAlertIconClass!}">
+                    <#if message.type = 'success'><span class="${properties.kcFeedbackSuccessIcon!}"></span></#if>
+                    <#if message.type = 'warning'><span class="${properties.kcFeedbackWarningIcon!}"></span></#if>
+                    <#if message.type = 'error'><span class="${properties.kcFeedbackErrorIcon!}"></span></#if>
+                    <#if message.type = 'info'><span class="${properties.kcFeedbackInfoIcon!}"></span></#if>
+                </div>
+                <span class="${properties.kcAlertTitleClass!} kc-feedback-text">${kcSanitize(message.summary)?no_esc}</span>
+            </div>
+        </#if>
+
+        <#nested "form">
+
+        <#if auth?has_content && auth.showTryAnotherWayLink()>
+          <form id="kc-select-try-another-way-form" action="${url.loginAction}" method="post" novalidate="novalidate">
+              <input type="hidden" name="tryAnotherWay" value="on"/>
+              <a id="try-another-way" href="javascript:document.forms['kc-select-try-another-way-form'].requestSubmit()"
+                  class="${properties.kcButtonSecondaryClass} ${properties.kcButtonBlockClass} ${properties.kcMarginTopClass}">
+                    ${kcSanitize(msg("doTryAnotherWay"))?no_esc}
+              </a>
+          </form>
+        </#if>
+
+        <#if displayInfo>
+          <div id="kc-info" class="${properties.kcSignUpClass!}">
+              <div id="kc-info-wrapper" class="${properties.kcInfoAreaWrapperClass!}">
+                  <#nested "info">
+              </div>
+          </div>
+        </#if>
+      </div>
+      <div class="pf-v5-c-login__main-footer">
+        <#nested "socialProviders">
+      </div>
+    </main>
+
+    <@loginFooter.content/>
+  </div>
+</div>
+</body>
+</html>
+</#macro>
diff --git a/login/theme.properties b/login/theme.properties
new file mode 100644
index 0000000..5ef5858
--- /dev/null
+++ b/login/theme.properties
@@ -0,0 +1,4 @@
+parent=keycloak.v2
+import=common/keycloak
+styles=css/styles.css
+logo=/img/logo.svg
\ No newline at end of file