mirror of
https://github.com/QwIT-Development/firka-extension.git
synced 2026-06-12 03:41:39 +02:00
Profile page rework
This commit is contained in:
Zan
@@ -186,5 +186,6 @@
|
||||
{ code: "en", name: "English" },
|
||||
{ code: "de", name: "Deutsch" },
|
||||
],
|
||||
init: initializeLanguage,
|
||||
};
|
||||
})();
|
||||
|
||||
@@ -197,7 +197,7 @@
|
||||
}
|
||||
|
||||
.dropdown-item:hover img {
|
||||
filter: none;
|
||||
filter: brightness(0) saturate(100%) invert(25%) sepia(50%) saturate(2000%) hue-rotate(90deg) brightness(90%) contrast(95%);
|
||||
}
|
||||
|
||||
@keyframes dropdownShow {
|
||||
@@ -418,7 +418,7 @@
|
||||
}
|
||||
|
||||
.mobile-dropdown-item:hover img {
|
||||
filter: none;
|
||||
filter: brightness(0) saturate(100%) invert(25%) sepia(50%) saturate(2000%) hue-rotate(90deg) brightness(90%) contrast(95%);
|
||||
}
|
||||
|
||||
body {
|
||||
|
||||
39
i18n/de.json
39
i18n/de.json
@@ -278,10 +278,23 @@
|
||||
"school": "Schule",
|
||||
"student_id": "Schüler-ID",
|
||||
"settings_title": "Profileinstellungen",
|
||||
"tab_my_data": "Meine Daten",
|
||||
"tab_settings": "Einstellungen",
|
||||
"tab_password": "Passwort ändern",
|
||||
"tab_security": "Sicherheitseinstellungen",
|
||||
"tab_contacts": "Kontakte",
|
||||
"loading_data": "Daten werden geladen...",
|
||||
"loading_error": "Fehler beim Laden der Daten.",
|
||||
"my_data_title": "Meine persönlichen Daten",
|
||||
"personal_data": "Persönliche Daten",
|
||||
"contact_data": "Kontaktdaten",
|
||||
"address_data": "Adressdaten",
|
||||
"bank_account_data": "Bankverbindung",
|
||||
"student_card_data": "Schülerausweis Daten",
|
||||
"default_address": "Standard",
|
||||
"password_change_unavailable": "Die Passwortänderungsfunktion ist derzeit nicht verfügbar.",
|
||||
"security_settings_info": "Um Sicherheitseinstellungen zu verwalten, klicken Sie auf die Schaltfläche unten:",
|
||||
"open_security_settings": "Sicherheitseinstellungen öffnen",
|
||||
"two_factor_description": "Um die Zwei-Faktor-Authentifizierung zu verwenden, installieren Sie eine zeitbasierte Einmalpasswort-App (TOTP):",
|
||||
"android": "Android",
|
||||
"iphone": "iPhone",
|
||||
@@ -315,7 +328,31 @@
|
||||
"passwords_not_match": "Die neuen Passwörter stimmen nicht überein!",
|
||||
"password_too_short": "Das neue Passwort muss mindestens 8 Zeichen lang sein!",
|
||||
"password_changed": "Passwort erfolgreich geändert!",
|
||||
"password_change_error": "Fehler beim Ändern des Passworts. Bitte versuchen Sie es später erneut."
|
||||
"password_change_error": "Fehler beim Ändern des Passworts. Bitte versuchen Sie es später erneut.",
|
||||
"field_familyName": "Familienname",
|
||||
"field_firstName": "Vorname",
|
||||
"field_birthFamilyName": "Geburts-Familienname",
|
||||
"field_birthFirstName": "Geburts-Vorname",
|
||||
"field_motherFamilyName": "Geburts-Familienname der Mutter",
|
||||
"field_motherFirstName": "Geburts-Vorname der Mutter",
|
||||
"field_birthDate": "Geburtsdatum",
|
||||
"field_birthPlace": "Geburtsort",
|
||||
"field_birthCountry": "Geburtsland",
|
||||
"field_motherTongue": "Muttersprache",
|
||||
"field_citizenship": "Staatsangehörigkeit",
|
||||
"field_classTeacher": "Klassenlehrer",
|
||||
"field_className": "Klasse",
|
||||
"field_classroom": "Klassenzimmer",
|
||||
"field_username": "Benutzername",
|
||||
"field_phone": "Telefonnummer",
|
||||
"field_email": "Benachrichtigungs-E-Mail-Adresse",
|
||||
"field_accountNumber": "Bankkontonummer",
|
||||
"field_bankName": "Bankname",
|
||||
"field_accountOwner": "Kontoinhaber",
|
||||
"field_cardNumber": "Kartennummer",
|
||||
"field_taxId": "Steuer-ID",
|
||||
"field_studentCardNumber": "Studentenausweisnummer",
|
||||
"field_socialSecurityNumber": "Sozialversicherungsnummer"
|
||||
},
|
||||
"login": {
|
||||
"title": "Anmelden",
|
||||
|
||||
39
i18n/en.json
39
i18n/en.json
@@ -278,10 +278,23 @@
|
||||
"school": "School",
|
||||
"student_id": "Student ID",
|
||||
"settings_title": "Profile settings",
|
||||
"tab_my_data": "My Data",
|
||||
"tab_settings": "Settings",
|
||||
"tab_password": "Change password",
|
||||
"tab_security": "Security settings",
|
||||
"tab_contacts": "Contact information",
|
||||
"loading_data": "Loading data...",
|
||||
"loading_error": "An error occurred while loading the data.",
|
||||
"my_data_title": "My Personal Data",
|
||||
"personal_data": "Personal Information",
|
||||
"contact_data": "Contact Information",
|
||||
"address_data": "Address Data",
|
||||
"bank_account_data": "Bank Account Data",
|
||||
"student_card_data": "Student Card Data",
|
||||
"default_address": "Default",
|
||||
"password_change_unavailable": "The password change function is currently unavailable.",
|
||||
"security_settings_info": "To manage security settings, click the button below:",
|
||||
"open_security_settings": "Open Security Settings",
|
||||
"two_factor_description": "To use two-factor authentication, install a time-based one-time password (TOTP) application:",
|
||||
"android": "Android",
|
||||
"iphone": "iPhone",
|
||||
@@ -315,7 +328,31 @@
|
||||
"passwords_not_match": "New passwords do not match!",
|
||||
"password_too_short": "New password must be at least 8 characters long!",
|
||||
"password_changed": "Password changed successfully!",
|
||||
"password_change_error": "An error occurred while changing password. Please try again later."
|
||||
"password_change_error": "An error occurred while changing password. Please try again later.",
|
||||
"field_familyName": "Family name",
|
||||
"field_firstName": "First name",
|
||||
"field_birthFamilyName": "Birth family name",
|
||||
"field_birthFirstName": "Birth first name",
|
||||
"field_motherFamilyName": "Mother's birth family name",
|
||||
"field_motherFirstName": "Mother's birth first name",
|
||||
"field_birthDate": "Date of birth",
|
||||
"field_birthPlace": "Place of birth",
|
||||
"field_birthCountry": "Country of birth",
|
||||
"field_motherTongue": "Mother tongue",
|
||||
"field_citizenship": "Citizenship",
|
||||
"field_classTeacher": "Class teacher",
|
||||
"field_className": "Class",
|
||||
"field_classroom": "Classroom",
|
||||
"field_username": "Username",
|
||||
"field_phone": "Phone number",
|
||||
"field_email": "Notification email address",
|
||||
"field_accountNumber": "Bank account number",
|
||||
"field_bankName": "Bank name",
|
||||
"field_accountOwner": "Account owner's name",
|
||||
"field_cardNumber": "Card number",
|
||||
"field_taxId": "Tax ID",
|
||||
"field_studentCardNumber": "Student card number",
|
||||
"field_socialSecurityNumber": "Social security number"
|
||||
},
|
||||
"login": {
|
||||
"title": "Login",
|
||||
|
||||
39
i18n/hu.json
39
i18n/hu.json
@@ -280,10 +280,23 @@
|
||||
"school": "Iskola",
|
||||
"student_id": "Diák azonosító",
|
||||
"settings_title": "Profil beállítások",
|
||||
"tab_my_data": "Adataim",
|
||||
"tab_settings": "Beállítások",
|
||||
"tab_password": "Jelszó módosítása",
|
||||
"tab_security": "Biztonsági beállítások",
|
||||
"tab_contacts": "Elérhetőségek",
|
||||
"loading_data": "Adatok betöltése...",
|
||||
"loading_error": "Hiba történt az adatok betöltése során.",
|
||||
"my_data_title": "Személyes adataim",
|
||||
"personal_data": "Személyes adatok",
|
||||
"contact_data": "Elérhetőségi adatok",
|
||||
"address_data": "Lakcím adatok",
|
||||
"bank_account_data": "Bankszámla adatok",
|
||||
"student_card_data": "Tanulói igazolvány adatok",
|
||||
"default_address": "Alapértelmezett",
|
||||
"password_change_unavailable": "A jelszó módosítás funkció jelenleg nem érhető el.",
|
||||
"security_settings_info": "A biztonsági beállítások kezeléséhez kattints az alábbi gombra:",
|
||||
"open_security_settings": "Biztonsági beállítások megnyitása",
|
||||
"two_factor_description": "A kétfaktoros hitelesítés használatához telepítsen egy időalapú, egyszer használatos jelszó (TOTP) alkalmazást:",
|
||||
"android": "Android",
|
||||
"iphone": "iPhone",
|
||||
@@ -317,7 +330,31 @@
|
||||
"passwords_not_match": "Az új jelszavak nem egyeznek!",
|
||||
"password_too_short": "Az új jelszónak legalább 8 karakter hosszúnak kell lennie!",
|
||||
"password_changed": "Jelszó sikeresen módosítva!",
|
||||
"password_change_error": "Hiba történt a jelszó módosítása során. Kérjük, próbálja újra később."
|
||||
"password_change_error": "Hiba történt a jelszó módosítása során. Kérjük, próbálja újra később.",
|
||||
"field_familyName": "Családi név",
|
||||
"field_firstName": "Utónév",
|
||||
"field_birthFamilyName": "Születési családi név",
|
||||
"field_birthFirstName": "Születési utónév",
|
||||
"field_motherFamilyName": "Anyja születési családi neve",
|
||||
"field_motherFirstName": "Anyja születési utóneve",
|
||||
"field_birthDate": "Születési idő",
|
||||
"field_birthPlace": "Születési hely",
|
||||
"field_birthCountry": "Születési ország",
|
||||
"field_motherTongue": "Anyanyelv",
|
||||
"field_citizenship": "Állampolgárság",
|
||||
"field_classTeacher": "Osztályfőnök",
|
||||
"field_className": "Osztály",
|
||||
"field_classroom": "Terem",
|
||||
"field_username": "Felhasználónév",
|
||||
"field_phone": "Telefonszám",
|
||||
"field_email": "Értesítési e-mail cím",
|
||||
"field_accountNumber": "Bankszámlaszám",
|
||||
"field_bankName": "Számlavezető bank",
|
||||
"field_accountOwner": "Bankszámla tulajdonos neve",
|
||||
"field_cardNumber": "Igazolvány száma",
|
||||
"field_taxId": "Adóazonosító jel",
|
||||
"field_studentCardNumber": "Diákigazolvány szám",
|
||||
"field_socialSecurityNumber": "TAJ-szám"
|
||||
},
|
||||
"login": {
|
||||
"title": "Bejelentkezés",
|
||||
|
||||
@@ -1 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none"><g fill-rule="evenodd" clip-rule="evenodd" fill="currentColor" stroke="currentColor" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="8" r="5" fill="currentColor"/><path d="M20 21a8 8 0 1 0-16 0"/></g></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="3 2 22 24" fill="none"><g fill-rule="evenodd" clip-rule="evenodd" fill="currentColor" stroke="currentColor" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"><circle cx="14" cy="9" r="5" fill="currentColor"/><path d="M22 22a8 8 0 1 0-16 0"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 343 B After Width: | Height: | Size: 343 B |
@@ -1 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none"><path fill="currentColor" fill-rule="evenodd" d="M9.024 2.783A1 1 0 0 1 10 2h4a1 1 0 0 1 .976.783l.44 1.981q.6.285 1.14.66l1.938-.61a1 1 0 0 1 1.166.454l2 3.464a1 1 0 0 1-.19 1.237l-1.497 1.373a8 8 0 0 1 0 1.316l1.497 1.373a1 1 0 0 1 .19 1.237l-2 3.464a1 1 0 0 1-1.166.454l-1.937-.61q-.54.375-1.14.66l-.44 1.98A1 1 0 0 1 14 22h-4a1 1 0 0 1-.976-.783l-.44-1.981q-.6-.285-1.14-.66l-1.938.61a1 1 0 0 1-1.166-.454l-2-3.464a1 1 0 0 1 .19-1.237l1.497-1.373a8 8 0 0 1 0-1.316L2.53 9.97a1 1 0 0 1-.19-1.237l2-3.464a1 1 0 0 1 1.166-.454l1.937.61q.54-.375 1.14-.66l.44-1.98zM12 15a3 3 0 1 0 0-6a3 3 0 0 0 0 6" clip-rule="evenodd"/></svg>
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="2 2 24 24" fill="none">
|
||||
<path fill="currentColor" fill-rule="evenodd" d="M 10.748 4.096 C 10.85 3.638 11.255 3.313 11.724 3.313 L 15.724 3.313 C 16.193 3.313 16.598 3.638 16.7 4.096 L 17.14 6.077 C 17.54 6.267 17.92 6.487 18.28 6.737 L 20.218 6.127 C 20.665 5.986 21.15 6.175 21.384 6.581 L 23.384 10.045 C 23.618 10.451 23.539 10.965 23.194 11.282 L 21.697 12.655 C 21.733 13.093 21.733 13.533 21.697 13.971 L 23.194 15.344 C 23.539 15.661 23.618 16.175 23.384 16.581 L 21.384 20.045 C 21.15 20.451 20.665 20.639 20.218 20.499 L 18.281 19.889 C 17.921 20.139 17.541 20.359 17.141 20.549 L 16.701 22.529 C 16.6 22.987 16.193 23.313 15.724 23.313 L 11.724 23.313 C 11.255 23.313 10.85 22.987 10.748 22.53 L 10.308 20.549 C 9.908 20.359 9.528 20.139 9.168 19.889 L 7.23 20.499 C 6.783 20.639 6.298 20.451 6.064 20.045 L 4.064 16.581 C 3.83 16.175 3.908 15.661 4.254 15.344 L 5.751 13.971 C 5.715 13.533 5.715 13.093 5.751 12.655 L 4.254 11.283 C 3.908 10.966 3.83 10.452 4.064 10.046 L 6.064 6.582 C 6.298 6.176 6.783 5.987 7.23 6.128 L 9.167 6.738 C 9.527 6.488 9.907 6.268 10.307 6.078 L 10.747 4.098 L 10.748 4.096 Z M 13.931 17.38 C 17.01 17.38 18.935 14.046 17.395 11.38 C 16.68 10.142 15.36 9.38 13.931 9.38 C 10.852 9.38 8.927 12.713 10.467 15.38 C 11.181 16.617 12.502 17.38 13.931 17.38" clip-rule="evenodd"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 722 B After Width: | Height: | Size: 1.4 KiB |
@@ -1,6 +1,5 @@
|
||||
@import url('../global/theme.css');
|
||||
|
||||
|
||||
.main-header,
|
||||
.main-menu,
|
||||
.main-sidebar,
|
||||
@@ -11,11 +10,17 @@
|
||||
.navbar,
|
||||
.sidebar-container,
|
||||
#sidepanel_tabs,
|
||||
.sidepanel-wrapper {
|
||||
.sidepanel-wrapper,
|
||||
.main-footer2,
|
||||
.lakatimg,
|
||||
.modalContainer,
|
||||
.modalOuter,
|
||||
#ProfilTab,
|
||||
#KretaProgressBar {
|
||||
display: none !important;
|
||||
visibility: hidden !important;
|
||||
}
|
||||
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
@@ -26,6 +31,11 @@ body {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
background-color: var(--card-card) !important;
|
||||
border-bottom: none !important;
|
||||
}
|
||||
|
||||
.page-wrapper {
|
||||
background-color: var(--background) !important;
|
||||
min-height: 100vh;
|
||||
@@ -50,271 +60,295 @@ body {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.content-container {
|
||||
max-width: 1200px;
|
||||
.profile-container {
|
||||
max-width: 1400px;
|
||||
margin: 0 auto;
|
||||
padding: clamp(1rem, 3vw, 2rem);
|
||||
background-color: var(--background) !important;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.profile-wrapper {
|
||||
display: grid;
|
||||
grid-template-columns: 280px 1fr;
|
||||
gap: 2rem;
|
||||
min-height: calc(100vh - 200px);
|
||||
}
|
||||
|
||||
.firka-header {
|
||||
padding: clamp(1rem, 3vw, 2rem);
|
||||
.profile-sidebar {
|
||||
position: sticky;
|
||||
top: 2rem;
|
||||
height: fit-content;
|
||||
}
|
||||
|
||||
.profile-tabs {
|
||||
background: var(--card-card);
|
||||
border-radius: 16px;
|
||||
padding: 1rem;
|
||||
box-shadow: 0px 1px 2px 0px var(--accent-shadow);
|
||||
}
|
||||
|
||||
.profile-tab {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
background-color: var(--background);
|
||||
gap: 0.75rem;
|
||||
padding: 1rem;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: var(--text-secondary);
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
border-radius: 12px;
|
||||
transition: all 0.2s ease;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.profile-tab:hover {
|
||||
background: var(--button-secondaryFill);
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.profile-tab.active {
|
||||
background: var(--accent-accent);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.profile-tab svg {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.profile-content {
|
||||
background: var(--card-card);
|
||||
border-radius: 16px;
|
||||
padding: 2rem;
|
||||
box-shadow: 0px 1px 2px 0px var(--accent-shadow);
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tab-content.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.tab-header {
|
||||
margin-bottom: 2rem;
|
||||
padding-bottom: 1rem;
|
||||
border-bottom: 2px solid var(--accent-15);
|
||||
}
|
||||
|
||||
.tab-header h2 {
|
||||
margin: 0;
|
||||
color: var(--text-primary);
|
||||
font-size: 28px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.data-section {
|
||||
margin-bottom: 2.5rem;
|
||||
}
|
||||
|
||||
.data-section:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.data-section h3 {
|
||||
color: var(--text-primary);
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
margin: 0 0 1.5rem 0;
|
||||
padding-bottom: 0.75rem;
|
||||
border-bottom: 1px solid var(--accent-15);
|
||||
}
|
||||
|
||||
.back-button {
|
||||
.data-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.data-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.data-item label {
|
||||
color: var(--text-secondary);
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.data-item span {
|
||||
color: var(--text-primary);
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
padding: 0.75rem;
|
||||
background: var(--button-secondaryFill);
|
||||
border-radius: 8px;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.address-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.address-item {
|
||||
padding: 1.25rem;
|
||||
background: var(--button-secondaryFill);
|
||||
border-radius: 12px;
|
||||
border-left: 4px solid var(--accent-15);
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.address-item:hover {
|
||||
transform: translateX(4px);
|
||||
box-shadow: 0px 2px 8px 0px var(--accent-shadow);
|
||||
}
|
||||
|
||||
.address-item.default {
|
||||
border-left-color: var(--accent-accent);
|
||||
background: var(--accent-15);
|
||||
}
|
||||
|
||||
.address-type {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
background: var(--card-card);
|
||||
border: none;
|
||||
border-radius: 12px;
|
||||
padding: 12px 16px;
|
||||
gap: 0.75rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.address-type strong {
|
||||
color: var(--text-primary);
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
text-decoration: none;
|
||||
box-shadow: 0px 1px var(--shadow-blur, 2px) 0px var(--accent-shadow);
|
||||
}
|
||||
|
||||
.back-button:hover {
|
||||
background: var(--button-secondaryFill);
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0px 2px var(--shadow-blur, 4px) 0px var(--accent-shadow);
|
||||
}
|
||||
|
||||
.back-button svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
fill: var(--text-primary);
|
||||
}
|
||||
|
||||
.page-title {
|
||||
color: var(--text-primary);
|
||||
font-size: 24px;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.badge {
|
||||
display: inline-block;
|
||||
padding: 0.25rem 0.75rem;
|
||||
background: var(--accent-accent);
|
||||
color: white;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
border-radius: 12px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.address-details {
|
||||
color: var(--text-secondary);
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.loading-spinner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 4rem 2rem;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.spinner {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border: 4px solid var(--accent-15);
|
||||
border-top-color: var(--accent-accent);
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.loading-spinner p {
|
||||
color: var(--text-secondary);
|
||||
font-size: 16px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
.k-content {
|
||||
background-color: var(--background) !important;
|
||||
}
|
||||
|
||||
.k-content h4 {
|
||||
color: var(--text-primary) !important;
|
||||
font-family: 'Montserrat', sans-serif !important;
|
||||
font-size: 28px !important;
|
||||
font-weight: 600 !important;
|
||||
margin: 0 0 2rem 0 !important;
|
||||
.info-message {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 1.5rem;
|
||||
padding: 3rem 2rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.k-tabstrip-wrapper {
|
||||
background: var(--card-card) !important;
|
||||
border-radius: 24px !important;
|
||||
overflow: hidden;
|
||||
box-shadow: 0px 1px var(--shadow-blur, 2px) 0px var(--accent-shadow);
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.k-tabstrip {
|
||||
background: var(--card-card) !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.k-tabstrip-items {
|
||||
background: var(--card-card) !important;
|
||||
border: none !important;
|
||||
border-radius: 24px 24px 0 0 !important;
|
||||
padding: 0 20px !important;
|
||||
}
|
||||
|
||||
.k-tabstrip-items .k-item {
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
margin: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
.k-tabstrip-items .k-item .k-link {
|
||||
color: var(--text-secondary) !important;
|
||||
font-family: 'Montserrat', sans-serif !important;
|
||||
font-weight: 500 !important;
|
||||
font-size: 14px !important;
|
||||
padding: 16px 20px !important;
|
||||
border: none !important;
|
||||
background: transparent !important;
|
||||
border-radius: 0 !important;
|
||||
transition: all 0.2s ease !important;
|
||||
}
|
||||
|
||||
.k-tabstrip-items .k-item.k-state-active .k-link {
|
||||
color: var(--accent-accent) !important;
|
||||
font-weight: 600 !important;
|
||||
border-bottom: 2px solid var(--accent-accent) !important;
|
||||
}
|
||||
|
||||
.k-tabstrip-items .k-item:hover .k-link {
|
||||
color: var(--text-primary) !important;
|
||||
}
|
||||
|
||||
|
||||
.k-tabstrip .k-content {
|
||||
background: var(--card-card) !important;
|
||||
border: none !important;
|
||||
padding: 20px !important;
|
||||
border-radius: 0 0 24px 24px !important;
|
||||
}
|
||||
|
||||
|
||||
form {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.container-fluid.details {
|
||||
background: transparent !important;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.row {
|
||||
margin-bottom: 1rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.windowInputLabel {
|
||||
color: var(--text-primary) !important;
|
||||
font-family: 'Montserrat', sans-serif !important;
|
||||
font-weight: 500 !important;
|
||||
font-size: 14px !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
|
||||
input[type="text"],
|
||||
input[type="password"],
|
||||
input[type="email"],
|
||||
select,
|
||||
textarea {
|
||||
background: var(--button-secondaryFill) !important;
|
||||
border: 1px solid var(--accent-15) !important;
|
||||
border-radius: 12px !important;
|
||||
padding: 12px 16px !important;
|
||||
color: var(--text-primary) !important;
|
||||
font-family: 'Montserrat', sans-serif !important;
|
||||
font-size: 14px !important;
|
||||
transition: all 0.2s ease !important;
|
||||
}
|
||||
|
||||
input[type="text"]:focus,
|
||||
input[type="password"]:focus,
|
||||
input[type="email"]:focus,
|
||||
select:focus,
|
||||
textarea:focus {
|
||||
outline: none !important;
|
||||
border-color: var(--accent-accent) !important;
|
||||
box-shadow: 0 0 0 3px var(--accent-15) !important;
|
||||
}
|
||||
|
||||
.k-checkbox {
|
||||
appearance: none;
|
||||
width: 20px !important;
|
||||
height: 20px !important;
|
||||
border: 2px solid var(--accent-15) !important;
|
||||
border-radius: 4px !important;
|
||||
background: var(--button-secondaryFill) !important;
|
||||
cursor: pointer !important;
|
||||
position: relative !important;
|
||||
transition: all 0.2s ease !important;
|
||||
}
|
||||
|
||||
.k-checkbox:checked {
|
||||
background: var(--accent-accent) !important;
|
||||
border-color: var(--accent-accent) !important;
|
||||
}
|
||||
|
||||
.k-checkbox:checked::after {
|
||||
content: '✓';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
.info-message svg {
|
||||
color: white;
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.k-checkbox-label {
|
||||
margin-left: 8px !important;
|
||||
color: var(--text-primary) !important;
|
||||
font-family: 'Montserrat', sans-serif !important;
|
||||
cursor: pointer !important;
|
||||
.info-message p {
|
||||
color: var(--text-secondary);
|
||||
font-size: 16px;
|
||||
line-height: 1.6;
|
||||
margin: 0;
|
||||
max-width: 600px;
|
||||
}
|
||||
|
||||
.k-button,
|
||||
button {
|
||||
background: var(--accent-accent) !important;
|
||||
border: none !important;
|
||||
border-radius: 12px !important;
|
||||
padding: 12px 24px !important;
|
||||
color: white !important;
|
||||
font-family: 'Montserrat', sans-serif !important;
|
||||
font-weight: 600 !important;
|
||||
font-size: 14px !important;
|
||||
cursor: pointer !important;
|
||||
transition: all 0.2s ease !important;
|
||||
box-shadow: 0px 1px var(--shadow-blur, 2px) 0px var(--accent-shadow) !important;
|
||||
.error-message {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 1.5rem;
|
||||
padding: 4rem 2rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.k-button:hover,
|
||||
button:hover {
|
||||
background: var(--accent-secondary) !important;
|
||||
transform: translateY(-1px) !important;
|
||||
box-shadow: 0px 2px var(--shadow-blur, 4px) 0px var(--accent-shadow) !important;
|
||||
.error-message svg {
|
||||
color: #e74c3c;
|
||||
}
|
||||
|
||||
.k-button:active,
|
||||
button:active {
|
||||
transform: translateY(0) !important;
|
||||
.error-message p {
|
||||
color: var(--text-secondary);
|
||||
font-size: 16px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.content-container {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.firka-header {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.k-content h4 {
|
||||
font-size: 24px !important;
|
||||
}
|
||||
|
||||
.k-tabstrip-items {
|
||||
padding: 0 10px !important;
|
||||
}
|
||||
|
||||
.k-tabstrip-items .k-item .k-link {
|
||||
padding: 12px 16px !important;
|
||||
font-size: 13px !important;
|
||||
}
|
||||
.security-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
padding: 1rem 2rem;
|
||||
background: var(--accent-accent);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 12px;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
box-shadow: 0px 2px 4px 0px var(--accent-shadow);
|
||||
}
|
||||
|
||||
.security-btn:hover {
|
||||
background: var(--accent-secondary);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0px 4px 8px 0px var(--accent-shadow);
|
||||
}
|
||||
|
||||
.security-btn:active {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.security-btn svg {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
from {
|
||||
@@ -327,159 +361,267 @@ button:active {
|
||||
}
|
||||
}
|
||||
|
||||
.k-tabstrip-wrapper {
|
||||
.profile-wrapper {
|
||||
animation: fadeIn 0.4s ease forwards;
|
||||
}
|
||||
|
||||
.data-section {
|
||||
animation: fadeIn 0.5s ease forwards;
|
||||
}
|
||||
|
||||
|
||||
.k-widget,
|
||||
.k-header {
|
||||
background: var(--card-card) !important;
|
||||
color: var(--text-primary) !important;
|
||||
border: none !important;
|
||||
.data-section:nth-child(2) {
|
||||
animation-delay: 0.1s;
|
||||
}
|
||||
|
||||
.k-state-default {
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
.data-section:nth-child(3) {
|
||||
animation-delay: 0.2s;
|
||||
}
|
||||
|
||||
.k-state-active {
|
||||
background: transparent !important;
|
||||
.data-section:nth-child(4) {
|
||||
animation-delay: 0.3s;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.profile-wrapper {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.k-overlay,
|
||||
.k-window,
|
||||
.k-notification {
|
||||
display: none !important;
|
||||
.profile-sidebar {
|
||||
position: static;
|
||||
}
|
||||
|
||||
.profile-tabs {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 0.5rem;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.profile-tab {
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
gap: 0.5rem;
|
||||
padding: 1rem 0.5rem;
|
||||
font-size: 13px;
|
||||
min-height: 75px;
|
||||
}
|
||||
|
||||
.profile-tab svg {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
.profile-tab span {
|
||||
line-height: 1.2;
|
||||
word-break: break-word;
|
||||
hyphens: auto;
|
||||
}
|
||||
|
||||
.data-grid {
|
||||
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.profile-container {
|
||||
padding: 0.75rem;
|
||||
}
|
||||
|
||||
.main-content .content-content {
|
||||
display: block !important;
|
||||
.profile-wrapper {
|
||||
gap: 0.75rem;
|
||||
}
|
||||
|
||||
.profile-content {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.data-grid {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.tab-header h2 {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.data-section h3 {
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
.profile-tabs {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 0.375rem;
|
||||
padding: 0.375rem;
|
||||
}
|
||||
|
||||
.profile-tab {
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
gap: 0.375rem;
|
||||
padding: 0.625rem 0.25rem;
|
||||
font-size: 11px;
|
||||
min-height: 55px;
|
||||
}
|
||||
|
||||
.profile-tab svg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
.profile-tab span {
|
||||
line-height: 1.1;
|
||||
word-break: break-word;
|
||||
hyphens: auto;
|
||||
}
|
||||
|
||||
.address-item {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.security-btn {
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.info-message,
|
||||
.error-message,
|
||||
.loading-spinner {
|
||||
padding: 2rem 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.profile-container {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
div[style*="display:flex;justify-content:space-between"] {
|
||||
display: flex !important;
|
||||
justify-content: space-between !important;
|
||||
align-items: center !important;
|
||||
margin-top: 2rem !important;
|
||||
padding-top: 2rem !important;
|
||||
border-top: 1px solid var(--accent-15) !important;
|
||||
.profile-wrapper {
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.profile-content {
|
||||
padding: 0.875rem;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.tab-header {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
.tab-header h2 {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.data-section h3 {
|
||||
font-size: 15px;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.data-item label {
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.data-item span {
|
||||
font-size: 13px;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.profile-tabs {
|
||||
padding: 0.25rem;
|
||||
gap: 0.25rem;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.profile-tab {
|
||||
padding: 0.5rem 0.25rem;
|
||||
min-height: 50px;
|
||||
font-size: 10px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.profile-tab svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.profile-tab span {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.data-section {
|
||||
margin-bottom: 1.75rem;
|
||||
}
|
||||
|
||||
.address-item {
|
||||
padding: 0.75rem;
|
||||
}
|
||||
|
||||
.badge {
|
||||
font-size: 9px;
|
||||
padding: 0.2rem 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
div[style*="display:flex;justify-content:space-between"] label {
|
||||
color: var(--text-secondary) !important;
|
||||
font-size: 12px !important;
|
||||
font-style: italic !important;
|
||||
margin: 0 !important;
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.error-message svg {
|
||||
color: #ff6b6b;
|
||||
}
|
||||
}
|
||||
|
||||
.hidden-contact-info {
|
||||
display: none !important;
|
||||
visibility: hidden !important;
|
||||
@media print {
|
||||
.profile-sidebar,
|
||||
.security-btn,
|
||||
.kreta-header,
|
||||
.mobile-header,
|
||||
.mobile-bottom-nav {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.profile-wrapper {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.profile-content {
|
||||
box-shadow: none;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.data-section {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
}
|
||||
|
||||
.hidden-tab {
|
||||
display: none !important;
|
||||
.profile-tab:focus,
|
||||
.security-btn:focus {
|
||||
outline: 2px solid var(--accent-accent);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
#ProfilTab-3 {
|
||||
padding: 20px;
|
||||
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
|
||||
min-height: 500px;
|
||||
.profile-tab:focus:not(:focus-visible),
|
||||
.security-btn:focus:not(:focus-visible) {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
#ProfilTab-3 .container-fluid {
|
||||
background: white;
|
||||
border-radius: 12px;
|
||||
padding: 30px;
|
||||
margin-top: 20px;
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
#ProfilTab-3 h4 {
|
||||
color: #2c3e50;
|
||||
font-weight: 600;
|
||||
margin-bottom: 25px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 3px solid #3498db;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#ProfilTab-3 .row {
|
||||
margin-bottom: 20px;
|
||||
padding: 15px;
|
||||
background: #f8f9fa;
|
||||
border-radius: 8px;
|
||||
border-left: 4px solid #3498db;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
#ProfilTab-3 .row:hover {
|
||||
background: #e3f2fd;
|
||||
transform: translateX(5px);
|
||||
box-shadow: 0 2px 10px rgba(52, 152, 219, 0.2);
|
||||
}
|
||||
|
||||
#ProfilTab-3 .windowInputLabel {
|
||||
color: #34495e;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#ProfilTab-3 .k-button {
|
||||
background: linear-gradient(135deg, #3498db, #2980b9);
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
padding: 10px 20px;
|
||||
::selection {
|
||||
background: var(--accent-accent);
|
||||
color: white;
|
||||
font-weight: 500;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
#ProfilTab-3 .k-button:hover {
|
||||
background: linear-gradient(135deg, #2980b9, #1f5f8b);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 15px rgba(52, 152, 219, 0.4);
|
||||
}
|
||||
|
||||
#ProfilTab-3 .k-input {
|
||||
border: 2px solid #e0e6ed;
|
||||
border-radius: 6px;
|
||||
padding: 10px;
|
||||
transition: border-color 0.3s ease;
|
||||
}
|
||||
|
||||
#ProfilTab-3 .k-input:focus {
|
||||
border-color: #3498db;
|
||||
box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.1);
|
||||
}
|
||||
|
||||
#ProfilTab-3 .alert {
|
||||
border-radius: 8px;
|
||||
border: none;
|
||||
padding: 15px;
|
||||
margin: 15px 0;
|
||||
}
|
||||
|
||||
#ProfilTab-3 .alert-info {
|
||||
background: linear-gradient(135deg, #e3f2fd, #bbdefb);
|
||||
color: #1565c0;
|
||||
}
|
||||
|
||||
#ProfilTab-3 .alert-success {
|
||||
background: linear-gradient(135deg, #e8f5e8, #c8e6c9);
|
||||
color: #2e7d32;
|
||||
}
|
||||
|
||||
#ProfilTab-3 .alert-warning {
|
||||
background: linear-gradient(135deg, #fff3e0, #ffcc02);
|
||||
color: #ef6c00;
|
||||
}
|
||||
|
||||
.details .row {
|
||||
border-bottom: none !important;
|
||||
::-moz-selection {
|
||||
background: var(--accent-accent);
|
||||
color: white;
|
||||
}
|
||||
@@ -1,179 +1,492 @@
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
function hideLoadingScreen() {
|
||||
const loadingElement = document.getElementById('KretaProgressBar');
|
||||
if (loadingElement) {
|
||||
loadingElement.style.display = 'none !important';
|
||||
loadingElement.style.visibility = 'hidden';
|
||||
loadingElement.style.opacity = '0';
|
||||
loadingElement.remove();
|
||||
const TABS = {
|
||||
MY_DATA: 'my-data',
|
||||
PASSWORD: 'password',
|
||||
SECURITY: 'security'
|
||||
};
|
||||
|
||||
}
|
||||
let currentTab = TABS.MY_DATA;
|
||||
let profileData = null;
|
||||
let addressData = null;
|
||||
|
||||
|
||||
const loadingElements = document.querySelectorAll('[class*="loading"], [id*="loading"], [class*="Loading"], [id*="Loading"]');
|
||||
loadingElements.forEach(el => {
|
||||
el.style.display = 'none !important';
|
||||
el.style.visibility = 'hidden';
|
||||
el.style.opacity = '0';
|
||||
});
|
||||
function getApiUrls(subdomain) {
|
||||
return {
|
||||
PROFILE_DATA: `https://${subdomain}.e-kreta.hu/Adminisztracio/Profil/SajatAdatlapPopUp`,
|
||||
ADDRESS_DATA: `https://${subdomain}.e-kreta.hu/api/ProfilApi/GetElerhetosegCimGrid?sort=&page=1&pageSize=100&group=&filter=&data=%7B%7D&_=`
|
||||
};
|
||||
}
|
||||
|
||||
function hideOriginalElements() {
|
||||
const elementsToHide = [
|
||||
'#KretaProgressBar',
|
||||
'.main-header',
|
||||
'.main-menu',
|
||||
'.main-sidebar',
|
||||
'.content-header',
|
||||
'.favoriteIconContainer',
|
||||
'#frissitesDatumDiv',
|
||||
'#layout_navigationBar',
|
||||
'.navbar',
|
||||
'.sidebar-container',
|
||||
'#sidepanel_tabs',
|
||||
'.sidepanel-wrapper',
|
||||
'.main-footer2',
|
||||
'.lakatimg',
|
||||
'.modalContainer',
|
||||
'.modalOuter',
|
||||
'#ProfilTab'
|
||||
];
|
||||
|
||||
function addBackButton() {
|
||||
|
||||
if (document.getElementById('firka-back-button')) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
const backButton = document.createElement('button');
|
||||
backButton.id = 'firka-back-button';
|
||||
backButton.textContent = '← Vissza';
|
||||
backButton.style.cssText = `
|
||||
position: static;
|
||||
margin: 20px;
|
||||
z-index: 100;
|
||||
background-color: var(--card-background, #ffffff);
|
||||
color: var(--text-primary, #333333);
|
||||
border: 1px solid var(--border-color, #e0e0e0);
|
||||
border-radius: 8px;
|
||||
padding: 10px 16px;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
transition: all 0.2s ease;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
width: auto;
|
||||
`;
|
||||
|
||||
|
||||
backButton.addEventListener('mouseenter', function() {
|
||||
this.style.backgroundColor = 'var(--card-hover, #f5f5f5)';
|
||||
this.style.transform = 'translateY(-1px)';
|
||||
this.style.boxShadow = '0 4px 12px rgba(0, 0, 0, 0.15)';
|
||||
elementsToHide.forEach(selector => {
|
||||
const elements = document.querySelectorAll(selector);
|
||||
elements.forEach(el => {
|
||||
el.style.display = 'none';
|
||||
el.style.visibility = 'hidden';
|
||||
});
|
||||
});
|
||||
|
||||
backButton.addEventListener('mouseleave', function() {
|
||||
this.style.backgroundColor = 'var(--card-background, #ffffff)';
|
||||
this.style.transform = 'translateY(0)';
|
||||
this.style.boxShadow = '0 2px 8px rgba(0, 0, 0, 0.1)';
|
||||
document.body.innerHTML = '';
|
||||
}
|
||||
|
||||
async function createNavbar() {
|
||||
const header = await createTemplate.header();
|
||||
const headerContainer = document.createElement('div');
|
||||
headerContainer.innerHTML = header;
|
||||
document.body.appendChild(headerContainer);
|
||||
|
||||
setupUserDropdown();
|
||||
setupSettingsButton();
|
||||
}
|
||||
|
||||
function setupUserDropdown() {
|
||||
const userBtn = document.querySelector('.user-dropdown-btn');
|
||||
const userDropdown = document.querySelector('.user-dropdown');
|
||||
|
||||
userBtn?.addEventListener('click', (e) => {
|
||||
e.stopPropagation();
|
||||
userDropdown?.classList.toggle('show');
|
||||
userBtn?.classList.toggle('open');
|
||||
});
|
||||
|
||||
const mobileUserBtn = document.querySelector('#mobileUserBtn');
|
||||
const mobileUserDropdown = document.querySelector('#mobileUserDropdown');
|
||||
|
||||
backButton.addEventListener('click', function() {
|
||||
window.history.back();
|
||||
mobileUserBtn?.addEventListener('click', (e) => {
|
||||
e.stopPropagation();
|
||||
mobileUserDropdown?.classList.toggle('show');
|
||||
mobileUserBtn?.classList.toggle('active');
|
||||
});
|
||||
|
||||
document.addEventListener('click', (e) => {
|
||||
if (!userBtn?.contains(e.target) && !userDropdown?.contains(e.target)) {
|
||||
userDropdown?.classList.remove('show');
|
||||
userBtn?.classList.remove('open');
|
||||
}
|
||||
|
||||
document.body.insertBefore(backButton, document.body.firstChild);
|
||||
|
||||
}
|
||||
|
||||
|
||||
function hideMainFooter2() {
|
||||
const footer2 = document.querySelector('.main-footer2');
|
||||
if (footer2) {
|
||||
footer2.style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function hideLakatImg() {
|
||||
const lakatImg = document.querySelector('.lakatimg');
|
||||
if (lakatImg) {
|
||||
lakatImg.style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function hideCustomUserSettingsTab() {
|
||||
|
||||
const firstTab = document.querySelector('#ProfilTab .k-tabstrip-items li[aria-controls="ProfilTab-1"]');
|
||||
if (firstTab) {
|
||||
firstTab.classList.add('hidden-tab');
|
||||
}
|
||||
|
||||
|
||||
const tabLinks = document.querySelectorAll('#ProfilTab .k-tabstrip-items .k-link');
|
||||
tabLinks.forEach(link => {
|
||||
if (link.textContent && link.textContent.includes('Egyedi felhasználó beállítások')) {
|
||||
const parentTab = link.closest('li');
|
||||
if (parentTab) {
|
||||
parentTab.classList.add('hidden-tab');
|
||||
}
|
||||
if (!mobileUserBtn?.contains(e.target) && !mobileUserDropdown?.contains(e.target)) {
|
||||
mobileUserDropdown?.classList.remove('show');
|
||||
mobileUserBtn?.classList.remove('active');
|
||||
}
|
||||
});
|
||||
|
||||
const mobileDropdownItems = document.querySelectorAll('.mobile-dropdown-item');
|
||||
mobileDropdownItems.forEach(item => {
|
||||
item.addEventListener('click', () => {
|
||||
mobileUserDropdown?.classList.remove('show');
|
||||
mobileUserBtn?.classList.remove('active');
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
const contentPanel = document.querySelector('#ProfilTab-1');
|
||||
if (contentPanel) {
|
||||
contentPanel.classList.add('hidden-tab');
|
||||
function setupSettingsButton() {
|
||||
document.getElementById('settingsBtn')?.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
const url = chrome.runtime.getURL('settings/index.html');
|
||||
window.open(url, '_blank', 'width=400,height=600');
|
||||
});
|
||||
|
||||
document.getElementById('mobileSettingsBtn')?.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
const url = chrome.runtime.getURL('settings/index.html');
|
||||
window.open(url, '_blank', 'width=400,height=600');
|
||||
});
|
||||
}
|
||||
|
||||
function createProfilePage() {
|
||||
const t = window.LanguageManager?.t || ((key) => key);
|
||||
|
||||
const container = document.createElement('div');
|
||||
container.className = 'profile-container';
|
||||
container.innerHTML = `
|
||||
<div class="profile-wrapper">
|
||||
<div class="profile-sidebar">
|
||||
<div class="profile-tabs">
|
||||
<button class="profile-tab active" data-tab="${TABS.MY_DATA}">
|
||||
<svg viewBox="0 0 24 24" width="20" height="20">
|
||||
<path fill="currentColor" d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/>
|
||||
</svg>
|
||||
<span>${t('profile.tab_my_data')}</span>
|
||||
</button>
|
||||
<button class="profile-tab" data-tab="${TABS.PASSWORD}">
|
||||
<svg viewBox="0 0 24 24" width="20" height="20">
|
||||
<path fill="currentColor" d="M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm-6 9c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2z"/>
|
||||
</svg>
|
||||
<span>${t('profile.tab_password')}</span>
|
||||
</button>
|
||||
<button class="profile-tab" data-tab="${TABS.SECURITY}">
|
||||
<svg viewBox="0 0 24 24" width="20" height="20">
|
||||
<path fill="currentColor" d="M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm0 10.99h7c-.53 4.12-3.28 7.79-7 8.94V12H5V6.3l7-3.11v8.8z"/>
|
||||
</svg>
|
||||
<span>${t('profile.tab_security')}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="profile-content">
|
||||
<div id="tab-${TABS.MY_DATA}" class="tab-content active">
|
||||
<div class="loading-spinner">
|
||||
<div class="spinner"></div>
|
||||
<p>${t('profile.loading_data')}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="tab-${TABS.PASSWORD}" class="tab-content">
|
||||
<div class="tab-header">
|
||||
<h2>${t('profile.tab_password')}</h2>
|
||||
</div>
|
||||
<div class="info-message">
|
||||
<svg viewBox="0 0 24 24" width="24" height="24">
|
||||
<path fill="currentColor" d="M11 15h2v2h-2zm0-8h2v6h-2zm.99-5C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"/>
|
||||
</svg>
|
||||
<p>${t('profile.password_change_unavailable')}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="tab-${TABS.SECURITY}" class="tab-content">
|
||||
<div class="tab-header">
|
||||
<h2>${t('profile.tab_security')}</h2>
|
||||
</div>
|
||||
<div class="info-message">
|
||||
<p>${t('profile.security_settings_info')}</p>
|
||||
<button id="security-redirect-btn" class="security-btn">
|
||||
<svg viewBox="0 0 24 24" width="20" height="20">
|
||||
<path fill="currentColor" d="M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm0 10.99h7c-.53 4.12-3.28 7.79-7 8.94V12H5V6.3l7-3.11v8.8z"/>
|
||||
</svg>
|
||||
${t('profile.open_security_settings')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
document.body.appendChild(container);
|
||||
}
|
||||
|
||||
async function fetchProfileData() {
|
||||
try {
|
||||
const subdomain = await storageManager.get('schoolSubdomain', '');
|
||||
if (!subdomain) {
|
||||
console.error('Nincs beállítva az iskola alcím');
|
||||
return null;
|
||||
}
|
||||
|
||||
const apiUrls = getApiUrls(subdomain);
|
||||
const response = await fetch(apiUrls.PROFILE_DATA);
|
||||
const html = await response.text();
|
||||
return parseProfileHTML(html);
|
||||
} catch (error) {
|
||||
console.error('Hiba a profil adatok lekérésekor:', error);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
async function fetchAddressData() {
|
||||
try {
|
||||
const subdomain = await storageManager.get('schoolSubdomain', '');
|
||||
if (!subdomain) {
|
||||
console.error('Nincs beállítva az iskola alcím');
|
||||
return null;
|
||||
}
|
||||
|
||||
function hideAdditionalContactInfo() {
|
||||
const apiUrls = getApiUrls(subdomain);
|
||||
const timestamp = new Date().getTime();
|
||||
const response = await fetch(apiUrls.ADDRESS_DATA + timestamp);
|
||||
const data = await response.json();
|
||||
return data;
|
||||
} catch (error) {
|
||||
console.error('Hiba a cím adatok lekérésekor:', error);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
function hideElementsWithText(text) {
|
||||
const elements = document.querySelectorAll('h4');
|
||||
elements.forEach(h4 => {
|
||||
if (h4.textContent && h4.textContent.includes(text)) {
|
||||
// Hide the parent row
|
||||
let parent = h4.closest('.row');
|
||||
if (parent) {
|
||||
parent.classList.add('hidden-contact-info');
|
||||
function parseProfileHTML(html) {
|
||||
const parser = new DOMParser();
|
||||
const doc = parser.parseFromString(html, 'text/html');
|
||||
|
||||
const data = {
|
||||
personal: {},
|
||||
contact: {},
|
||||
bankAccount: {},
|
||||
studentCard: {}
|
||||
};
|
||||
|
||||
const personalFields = [
|
||||
{ id: 'AlapAdat_CsaladiNev', key: 'familyName' },
|
||||
{ id: 'AlapAdat_Utonev', key: 'firstName' },
|
||||
{ id: 'AlapAdat_SzuletesiCsaladNev', key: 'birthFamilyName' },
|
||||
{ id: 'AlapAdat_SzuletesiUtonev', key: 'birthFirstName' },
|
||||
{ id: 'AlapAdat_AnyjaCsaladiNeve', key: 'motherFamilyName' },
|
||||
{ id: 'AlapAdat_AnyjaUtonev', key: 'motherFirstName' },
|
||||
{ id: 'AlapAdat_SzuletesiIdo_SDATE', key: 'birthDate' },
|
||||
{ id: 'AlapAdat_SzuletesiHely', key: 'birthPlace' },
|
||||
{ id: 'AlapAdat_SzuletesiOrszag', key: 'birthCountry' },
|
||||
{ id: 'AlapAdat_Anyanyelv', key: 'motherTongue' },
|
||||
{ id: 'AlapAdat_Allampolgarsag', key: 'citizenship' },
|
||||
{ id: 'AlapAdat_OsztalyfonokNev', key: 'classTeacher' },
|
||||
{ id: 'AlapAdat_OsztalyNev', key: 'className' },
|
||||
{ id: 'AlapAdat_TeremNev', key: 'classroom' },
|
||||
{ id: 'AlapAdat_BelepesiNev', key: 'username' }
|
||||
];
|
||||
|
||||
personalFields.forEach(field => {
|
||||
const label = doc.querySelector(`label[displayfor="${field.id}"]`);
|
||||
if (label) {
|
||||
data.personal[field.key] = {
|
||||
key: field.key,
|
||||
value: label.textContent.trim()
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
const phoneInput = doc.querySelector('#Elerhetosegek_ErtesitesiTelefon_TelefonSzam');
|
||||
const emailInput = doc.querySelector('#Elerhetosegek_ErtesitesiEmail_EmailCim');
|
||||
|
||||
if (phoneInput) {
|
||||
data.contact.phone = {
|
||||
key: 'phone',
|
||||
value: phoneInput.value || ''
|
||||
};
|
||||
}
|
||||
|
||||
if (emailInput) {
|
||||
data.contact.email = {
|
||||
key: 'email',
|
||||
value: emailInput.value || ''
|
||||
};
|
||||
}
|
||||
|
||||
const bankFields = [
|
||||
{ id: 'BankszamlaSzam', key: 'accountNumber' },
|
||||
{ id: 'SzamlavezetoBank', key: 'bankName' },
|
||||
{ id: 'BankszamlaTulajdonosNeve', key: 'accountOwner' }
|
||||
];
|
||||
|
||||
bankFields.forEach(field => {
|
||||
const input = doc.querySelector(`#${field.id}`);
|
||||
if (input) {
|
||||
data.bankAccount[field.key] = {
|
||||
key: field.key,
|
||||
value: input.value || ''
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
const cardFields = [
|
||||
{ id: 'TanuloIgazolvany_Igazolvanyszam', key: 'cardNumber' },
|
||||
{ id: 'TanuloIgazolvany_AdoazonositoJel', key: 'taxId' },
|
||||
{ id: 'TanuloIgazolvany_DiakigazolvanySzam', key: 'studentCardNumber' },
|
||||
{ id: 'TanuloIgazolvany_TajSzam', key: 'socialSecurityNumber' }
|
||||
];
|
||||
|
||||
cardFields.forEach(field => {
|
||||
const label = doc.querySelector(`label[displayfor="${field.id}"]`);
|
||||
if (label) {
|
||||
data.studentCard[field.key] = {
|
||||
key: field.key,
|
||||
value: label.textContent.trim()
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
return data;
|
||||
}
|
||||
|
||||
function renderProfileData() {
|
||||
const t = window.LanguageManager?.t || ((key) => key);
|
||||
const container = document.getElementById(`tab-${TABS.MY_DATA}`);
|
||||
|
||||
if (!profileData && !addressData) {
|
||||
container.innerHTML = `
|
||||
<div class="error-message">
|
||||
<svg viewBox="0 0 24 24" width="48" height="48">
|
||||
<path fill="currentColor" d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"/>
|
||||
</svg>
|
||||
<p>${t('profile.loading_error')}</p>
|
||||
</div>
|
||||
`;
|
||||
return;
|
||||
}
|
||||
|
||||
let html = `<div class="tab-header"><h2>${t('profile.my_data_title')}</h2></div>`;
|
||||
|
||||
if (profileData && profileData.personal && Object.keys(profileData.personal).length > 0) {
|
||||
html += `<div class="data-section"><h3>${t('profile.personal_data')}</h3><div class="data-grid">`;
|
||||
|
||||
Object.values(profileData.personal).forEach(field => {
|
||||
if (field.value && field.value !== 'XY') {
|
||||
html += `
|
||||
<div class="data-item">
|
||||
<label>${t(`profile.field_${field.key}`)}</label>
|
||||
<span>${field.value}</span>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
});
|
||||
|
||||
html += '</div></div>';
|
||||
}
|
||||
|
||||
if (profileData && profileData.contact && Object.keys(profileData.contact).length > 0) {
|
||||
html += `<div class="data-section"><h3>${t('profile.contact_data')}</h3><div class="data-grid">`;
|
||||
|
||||
Object.values(profileData.contact).forEach(field => {
|
||||
if (field.value) {
|
||||
html += `
|
||||
<div class="data-item">
|
||||
<label>${t(`profile.field_${field.key}`)}</label>
|
||||
<span>${field.value}</span>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
});
|
||||
|
||||
html += '</div></div>';
|
||||
}
|
||||
|
||||
if (addressData && addressData.Data && addressData.Data.length > 0) {
|
||||
html += `<div class="data-section"><h3>${t('profile.address_data')}</h3><div class="address-list">`;
|
||||
|
||||
addressData.Data.forEach(address => {
|
||||
const fullAddress = `${address.Irsz} ${address.Varos}, ${address.Kozterulet} ${address.KozteruletJellegeNev || ''} ${address.HazSzam}${address.Emelet ? ' ' + address.Emelet : ''}${address.Ajto ? ' ' + address.Ajto : ''}`;
|
||||
const isDefault = address.Alapertelmezett_BOOL;
|
||||
|
||||
html += `
|
||||
<div class="address-item ${isDefault ? 'default' : ''}">
|
||||
<div class="address-type">
|
||||
<strong>${address.CimTipus_DNAME}</strong>
|
||||
${isDefault ? `<span class="badge">${t('profile.default_address')}</span>` : ''}
|
||||
</div>
|
||||
<div class="address-details">${fullAddress}</div>
|
||||
</div>
|
||||
`;
|
||||
});
|
||||
|
||||
html += '</div></div>';
|
||||
}
|
||||
|
||||
if (profileData && profileData.bankAccount && Object.keys(profileData.bankAccount).length > 0) {
|
||||
const hasData = Object.values(profileData.bankAccount).some(field => field.value);
|
||||
|
||||
if (hasData) {
|
||||
html += `<div class="data-section"><h3>${t('profile.bank_account_data')}</h3><div class="data-grid">`;
|
||||
|
||||
Object.values(profileData.bankAccount).forEach(field => {
|
||||
if (field.value) {
|
||||
html += `
|
||||
<div class="data-item">
|
||||
<label>${t(`profile.field_${field.key}`)}</label>
|
||||
<span>${field.value}</span>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
html += '</div></div>';
|
||||
}
|
||||
}
|
||||
|
||||
if (profileData && profileData.studentCard && Object.keys(profileData.studentCard).length > 0) {
|
||||
const hasData = Object.values(profileData.studentCard).some(field => field.value && field.value !== 'XY');
|
||||
|
||||
hideElementsWithText('TOVÁBBI E-MAIL ELÉRHETŐSÉGEK');
|
||||
hideElementsWithText('TOVÁBBI TELEFONSZÁMOK');
|
||||
if (hasData) {
|
||||
html += `<div class="data-section"><h3>${t('profile.student_card_data')}</h3><div class="data-grid">`;
|
||||
|
||||
Object.values(profileData.studentCard).forEach(field => {
|
||||
if (field.value && field.value !== 'XY') {
|
||||
html += `
|
||||
<div class="data-item">
|
||||
<label>${t(`profile.field_${field.key}`)}</label>
|
||||
<span>${field.value}</span>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
});
|
||||
|
||||
const rows = document.querySelectorAll('.row');
|
||||
rows.forEach(row => {
|
||||
const h4Elements = row.querySelectorAll('h4');
|
||||
h4Elements.forEach(h4 => {
|
||||
if (h4.textContent &&
|
||||
(h4.textContent.includes('TOVÁBBI E-MAIL ELÉRHETŐSÉGEK') ||
|
||||
h4.textContent.includes('TOVÁBBI TELEFONSZÁMOK'))) {
|
||||
row.classList.add('hidden-contact-info');
|
||||
}
|
||||
html += '</div></div>';
|
||||
}
|
||||
}
|
||||
|
||||
container.innerHTML = html;
|
||||
}
|
||||
|
||||
function setupTabSwitching() {
|
||||
const tabs = document.querySelectorAll('.profile-tab');
|
||||
const tabContents = document.querySelectorAll('.tab-content');
|
||||
|
||||
tabs.forEach(tab => {
|
||||
tab.addEventListener('click', () => {
|
||||
const tabId = tab.getAttribute('data-tab');
|
||||
|
||||
tabs.forEach(t => t.classList.remove('active'));
|
||||
tab.classList.add('active');
|
||||
|
||||
tabContents.forEach(tc => tc.classList.remove('active'));
|
||||
document.getElementById(`tab-${tabId}`).classList.add('active');
|
||||
|
||||
currentTab = tabId;
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function init() {
|
||||
hideLoadingScreen();
|
||||
addBackButton();
|
||||
hideAdditionalContactInfo();
|
||||
hideCustomUserSettingsTab();
|
||||
hideMainFooter2();
|
||||
hideLakatImg();
|
||||
|
||||
|
||||
const observer = new MutationObserver(() => {
|
||||
hideAdditionalContactInfo();
|
||||
hideCustomUserSettingsTab();
|
||||
hideMainFooter2();
|
||||
hideLakatImg();
|
||||
});
|
||||
|
||||
observer.observe(document.body, {
|
||||
childList: true,
|
||||
subtree: true
|
||||
});
|
||||
async function setupSecurityRedirect() {
|
||||
const btn = document.getElementById('security-redirect-btn');
|
||||
if (btn) {
|
||||
btn.addEventListener('click', async () => {
|
||||
const subdomain = await storageManager.get('schoolSubdomain', '');
|
||||
const url = `https://idp.e-kreta.hu/security?returnUrl=https%3A%2F%2F${subdomain}.e-kreta.hu%2FAdminisztracio%2FProfil`;
|
||||
window.location.href = url;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
async function init() {
|
||||
try {
|
||||
hideOriginalElements();
|
||||
|
||||
if (typeof window.LanguageManager !== 'undefined' && window.LanguageManager.init) {
|
||||
await window.LanguageManager.init();
|
||||
}
|
||||
|
||||
await createNavbar();
|
||||
createProfilePage();
|
||||
setupTabSwitching();
|
||||
setupSecurityRedirect();
|
||||
|
||||
[profileData, addressData] = await Promise.all([
|
||||
fetchProfileData(),
|
||||
fetchAddressData()
|
||||
]);
|
||||
|
||||
renderProfileData();
|
||||
} catch (error) {
|
||||
console.error('Hiba az inicializálás során:', error);
|
||||
}
|
||||
}
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
@@ -181,48 +494,4 @@
|
||||
init();
|
||||
}
|
||||
|
||||
|
||||
window.addEventListener('load', init);
|
||||
|
||||
|
||||
setTimeout(hideLoadingScreen, 1000);
|
||||
|
||||
|
||||
let attempts = 0;
|
||||
const maxAttempts = 20;
|
||||
const aggressiveHide = setInterval(() => {
|
||||
attempts++;
|
||||
hideLoadingScreen();
|
||||
|
||||
if (attempts >= maxAttempts) {
|
||||
clearInterval(aggressiveHide);
|
||||
}
|
||||
}, 500);
|
||||
|
||||
|
||||
if (typeof MutationObserver !== 'undefined') {
|
||||
const observer = new MutationObserver((mutations) => {
|
||||
mutations.forEach((mutation) => {
|
||||
mutation.addedNodes.forEach((node) => {
|
||||
if (node.nodeType === 1) {
|
||||
if (node.id === 'KretaProgressBar' ||
|
||||
node.className && (node.className.includes('loading') || node.className.includes('Loading'))) {
|
||||
node.style.display = 'none !important';
|
||||
node.style.visibility = 'hidden';
|
||||
node.style.opacity = '0';
|
||||
if (node.parentNode) {
|
||||
node.parentNode.removeChild(node);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
observer.observe(document.body, {
|
||||
childList: true,
|
||||
subtree: true
|
||||
});
|
||||
}
|
||||
|
||||
})();
|
||||
Reference in New Issue
Block a user