feat: Allow to use lineawesome icon pack (close #9)

fix: Login Template and Social Providers conditions (close #8)
kalisio · Jun 6, 2024 · ccae5a8 · ccae5a8
1 parent 112b3ea
commit ccae5a8
Show file tree

Hide file tree

Showing 7 changed files with 26 additions and 21 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+# local customization
+extension.yml
diff --git a/docker-compose.yml b/docker-compose.yml
@@ -24,7 +24,6 @@ services:
       volumes:
         - ./themes/kdk:/opt/keycloak/themes/kdk      
         - ./themes/kapp:/opt/keycloak/themes/kapp
-        #- ${IRSN_DEVELOPMENT_DIR}/opal-keycloak-theme/theme:/opt/keycloak/themes/opal
       ports:
         - 8080:8080
       depends_on:

diff --git a/themes/kdk/login/login-reset-password.ftl b/themes/kdk/login/login-reset-password.ftl
@@ -30,7 +30,7 @@
         </div>
         <!-- back to login actions -->
         <div>
-          <q-btn label="${kcSanitize(msg('backToLogin'))?no_esc}" color="accent" flat rounded no-caps href="${url.loginUrl}" />
+          <q-btn icon="las la-arrow-left" label="${kcSanitize(msg('backToLogin'))?no_esc}" color="accent" flat rounded no-caps href="${url.loginUrl}" />
         </div>
       </div>
     </q-form>

diff --git a/themes/kdk/login/resources/html/data-policy_en.html b/themes/kdk/login/resources/html/data-policy_en.html
@@ -0,0 +1,3 @@
+<div class="q-pb-md caption-text">Updated at 01/01/2024</div>
+  TODO
+</div>
diff --git a/themes/kdk/login/resources/html/data-policy_fr.html b/themes/kdk/login/resources/html/data-policy_fr.html
@@ -0,0 +1,3 @@
+<div class="q-pb-md caption-text">Updated at 01/01/2024</div>
+  A FAIRE
+</div>
diff --git a/themes/kdk/login/resources/js/quasar.js b/themes/kdk/login/resources/js/quasar.js
@@ -3,14 +3,6 @@
   see https://quasar.dev/start/umd/#quasar-config-object
 */ 
 
-// Override locale
-const appLocale = Quasar.lang.getLocale().substring(0, 2)
-const kcLocale = Quasar.Cookies.get('KEYCLOAK_LOCALE')
-if (appLocale !== kcLocale) {
-  Quasar.Cookies.set('KEYCLOAK_LOCALE', appLocale)
-  location.reload()
-}
-
 // Create the Vue app
 const app = Vue.createApp({
   setup () {

diff --git a/themes/kdk/login/template.ftl b/themes/kdk/login/template.ftl
@@ -1,9 +1,10 @@
 <#macro registrationLayout bodyClass="" displayInfo=false displayMessage=true displayRequiredFields=false>
 <!DOCTYPE html>
-<html <#if realm.internationalizationEnabled> lang="${locale.currentLanguageTag}"</#if>>
+<html <#if realm.internationalizationEnabled>lang="${locale.currentLanguageTag}"</#if>>
 
 <head>
   <link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons" rel="stylesheet" type="text/css">
+  <link href= "https://maxst.icons8.com/vue-static/landings/line-awesome/line-awesome/1.3.0/css/line-awesome.min.css" rel= "stylesheet" type="text/css">
   <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/quasar.prod.css" rel="stylesheet" type="text/css">
   <meta charset="utf-8">
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
@@ -45,7 +46,7 @@
       <!-- 
         Content 
       -->
-      <div class="row justify-center" style="max-width: 500px;"> 
+      <div class="row justify-center" style="min-width: 320px; width: 75%; max-width: 540px"> 
         <q-card class="full-width bg-white column justify-center">
           <!-- banner -->
           <div>
@@ -56,9 +57,7 @@
             <#nested "form">
           </div>
           <!-- social providers -->
-          <#if social.providers??>
-            <#nested "socialProviders">
-          </#if>
+          <#nested "socialProviders">
         </q-card>
         <!-- global options -->
         <div :class="{ 'q-pt-xs': $q.screen.xs, 'q-pt-sm': $q.screen.gt.xs }">
@@ -78,6 +77,10 @@
   -->
   <script id="environment" type="application/json">
     {
+      "i18n": {
+        "enabled": <#if realm.internationalizationEnabled>true<#else>false</#if>,
+        "language": <#if realm.internationalizationEnabled>"${locale.currentLanguageTag}"<#else>null</#if>
+      },
       "permissions": {
         "rememberMe": <#if realm.rememberMe>true<#else>false</#if>
       },
@@ -95,14 +98,17 @@
   -->
   <script src="https://cdn.jsdelivr.net/npm/vue@3/dist/vue.global.prod.js"></script>
   <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/quasar.umd.prod.js"></script>
+  <!-- Install Quasar language pack -->
+  <#if realm.internationalizationEnabled>
+    <#if properties.locales?has_content>
+      <#list properties.locales?split(',') as locale>
+        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/lang/${locale}.umd.prod.js"></script>
+      </#list>      
+    </#if>
+    <script>Quasar.lang.set(Quasar.lang.${locale.currentLanguageTag})</script>
+  </#if>
   <script src="${url.resourcesPath}/js/config.js"></script>  
   <script src="${url.resourcesPath}/js/quasar.js"></script>
-  <!-- Install Quasar language pack -->
-  <#if properties.locales?has_content>
-    <#list properties.locales?split(',') as locale>
-      <script>Quasar.lang.set(Quasar.lang.${locale})</script>
-    </#list>      
-  </#if> 
 </body>
 </html>
 </#macro>