Merge pull request #127 from MadhuMosip/MOSIP-32336

MOSIP-34259 compressed background image size
mosip · Jul 4, 2024 · b9a2b11 · b9a2b11
2 parents 6680f2b + a4e6571
commit b9a2b11
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 11 deletions.
diff --git a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/Template.tsx b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/Template.tsx
@@ -62,7 +62,7 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
 
     return (
         <div className={(getClassName("kcLoginClass"))} dir={currentLanguageTag === 'ar' ? 'rtl' : 'ltr'}>
-            <div id="kc-header" className={(getClassName("kcHeaderClass"), 'mb-10 flex flex-row justify-between items-center px-10')}>
+            <div id="kc-header" className={(getClassName("kcHeaderClass"), 'mb-10 flex flex-row justify-between items-center px-20')}>
                 <div><img className="h-20 w-30" alt="logo" src={mosipLogo} /></div>
                 <div> {realm.internationalizationEnabled && (assert(locale !== undefined), true) && locale.supported.length > 1 && (
                     <div id="kc-locale">
@@ -74,7 +74,7 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
                                 </a>
                                 {!isLocaleOpen && <img alt="" src={polygon} />}
                                 {isLocaleOpen && <img alt="" src={polygonRev} />}
-                                {isLocaleOpen && (<div className={`max-h-[400px] min-w-[200px] bg-white overflow-auto rounded-xl lang-dropDown font-inter ${currentLanguageTag === 'ar' ? 'mr-[-140px]' : 'ml-[-110px]'}`}>
+                                {isLocaleOpen && (<div className={`max-h-[400px] min-w-[200px] bg-white overflow-auto rounded-xl lang-dropDown font-inter shadow-langShadow ${currentLanguageTag === 'ar' ? 'mr-[-140px]' : 'ml-[-130px]'}`}>
                                     <>
                                         <span className="text-[#0D3077] text-xl font-bold px-[14px] py-[10px] flex content-center justify-between">
                                             <span>{labelBySupportedLanguageTag[currentLanguageTag]}</span>

diff --git a/...temis/mosip_keycloak_theme/src/keycloak-theme/login/assets/mosip_keycloakbg.png b/...temis/mosip_keycloak_theme/src/keycloak-theme/login/assets/mosip_keycloakbg.png
diff --git a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/i18n.ts b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/i18n.ts
@@ -74,7 +74,13 @@ export const { useI18n } = createUseI18n({
         lastName: "Last Name",
         phoneNumber: "Phone Number",
         invalidUserName: "Username does not meet the minimum requirements.",
-        userNamePolicy: "Alphanumeric characters and symbols ( _ ) are allowed. First character should be always a letter."
+        userNamePolicy: "Alphanumeric characters and symbols ( _ ) are allowed. First character should be always a letter.",
+        locale_hin: "हिंदी",
+        locale_tam: "தமிழ்",
+        locale_kan: "ಕನ್ನಡ",
+        doForgotPassword: "Forgot Password?",
+        password: "Password",
+        doRegister: "Register"
     },
     fr: {
         /* spell-checker: disable */
@@ -144,14 +150,18 @@ export const { useI18n } = createUseI18n({
         lastName: "Nom de famille",
         phoneNumber: "Numéro de téléphone",
         invalidUserName: "Le nom d'utilisateur ne répond pas aux exigences minimales.",
-        userNamePolicy: "Les caractères alphanumériques et les symboles ( _ ) sont autorisés. Le premier caractère doit toujours être une lettre."
+        userNamePolicy: "Les caractères alphanumériques et les symboles ( _ ) sont autorisés. Le premier caractère doit toujours être une lettre.",
+        locale_hin: "हिंदी",
+        locale_tam: "தமிழ்",
+        locale_kan: "ಕನ್ನಡ",
+        doForgotPassword: "Mot de passe oublié?",
+        password: "Mot de passe",
+        doRegister: "Registre"
         /* spell-checker: enable */
     },
     ar: {
         alphanumericalCharsOnly: "الحروف الأبجدية الرقمية فقط",
         gender: "جنس",
-        // Here we overwrite the default english value for the message "doForgotPassword"
-        // that is "Forgot Password?" see: https://github.com/InseeFrLab/keycloakify/blob/f0ae5ea908e0aa42391af323b6d5e2fd371af851/src/lib/i18n/generated_messages/18.0.1/login/en.ts#L17
         invalidUserMessage: "خطأ في اسم المستخدم أو كلمة مرور.",
         usernameOrEmail: "اسم المستخدم",
         doLogIn: "تسجيل الدخول",
@@ -216,7 +226,13 @@ export const { useI18n } = createUseI18n({
         lastName: "اسم العائلة",
         phoneNumber: "رقم التليفون",
         invalidUserName: "اسم المستخدم لا يلبي الحد الأدنى من المتطلبات.",
-        userNamePolicy: "يُسمح باستخدام الأحرف الأبجدية الرقمية والرموز (_). يجب أن يكون الحرف الأول دائمًا حرفًا."
+        userNamePolicy: "يُسمح باستخدام الأحرف الأبجدية الرقمية والرموز (_). يجب أن يكون الحرف الأول دائمًا حرفًا.",
+        locale_hin: "हिंदी",
+        locale_tam: "தமிழ்",
+        locale_kan: "ಕನ್ನಡ",
+        doForgotPassword: "هل نسيت كلمة السر؟",
+        password: "كلمة المرور",
+        doRegister: "يسجل"
     },
     hin: {
         alphanumericalCharsOnly: "केवल अक्षरांकीय वर्ण",
@@ -285,7 +301,13 @@ export const { useI18n } = createUseI18n({
         lastName: "अंतिम नाम",
         phoneNumber: "फोन नंबर",
         invalidUserName: "उपयोगकर्ता नाम न्यूनतम आवश्यकताओं को पूरा नहीं करता है।",
-        userNamePolicy: "अल्फ़ान्यूमेरिक वर्ण और प्रतीक ( _ ) की अनुमति है। पहला अक्षर हमेशा एक अक्षर होना चाहिए।"
+        userNamePolicy: "अल्फ़ान्यूमेरिक वर्ण और प्रतीक ( _ ) की अनुमति है। पहला अक्षर हमेशा एक अक्षर होना चाहिए।",
+        locale_hin: "हिंदी",
+        locale_tam: "தமிழ்",
+        locale_kan: "ಕನ್ನಡ",
+        doForgotPassword: "पासवर्ड भूल गए?",
+        password: "पासवर्ड",
+        doRegister: "पंजीकरण करवाना"
     },
     tam: {
         alphanumericalCharsOnly: "எழுத்தெண்கள் மட்டுமே",
@@ -354,7 +376,13 @@ export const { useI18n } = createUseI18n({
         lastName: "கடைசிப்பெயர்",
         phoneNumber: "தொலைபேசி எண்",
         invalidUserName: "பயனர் பெயர் குறைந்தபட்ச தேவைகளை பூர்த்தி செய்யவில்லை.",
-        userNamePolicy: "எழுத்தெண்கள் மற்றும் சின்னங்கள் ( _ ) அனுமதிக்கப்படும். முதல் எழுத்து எப்போதும் ஒரு எழுத்தாக இருக்க வேண்டும்."
+        userNamePolicy: "எழுத்தெண்கள் மற்றும் சின்னங்கள் ( _ ) அனுமதிக்கப்படும். முதல் எழுத்து எப்போதும் ஒரு எழுத்தாக இருக்க வேண்டும்.",
+        locale_hin: "हिंदी",
+        locale_tam: "தமிழ்",
+        locale_kan: "ಕನ್ನಡ",
+        doForgotPassword: "கடவுச்சொல்லை மறந்துவிட்டீர்களா?",
+        password: "கடவுச்சொல்",
+        doRegister: "பதிவு"
     },
     kan:{
         alphanumericalCharsOnly: "ಅಕ್ಷರಾಂಕ ಲಕ್ಷಣಗಳು ಮಾತ್ರ",
@@ -423,7 +451,13 @@ export const { useI18n } = createUseI18n({
         lastName: "ಕೊನೆಯ ಹೆಸರು",
         phoneNumber: "ದೂರವಾಣಿ ಸಂಖ್ಯೆ",
         invalidUserName: "ಬಳಕೆದಾರ ಹೆಸರು ಕನಿಷ್ಠ ಅಗತ್ಯಗಳನ್ನು ಪೂರೈಸುತ್ತಿಲ್ಲ.",
-        userNamePolicy: "ಅಕ್ಷರಾಂಕ ಅಕ್ಷರಗಳು ಮತ್ತು ಸಂಕೇತಗಳು ( _ ) ಅನುಮತಿಸಲಾಗಿದೆ. ಮೊದಲ ಅಕ್ಷರ ಯಾವಾಗಲೂ ಒಂದು ಅಕ್ಷರವಾಗಿರಬೇಕು."
+        userNamePolicy: "ಅಕ್ಷರಾಂಕ ಅಕ್ಷರಗಳು ಮತ್ತು ಸಂಕೇತಗಳು ( _ ) ಅನುಮತಿಸಲಾಗಿದೆ. ಮೊದಲ ಅಕ್ಷರ ಯಾವಾಗಲೂ ಒಂದು ಅಕ್ಷರವಾಗಿರಬೇಕು.",
+        locale_hin: "हिंदी",
+        locale_tam: "தமிழ்",
+        locale_kan: "ಕನ್ನಡ",
+        doForgotPassword: "ಪಾಸ್ವರ್ಡ್ ಮರೆತಿರಾ?",
+        password: "ಗುಪ್ತಪದ",
+        doRegister: "ನೋಂದಣಿ"
     }
 
 });

diff --git a/keycloak-artemis/mosip_keycloak_theme/tailwind.config.js b/keycloak-artemis/mosip_keycloak_theme/tailwind.config.js
@@ -14,7 +14,8 @@ export default {
       },
       boxShadow: {
         errorShadow: '0px 3px 6px rgba(255, 0, 0, 0.15)',
-        errorShadowTwo: '0px 0px 6px rgba(255, 0, 0, 0.15)'
+        errorShadowTwo: '0px 0px 6px rgba(255, 0, 0, 0.15)',
+        langShadow: '5px 3px 4px #0000000F'
       },
       fontFamily: {
         'inter': ['Inter', 'sans-serif'],