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
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"manifest_version": 3,
|
||||
"name": "Firxa",
|
||||
"version": "1.3.1",
|
||||
"version": "1.3.2",
|
||||
"description": "KRÉTA webes verziójának újraírása",
|
||||
"icons": {
|
||||
"128": "images/firka_logo_128.png"
|
||||
|
||||
@@ -1,362 +1,485 @@
|
||||
* {
|
||||
box-sizing:border-box;
|
||||
margin:0;
|
||||
padding:0;
|
||||
@import url('../global/theme.css');
|
||||
|
||||
|
||||
.main-header,
|
||||
.main-menu,
|
||||
.main-sidebar,
|
||||
.content-header,
|
||||
.favoriteIconContainer,
|
||||
#frissitesDatumDiv,
|
||||
#layout_navigationBar,
|
||||
.navbar,
|
||||
.sidebar-container,
|
||||
#sidepanel_tabs,
|
||||
.sidepanel-wrapper {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
|
||||
body {
|
||||
margin:0;
|
||||
padding:0;
|
||||
color:var(--text-primary);
|
||||
background-color:var(--background) !important;
|
||||
font-family:"Montserrat",serif !important;
|
||||
min-height:100vh;
|
||||
font-size:16px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
color: var(--text-primary) !important;
|
||||
background-color: var(--background) !important;
|
||||
font-family: 'Montserrat', sans-serif !important;
|
||||
min-height: 100vh;
|
||||
font-size: 16px;
|
||||
}
|
||||
.kreta-container {
|
||||
min-height:100vh;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
|
||||
.page-wrapper {
|
||||
background-color: var(--background) !important;
|
||||
min-height: 100vh;
|
||||
}
|
||||
.kreta-header {
|
||||
padding:clamp(1rem,3vw,2rem);
|
||||
display:grid;
|
||||
grid-template-columns:minmax(300px,400px) 1fr minmax(200px,300px);
|
||||
align-items:center;
|
||||
gap:1rem;
|
||||
|
||||
.main-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
background-color: var(--background) !important;
|
||||
}
|
||||
.school-info {
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:0.5rem;
|
||||
|
||||
.main-content {
|
||||
flex: 1;
|
||||
padding: 0;
|
||||
background-color: var(--background) !important;
|
||||
}
|
||||
.logo-text {
|
||||
color:var(--text-primary);
|
||||
font-size:24px;
|
||||
font-weight:600;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
margin:0;
|
||||
|
||||
.content-content {
|
||||
background-color: var(--background) !important;
|
||||
min-height: auto !important;
|
||||
padding: 0;
|
||||
}
|
||||
.logo {
|
||||
width:24px;
|
||||
border-radius:8px;
|
||||
margin-right:8px;
|
||||
|
||||
.content-container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: clamp(1rem, 3vw, 2rem);
|
||||
background-color: var(--background) !important;
|
||||
}
|
||||
.school-details {
|
||||
color:var(--text-secondary);
|
||||
font-size:14px;
|
||||
white-space:nowrap;
|
||||
overflow:hidden;
|
||||
text-overflow:ellipsis;
|
||||
max-width:300px;
|
||||
|
||||
|
||||
.firka-header {
|
||||
padding: clamp(1rem, 3vw, 2rem);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
background-color: var(--background);
|
||||
border-bottom: 1px solid var(--accent-15);
|
||||
}
|
||||
.user-profile {
|
||||
position:relative;
|
||||
justify-self:flex-end;
|
||||
|
||||
.back-button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
background: var(--card-card);
|
||||
border: none;
|
||||
border-radius: 12px;
|
||||
padding: 12px 16px;
|
||||
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);
|
||||
}
|
||||
.user-dropdown-btn {
|
||||
display:flex;
|
||||
align-items:center;
|
||||
gap:1rem;
|
||||
background:none;
|
||||
border:none;
|
||||
cursor:pointer;
|
||||
padding:0.5rem;
|
||||
border-radius:8px;
|
||||
transition:background-color 0.2s;
|
||||
|
||||
.back-button:hover {
|
||||
background: var(--button-secondaryFill);
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0px 2px var(--shadow-blur, 4px) 0px var(--accent-shadow);
|
||||
}
|
||||
.user-dropdown-btn:hover {
|
||||
background:var(--card-card);
|
||||
|
||||
.back-button svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
fill: var(--text-primary);
|
||||
}
|
||||
.user-info {
|
||||
text-align:right;
|
||||
|
||||
.page-title {
|
||||
color: var(--text-primary);
|
||||
font-size: 24px;
|
||||
font-weight: 600;
|
||||
margin: 0;
|
||||
}
|
||||
.user-dropdown {
|
||||
position:absolute;
|
||||
top:100%;
|
||||
right:0;
|
||||
margin-top:0.5rem;
|
||||
background:var(--card-card);
|
||||
border-radius:12px;
|
||||
box-shadow:0px 1px var(--shadow-blur) 0px var(--accent-shadow);
|
||||
width:200px;
|
||||
display:none;
|
||||
z-index:1000;
|
||||
|
||||
|
||||
.k-content {
|
||||
background-color: var(--background) !important;
|
||||
}
|
||||
.user-dropdown.show {
|
||||
display:block;
|
||||
animation:dropdownShow 0.2s ease;
|
||||
|
||||
.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;
|
||||
text-align: center;
|
||||
}
|
||||
.dropdown-item {
|
||||
display:flex;
|
||||
align-items:center;
|
||||
gap:0.75rem;
|
||||
padding:0.75rem 1rem;
|
||||
color:var(--text-primary);
|
||||
text-decoration:none;
|
||||
transition:background-color 0.2s;
|
||||
|
||||
|
||||
.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;
|
||||
}
|
||||
.dropdown-item:hover {
|
||||
background:var(--button-secondaryFill);
|
||||
|
||||
.k-tabstrip {
|
||||
background: var(--card-card) !important;
|
||||
border: none !important;
|
||||
}
|
||||
.kreta-main {
|
||||
flex:1;
|
||||
padding:clamp(1rem,3vw,2rem);
|
||||
max-width:800px;
|
||||
margin:0 auto;
|
||||
width:100%;
|
||||
|
||||
.k-tabstrip-items {
|
||||
background: var(--card-card) !important;
|
||||
border: none !important;
|
||||
border-radius: 24px 24px 0 0 !important;
|
||||
padding: 0 20px !important;
|
||||
}
|
||||
.card {
|
||||
background:var(--card-card);
|
||||
border-radius:24px;
|
||||
overflow:hidden;
|
||||
box-shadow:0px 1px var(--shadow-blur) 0px var(--accent-shadow);
|
||||
|
||||
.k-tabstrip-items .k-item {
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
margin: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
.card h2 {
|
||||
font-size:18px;
|
||||
font-weight:600;
|
||||
color:var(--text-primary);
|
||||
padding:1.5rem;
|
||||
padding-bottom:0.5rem;
|
||||
background-color:var(--card-card);
|
||||
|
||||
.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;
|
||||
}
|
||||
.profile-tabs {
|
||||
padding:1.5rem;
|
||||
|
||||
.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;
|
||||
}
|
||||
.tab-headers {
|
||||
display:flex;
|
||||
gap:0.5rem;
|
||||
margin-bottom:1.5rem;
|
||||
border-bottom:1px solid var(--card-translucent);
|
||||
overflow-x:auto;
|
||||
scrollbar-width:none;
|
||||
|
||||
.k-tabstrip-items .k-item:hover .k-link {
|
||||
color: var(--text-primary) !important;
|
||||
}
|
||||
.tab-headers::-webkit-scrollbar {
|
||||
display:none;
|
||||
|
||||
|
||||
.k-tabstrip .k-content {
|
||||
background: var(--card-card) !important;
|
||||
border: none !important;
|
||||
padding: 20px !important;
|
||||
border-radius: 0 0 24px 24px !important;
|
||||
}
|
||||
.tab-header {
|
||||
padding:0.75rem 1rem;
|
||||
background:none;
|
||||
border:none;
|
||||
color:var(--text-secondary);
|
||||
font-weight:500;
|
||||
cursor:pointer;
|
||||
white-space:nowrap;
|
||||
border-bottom:2px solid transparent;
|
||||
font-size:14px;
|
||||
|
||||
|
||||
form {
|
||||
background: transparent !important;
|
||||
}
|
||||
.tab-header.active {
|
||||
color:var(--accent-accent);
|
||||
border-bottom-color:var(--accent-accent);
|
||||
|
||||
.container-fluid.details {
|
||||
background: transparent !important;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
.tab-content {
|
||||
display:none;
|
||||
background:var(--button-secondaryFill);
|
||||
border-radius:8px;
|
||||
padding:1.5rem;
|
||||
|
||||
.row {
|
||||
margin-bottom: 1rem;
|
||||
align-items: center;
|
||||
}
|
||||
.tab-content.active {
|
||||
display:block;
|
||||
|
||||
.windowInputLabel {
|
||||
color: var(--text-primary) !important;
|
||||
font-family: 'Montserrat', sans-serif !important;
|
||||
font-weight: 500 !important;
|
||||
font-size: 14px !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
.form-group {
|
||||
margin-bottom:1rem;
|
||||
|
||||
|
||||
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;
|
||||
}
|
||||
.form-label {
|
||||
display:block;
|
||||
color:var(--text-secondary);
|
||||
font-size:14px;
|
||||
margin-bottom:0.5rem;
|
||||
|
||||
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;
|
||||
}
|
||||
.form-control {
|
||||
width:100%;
|
||||
padding:0.75rem;
|
||||
border:1px solid var(--accent-15);
|
||||
border-radius:8px;
|
||||
background:var(--accent-15);
|
||||
color:var(--text-primary);
|
||||
font-size:14px;
|
||||
|
||||
.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;
|
||||
}
|
||||
.form-control:focus {
|
||||
outline:none;
|
||||
border-color:var(--accent-accent);
|
||||
|
||||
.k-checkbox:checked {
|
||||
background: var(--accent-accent) !important;
|
||||
border-color: var(--accent-accent) !important;
|
||||
}
|
||||
.form-text {
|
||||
font-size:12px;
|
||||
color:var(--text-secondary);
|
||||
margin-top:0.25rem;
|
||||
|
||||
.k-checkbox:checked::after {
|
||||
content: '✓';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
color: white;
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.security-content {
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:1.5rem;
|
||||
|
||||
.k-checkbox-label {
|
||||
margin-left: 8px !important;
|
||||
color: var(--text-primary) !important;
|
||||
font-family: 'Montserrat', sans-serif !important;
|
||||
cursor: pointer !important;
|
||||
}
|
||||
.step-card {
|
||||
background:var(--button-secondaryFill);
|
||||
border-radius:12px;
|
||||
padding:1.5rem;
|
||||
animation:fadeIn 0.3s ease;
|
||||
|
||||
.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;
|
||||
}
|
||||
.step-card h3 {
|
||||
color:var(--text-primary);
|
||||
font-size:16px;
|
||||
font-weight:600;
|
||||
margin-bottom:1rem;
|
||||
|
||||
.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;
|
||||
}
|
||||
.step-card p {
|
||||
color:var(--text-secondary);
|
||||
font-size:14px;
|
||||
margin-bottom:1rem;
|
||||
line-height:1.5;
|
||||
|
||||
.k-button:active,
|
||||
button:active {
|
||||
transform: translateY(0) !important;
|
||||
}
|
||||
.app-grid {
|
||||
display:grid;
|
||||
grid-template-columns:1fr 1fr;
|
||||
gap:1.5rem;
|
||||
margin-top:1rem;
|
||||
}
|
||||
.app-section h4 {
|
||||
color:var(--text-primary);
|
||||
font-size:14px;
|
||||
font-weight:600;
|
||||
margin-bottom:0.75rem;
|
||||
}
|
||||
.app-links {
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:0.5rem;
|
||||
}
|
||||
.app-link {
|
||||
display:flex;
|
||||
align-items:center;
|
||||
gap:0.5rem;
|
||||
padding:0.75rem;
|
||||
background:var(--card-card);
|
||||
border-radius:8px;
|
||||
color:var(--text-primary);
|
||||
text-decoration:none;
|
||||
font-size:14px;
|
||||
transition:background-color 0.2s;
|
||||
}
|
||||
.app-link:hover {
|
||||
background:var(--button-secondaryFill);
|
||||
}
|
||||
.qr-container {
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
gap:1rem;
|
||||
margin:1.5rem 0;
|
||||
}
|
||||
.qr-container img {
|
||||
background:white;
|
||||
padding:1rem;
|
||||
border-radius:8px;
|
||||
max-width:200px;
|
||||
}
|
||||
.setup-key {
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:0.5rem;
|
||||
width:100%;
|
||||
}
|
||||
.key-display {
|
||||
display:flex;
|
||||
align-items:center;
|
||||
gap:0.5rem;
|
||||
background:var(--card-card);
|
||||
padding:0.75rem;
|
||||
border-radius:8px;
|
||||
}
|
||||
.key-display code {
|
||||
font-family:monospace;
|
||||
color:var(--text-primary);
|
||||
font-size:14px;
|
||||
flex-grow:1;
|
||||
text-align:center;
|
||||
}
|
||||
.btn-copy {
|
||||
background:none;
|
||||
border:none;
|
||||
color:var(--text-secondary);
|
||||
cursor:pointer;
|
||||
padding:0.25rem;
|
||||
border-radius:4px;
|
||||
transition:all 0.2s;
|
||||
}
|
||||
.btn-copy:hover {
|
||||
color:var(--text-primary);
|
||||
background:var(--button-secondaryFill);
|
||||
}
|
||||
.btn-save {
|
||||
padding:0.75rem 1.5rem;
|
||||
background:var(--accent-accent);
|
||||
color:var(--button-secondaryFill);
|
||||
border:none;
|
||||
border-radius:8px;
|
||||
font-weight:500;
|
||||
cursor:pointer;
|
||||
font-size:14px;
|
||||
transition:background-color 0.2s;
|
||||
}
|
||||
.btn-save:hover {
|
||||
background:var(--accent-secondary);
|
||||
|
||||
|
||||
@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;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@keyframes fadeIn {
|
||||
from {
|
||||
opacity:0;
|
||||
transform:translateY(-10px);
|
||||
opacity: 0;
|
||||
transform: translateY(20px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
to {
|
||||
opacity:1;
|
||||
transform:translateY(0);
|
||||
|
||||
.k-tabstrip-wrapper {
|
||||
animation: fadeIn 0.5s ease forwards;
|
||||
}
|
||||
}@keyframes dropdownShow {
|
||||
from {
|
||||
opacity:0;
|
||||
transform:translateY(-10px);
|
||||
|
||||
|
||||
.k-widget,
|
||||
.k-header {
|
||||
background: var(--card-card) !important;
|
||||
color: var(--text-primary) !important;
|
||||
border: none !important;
|
||||
}
|
||||
to {
|
||||
opacity:1;
|
||||
transform:translateY(0);
|
||||
|
||||
.k-state-default {
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
}
|
||||
}@media (max-width:768px) {
|
||||
.kreta-header {
|
||||
grid-template-columns:1fr auto auto;
|
||||
grid-template-areas:"school toggle user"
|
||||
"nav nav nav";
|
||||
padding:1rem;
|
||||
gap:0.5rem;
|
||||
|
||||
.k-state-active {
|
||||
background: transparent !important;
|
||||
}
|
||||
.school-info {
|
||||
grid-area:school;
|
||||
|
||||
|
||||
.k-overlay,
|
||||
.k-window,
|
||||
.k-notification {
|
||||
display: none !important;
|
||||
}
|
||||
.user-profile {
|
||||
grid-area:user;
|
||||
|
||||
|
||||
.main-content .content-content {
|
||||
display: block !important;
|
||||
}
|
||||
.app-grid {
|
||||
grid-template-columns:1fr;
|
||||
|
||||
|
||||
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-tabs {
|
||||
padding:1rem;
|
||||
|
||||
|
||||
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;
|
||||
}
|
||||
.tab-content {
|
||||
padding:1rem;
|
||||
|
||||
.hidden-contact-info {
|
||||
display: none !important;
|
||||
visibility: hidden !important;
|
||||
}
|
||||
}.material-icons-round {
|
||||
font-size:20px;
|
||||
vertical-align:middle;
|
||||
|
||||
.hidden-tab {
|
||||
display: none !important;
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
width:8px;
|
||||
height:8px;
|
||||
|
||||
#ProfilTab-3 {
|
||||
padding: 20px;
|
||||
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
|
||||
min-height: 500px;
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
background:var(--background);
|
||||
|
||||
#ProfilTab-3 .container-fluid {
|
||||
background: white;
|
||||
border-radius: 12px;
|
||||
padding: 30px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background:var(--text-secondary);
|
||||
border-radius:4px;
|
||||
|
||||
#ProfilTab-3 h4 {
|
||||
color: #2c3e50;
|
||||
font-weight: 600;
|
||||
margin-bottom: 25px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 3px solid #3498db;
|
||||
display: inline-block;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background:var(--text-primary);
|
||||
|
||||
#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;
|
||||
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;
|
||||
}
|
||||
@@ -1,417 +1,228 @@
|
||||
(() => {
|
||||
function createSecurityTab() {
|
||||
return `
|
||||
<div class="security-content">
|
||||
<div class="setup-steps">
|
||||
<div class="step-card">
|
||||
<h3>1. lépés: Hitelesítési alkalmazás telepítése</h3>
|
||||
<p>A kétfaktoros hitelesítés használatához telepítsen egy időalapú, egyszer használatos jelszó (TOTP) alkalmazást:</p>
|
||||
|
||||
<div class="app-grid">
|
||||
<div class="app-section">
|
||||
<h4>Android</h4>
|
||||
<div class="app-links">
|
||||
<a href="https://play.google.com/store/apps/details?id=hu.innobile.niszauth" target="_blank" class="app-link">
|
||||
<span class="material-icons-round">download</span>
|
||||
NISZ Hitelesítő
|
||||
</a>
|
||||
<a href="https://play.google.com/store/apps/details?id=com.azure.authenticator" target="_blank" class="app-link">
|
||||
<span class="material-icons-round">download</span>
|
||||
Microsoft Authenticator
|
||||
</a>
|
||||
<a href="https://play.google.com/store/apps/details?id=com.google.android.apps.authenticator2" target="_blank" class="app-link">
|
||||
<span class="material-icons-round">download</span>
|
||||
Google Authenticator
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="app-section">
|
||||
<h4>iPhone</h4>
|
||||
<div class="app-links">
|
||||
<a href="https://apps.apple.com/hu/app/nisz-hiteles%C3%ADt%C5%91/id1603444961" target="_blank" class="app-link">
|
||||
<span class="material-icons-round">download</span>
|
||||
NISZ Hitelesítő
|
||||
</a>
|
||||
<a href="https://apps.apple.com/hu/app/microsoft-authenticator/id983156458" target="_blank" class="app-link">
|
||||
<span class="material-icons-round">download</span>
|
||||
Microsoft Authenticator
|
||||
</a>
|
||||
<a href="https://apps.apple.com/hu/app/google-authenticator/id388497605" target="_blank" class="app-link">
|
||||
<span class="material-icons-round">download</span>
|
||||
Google Authenticator
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="step-card">
|
||||
<h3>2. lépés: Kétfaktoros azonosítás beállítása</h3>
|
||||
<div class="setup-form">
|
||||
<div class="form-group">
|
||||
<button type="button" class="btn-save" id="enable2FA">Kétfaktoros azonosítás bekapcsolása</button>
|
||||
</div>
|
||||
|
||||
<div id="qrSetup" style="display: none;">
|
||||
<div class="qr-container">
|
||||
<img id="qrCode" alt="QR kód" style="display: none;">
|
||||
<div class="setup-key">
|
||||
<label class="form-label">Biztonsági kulcs:</label>
|
||||
<div class="key-display">
|
||||
<code id="secretKey"></code>
|
||||
<button type="button" class="btn-copy" id="copyKey">
|
||||
<span class="material-icons-round">content_copy</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="form-label" for="verificationCode">Ellenőrző kód</label>
|
||||
<input type="text" class="form-control" id="verificationCode" maxlength="6" placeholder="123456">
|
||||
<small class="form-text">Adja meg a hitelesítő alkalmazásban megjelenő 6 számjegyű kódot.</small>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<button type="button" class="btn-save" id="verify2FA">Ellenőrzés és aktiválás</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="step-card" id="backupCodes" style="display: none;">
|
||||
<h3>3. lépés: Biztonsági kódok mentése</h3>
|
||||
<p>Az alábbi biztonsági kódokat használhatja bejelentkezéshez, ha nem fér hozzá a hitelesítő alkalmazásához. Minden kód csak egyszer használható.</p>
|
||||
|
||||
<div class="backup-codes">
|
||||
<pre id="backupCodesList"></pre>
|
||||
<button type="button" class="btn-save" id="downloadCodes">
|
||||
<span class="material-icons-round">download</span>
|
||||
Kódok letöltése
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
(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();
|
||||
|
||||
function createContactTab() {
|
||||
return `
|
||||
<div class="contact-form">
|
||||
<div class="form-group">
|
||||
<label class="form-label" for="email">E-mail cím</label>
|
||||
<input type="email" class="form-control" id="email" required>
|
||||
<small class="form-text">Az e-mail cím megadása a jelszó emlékeztető miatt szükséges.</small>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label" for="phone">Telefonszám</label>
|
||||
<input type="tel" class="form-control" id="phone" placeholder="+36 xx xxx xxxx">
|
||||
<small class="form-text">A telefonszám megadása nem kötelező.</small>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<button type="button" class="btn-save" id="saveContacts">Mentés</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
function createPasswordTab() {
|
||||
return `
|
||||
<div class="password-form">
|
||||
<div class="form-group">
|
||||
<label class="form-label" for="currentPassword">Jelenlegi jelszó</label>
|
||||
<input type="password" class="form-control" id="currentPassword" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label" for="newPassword">Új jelszó</label>
|
||||
<input type="password" class="form-control" id="newPassword" required minlength="8">
|
||||
<small class="form-text">A jelszónak legalább 8 karakter hosszúnak kell lennie.</small>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label" for="confirmPassword">Új jelszó megerősítése</label>
|
||||
<input type="password" class="form-control" id="confirmPassword" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<button type="button" class="btn-save" id="savePassword">Jelszó módosítása</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
function createSettingsTab() {
|
||||
return `
|
||||
<div class="settings-form">
|
||||
<div class="form-group">
|
||||
<label class="form-label">
|
||||
<input type="checkbox" id="hideTips">
|
||||
Tippek elrejtése
|
||||
</label>
|
||||
<small class="form-text">A tippek megjelenítésének ki/be kapcsolása.</small>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<button type="button" class="btn-save" id="saveSettings">Mentés</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
function setupContactForm() {
|
||||
const form = document.querySelector(".contact-form");
|
||||
if (!form) return;
|
||||
|
||||
const emailInput = form.querySelector("#email");
|
||||
const phoneInput = form.querySelector("#phone");
|
||||
const saveButton = form.querySelector("#saveContacts");
|
||||
|
||||
emailInput.value = cookieManager.get("userEmail") || "";
|
||||
phoneInput.value = cookieManager.get("userPhone") || "";
|
||||
|
||||
saveButton?.addEventListener("click", async () => {
|
||||
const email = emailInput.value.trim();
|
||||
const phone = phoneInput.value.trim();
|
||||
|
||||
if (!email) {
|
||||
alert(LanguageManager.t("profile.email_required"));
|
||||
return;
|
||||
}
|
||||
|
||||
if (email && !isValidEmail(email)) {
|
||||
alert(LanguageManager.t("profile.invalid_email"));
|
||||
return;
|
||||
}
|
||||
|
||||
if (phone && !isValidPhone(phone)) {
|
||||
alert(LanguageManager.t("profile.invalid_phone"));
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(
|
||||
"/Adminisztracio/Profil/SaveElerhetosegek",
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
RequestVerificationToken: document.querySelector(
|
||||
'input[name="__RequestVerificationToken"]',
|
||||
).value,
|
||||
},
|
||||
body: JSON.stringify({ email, phone }),
|
||||
},
|
||||
);
|
||||
|
||||
if (response.ok) {
|
||||
alert(LanguageManager.t("profile.contacts_saved"));
|
||||
} else {
|
||||
throw new Error(LanguageManager.t("profile.contacts_save_error"));
|
||||
}
|
||||
} catch (error) {
|
||||
alert(LanguageManager.t("profile.save_error"));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function isValidEmail(email) {
|
||||
return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
|
||||
}
|
||||
|
||||
function isValidPhone(phone) {
|
||||
return /^\+?[0-9\s-]{9,}$/.test(phone);
|
||||
}
|
||||
|
||||
function setupEventListeners() {
|
||||
document.querySelectorAll(".tab-header").forEach((header) => {
|
||||
header.addEventListener("click", () => {
|
||||
document
|
||||
.querySelectorAll(".tab-header")
|
||||
.forEach((h) => h.classList.remove("active"));
|
||||
document
|
||||
.querySelectorAll(".tab-content")
|
||||
.forEach((c) => c.classList.remove("active"));
|
||||
|
||||
header.classList.add("active");
|
||||
const targetId = header.dataset.tab;
|
||||
document.getElementById(`${targetId}-content`).classList.add("active");
|
||||
});
|
||||
});
|
||||
|
||||
const userBtn = document.querySelector(".user-dropdown-btn");
|
||||
const userDropdown = document.querySelector(".user-dropdown");
|
||||
|
||||
userBtn?.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
userDropdown?.classList.toggle("show");
|
||||
});
|
||||
|
||||
document.addEventListener("click", () => {
|
||||
userDropdown?.classList.remove("show");
|
||||
});
|
||||
|
||||
document
|
||||
.getElementById("saveSettings")
|
||||
?.addEventListener("click", async () => {
|
||||
const hideTips = document.getElementById("hideTips").checked;
|
||||
|
||||
try {
|
||||
const response = await fetch(
|
||||
"/Adminisztracio/Profil/SaveTippekBeallitasa",
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
RequestVerificationToken: document.querySelector(
|
||||
'input[name="__RequestVerificationToken"]',
|
||||
).value,
|
||||
},
|
||||
body: JSON.stringify({ hideTips }),
|
||||
},
|
||||
);
|
||||
|
||||
if (response.ok) {
|
||||
alert(LanguageManager.t("profile.settings_saved"));
|
||||
} else {
|
||||
throw new Error(LanguageManager.t("profile.settings_save_error"));
|
||||
}
|
||||
} catch (error) {
|
||||
alert(LanguageManager.t("profile.save_error"));
|
||||
}
|
||||
});
|
||||
|
||||
document
|
||||
.getElementById("savePassword")
|
||||
?.addEventListener("click", async () => {
|
||||
const currentPassword =
|
||||
document.getElementById("currentPassword").value;
|
||||
const newPassword = document.getElementById("newPassword").value;
|
||||
const confirmPassword =
|
||||
document.getElementById("confirmPassword").value;
|
||||
|
||||
if (!currentPassword || !newPassword || !confirmPassword) {
|
||||
alert(LanguageManager.t("profile.fill_all_fields"));
|
||||
return;
|
||||
}
|
||||
|
||||
if (newPassword !== confirmPassword) {
|
||||
alert(LanguageManager.t("profile.passwords_not_match"));
|
||||
return;
|
||||
}
|
||||
|
||||
if (newPassword.length < 8) {
|
||||
alert(LanguageManager.t("profile.password_min_length"));
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(
|
||||
"/Adminisztracio/Profil/SaveJelszoModositas",
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
RequestVerificationToken: document.querySelector(
|
||||
'input[name="__RequestVerificationToken"]',
|
||||
).value,
|
||||
},
|
||||
body: JSON.stringify({
|
||||
currentPassword,
|
||||
newPassword,
|
||||
confirmPassword,
|
||||
}),
|
||||
},
|
||||
);
|
||||
|
||||
if (response.ok) {
|
||||
alert(LanguageManager.t("profile.password_changed"));
|
||||
document.getElementById("currentPassword").value = "";
|
||||
document.getElementById("newPassword").value = "";
|
||||
document.getElementById("confirmPassword").value = "";
|
||||
} else {
|
||||
throw new Error(LanguageManager.t("profile.password_change_error"));
|
||||
}
|
||||
} catch (error) {
|
||||
alert(LanguageManager.t("profile.password_change_error"));
|
||||
}
|
||||
});
|
||||
|
||||
const timerEl = document.getElementById("logoutTimer");
|
||||
if (timerEl) {
|
||||
const startTime = parseInt(
|
||||
timerEl.textContent?.match(/\d+/)?.[0] || "45",
|
||||
);
|
||||
let timeLeft = startTime * 60;
|
||||
|
||||
const updateTimer = () => {
|
||||
const minutes = Math.floor(timeLeft / 60);
|
||||
const seconds = timeLeft % 60;
|
||||
timerEl.textContent = `${minutes}:${seconds.toString().padStart(2, "0")}`;
|
||||
|
||||
if (timeLeft <= 0) {
|
||||
window.location.href = "/Home/Logout";
|
||||
} else {
|
||||
timeLeft--;
|
||||
}
|
||||
};
|
||||
|
||||
updateTimer();
|
||||
setInterval(updateTimer, 1000);
|
||||
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 createProfileHTML() {
|
||||
return `
|
||||
<div class="kreta-container">
|
||||
${createTemplate.header()}
|
||||
|
||||
<main class="kreta-main">
|
||||
<div class="card">
|
||||
<h2>Profil beállítások</h2>
|
||||
<div class="profile-tabs">
|
||||
<div class="tab-headers">
|
||||
<button class="tab-header active" data-tab="settings">Beállítások</button>
|
||||
<button class="tab-header" data-tab="password">Jelszó módosítása</button>
|
||||
<button class="tab-header" data-tab="security">Biztonsági beállítások</button>
|
||||
<button class="tab-header" data-tab="contacts">Elérhetőségek</button>
|
||||
</div>
|
||||
|
||||
<div id="settings-content" class="tab-content active">
|
||||
${createSettingsTab()}
|
||||
</div>
|
||||
|
||||
<div id="password-content" class="tab-content">
|
||||
${createPasswordTab()}
|
||||
</div>
|
||||
|
||||
<div id="security-content" class="tab-content">
|
||||
${createSecurityTab()}
|
||||
</div>
|
||||
|
||||
<div id="contacts-content" class="tab-content">
|
||||
${createContactTab()}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
function addBackButton() {
|
||||
|
||||
if (document.getElementById('firka-back-button')) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
const backButton = document.createElement('button');
|
||||
backButton.id = 'firka-back-button';
|
||||
backButton.innerHTML = '← 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)';
|
||||
});
|
||||
|
||||
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)';
|
||||
});
|
||||
|
||||
|
||||
backButton.addEventListener('click', function() {
|
||||
window.history.back();
|
||||
});
|
||||
|
||||
|
||||
document.body.insertBefore(backButton, document.body.firstChild);
|
||||
|
||||
async function init() {
|
||||
if (window.location.pathname.includes("/Adminisztracio/Profil")) {
|
||||
document.body.innerHTML = '';
|
||||
const parser = new DOMParser();
|
||||
const doc = parser.parseFromString(createProfileHTML(), 'text/html');
|
||||
const tempDiv = doc.body;
|
||||
while (tempDiv.firstChild) {
|
||||
document.body.appendChild(tempDiv.firstChild);
|
||||
}
|
||||
setupUserDropdown();
|
||||
setupMobileNavigation();
|
||||
setupEventListeners();
|
||||
setupContactForm();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
init();
|
||||
})();
|
||||
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');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
const contentPanel = document.querySelector('#ProfilTab-1');
|
||||
if (contentPanel) {
|
||||
contentPanel.classList.add('hidden-tab');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function hideAdditionalContactInfo() {
|
||||
|
||||
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');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
hideElementsWithText('TOVÁBBI E-MAIL ELÉRHETŐSÉGEK');
|
||||
hideElementsWithText('TOVÁBBI TELEFONSZÁMOK');
|
||||
|
||||
|
||||
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');
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function init() {
|
||||
hideLoadingScreen();
|
||||
addBackButton();
|
||||
hideAdditionalContactInfo();
|
||||
hideCustomUserSettingsTab();
|
||||
hideMainFooter2();
|
||||
hideLakatImg();
|
||||
|
||||
|
||||
const observer = new MutationObserver(() => {
|
||||
hideAdditionalContactInfo();
|
||||
hideCustomUserSettingsTab();
|
||||
hideMainFooter2();
|
||||
hideLakatImg();
|
||||
});
|
||||
|
||||
observer.observe(document.body, {
|
||||
childList: true,
|
||||
subtree: true
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
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
|
||||
});
|
||||
}
|
||||
|
||||
})();
|
||||
@@ -744,9 +744,10 @@ body {
|
||||
opacity:1;
|
||||
}
|
||||
.modal-content {
|
||||
background:var(--card-card);
|
||||
background:var(--card-card) !important;
|
||||
border-radius:24px;
|
||||
border-width:0 !important;
|
||||
box-shadow: 0 1px var(--shadow-blur) 0 var(--accent-shadow);
|
||||
width:100%;
|
||||
max-width:500px;
|
||||
max-height:90vh;
|
||||
@@ -766,6 +767,7 @@ body {
|
||||
align-items:center;
|
||||
padding:1.5rem;
|
||||
background:var(--button-secondaryFill);
|
||||
border: none !important;
|
||||
}
|
||||
.modal-title {
|
||||
font-size:18px;
|
||||
@@ -842,11 +844,8 @@ body {
|
||||
}
|
||||
.test-details {
|
||||
color:var(--text-primary);
|
||||
margin-top:0.5rem;
|
||||
padding:0.75rem;
|
||||
background:var(--background-0);
|
||||
border-radius:6px;
|
||||
border-left:3px solid var(--warning-accent);
|
||||
}
|
||||
|
||||
.test-details p {
|
||||
|
||||
Reference in New Issue
Block a user