${createTemplate.header()}
@@ -136,6 +131,7 @@ async function transformHomeworkPage() {
setupFilters(homeworkItems, groupedHomework);
setupUserDropdown();
+ setupMobileNavigation();
loadingScreen.hide();
}
@@ -304,11 +300,11 @@ function setupFilters(homeworkItems, groupedHomework) {
const startOfWeek = new Date(today);
- const dayOfWeek = today.getDay() || 7; // Convert Sunday from 0 to 7
- startOfWeek.setDate(today.getDate() - dayOfWeek + 1); // Monday
+ const dayOfWeek = today.getDay() || 7;
+ startOfWeek.setDate(today.getDate() - dayOfWeek + 1);
const endOfWeek = new Date(startOfWeek);
- endOfWeek.setDate(startOfWeek.getDate() + 6); // Sunday
+ endOfWeek.setDate(startOfWeek.getDate() + 6);
const startOfNextWeek = new Date(endOfWeek);
diff --git a/profile/profile.css b/profile/profile.css
index ef4ea38..7ac6dc3 100644
--- a/profile/profile.css
+++ b/profile/profile.css
@@ -59,37 +59,6 @@ body {
max-width: 300px;
}
-
-.nav-links {
- display: flex;
- gap: clamp(0.5rem, 2vw, 1rem);
- padding: 0.25rem;
- justify-content: center;
-}
-
-.nav-links a {
- color: var(--text-secondary);
- text-decoration: none;
- padding: clamp(0.5rem, 1.5vw, 1rem) 0.5rem;
- font-weight: 500;
- white-space: nowrap;
- transition: all 0.2s ease;
- display: flex;
- align-items: center;
- gap: 0.5rem;
- border-radius: 8px;
-}
-
-.nav-links a:hover {
- color: var(--text-primary);
- background-color: var(--card-card);
-}
-
-.nav-links a.active {
- color: var(--accent-accent);
-}
-
-
.user-profile {
position: relative;
justify-self: flex-end;
@@ -115,19 +84,6 @@ body {
text-align: right;
}
-.user-name {
- display: block;
- color: var(--text-primary);
- font-size: 16px;
- font-weight: 500;
-}
-
-.user-time {
- display: block;
- color: var(--text-secondary);
- font-size: 14px;
-}
-
.user-dropdown {
position: absolute;
top: 100%;
@@ -426,10 +382,10 @@ body {
@media (max-width: 768px) {
.kreta-header {
- grid-template-columns: 1fr auto;
+ grid-template-columns: 1fr auto auto;
grid-template-areas:
- "school user"
- "nav nav";
+ "school toggle user"
+ "nav nav nav";
padding: 1rem;
gap: 0.5rem;
}
@@ -438,12 +394,6 @@ body {
grid-area: school;
}
- .nav-links {
- grid-area: nav;
- margin-top: 0.5rem;
- justify-content: flex-start;
- }
-
.user-profile {
grid-area: user;
}
diff --git a/profile/profile.js b/profile/profile.js
index 9802f5b..a5de3f6 100644
--- a/profile/profile.js
+++ b/profile/profile.js
@@ -385,6 +385,8 @@
createTemplate.importFonts();
document.body.innerHTML = createProfileHTML();
+ setupUserDropdown();
+ setupMobileNavigation();
setupEventListeners();
setupContactForm();
}
diff --git a/timetable/timetable.css b/timetable/timetable.css
index 372e198..9b6b0a3 100644
--- a/timetable/timetable.css
+++ b/timetable/timetable.css
@@ -72,10 +72,10 @@ body {
@media (max-width: 768px) {
.kreta-header {
- grid-template-columns: 1fr auto;
+ grid-template-columns: 1fr auto auto;
grid-template-areas:
- "school user"
- "nav nav";
+ "school toggle user"
+ "nav nav nav";
padding: 1rem;
gap: 0.5rem;
}
@@ -140,81 +140,6 @@ body {
}
}
-/* Updated navigation styles */
-.kreta-nav {
- padding: 0 clamp(0.5rem, 3vw, 1.5rem);
- position: sticky;
- top: 0;
- z-index: 100;
- overflow-x: auto;
- -webkit-overflow-scrolling: touch;
- scrollbar-width: none;
- -ms-overflow-style: none;
- display: flex;
- justify-content: center;
-}
-
-@media (max-width: 768px) {
- .kreta-nav {
- grid-area: nav;
- padding: 0;
- margin-top: 0.5rem;
- }
-}
-
-.kreta-nav::-webkit-scrollbar {
- display: none;
-}
-
-.nav-links {
- display: flex;
- gap: clamp(0.5rem, 2vw, 1rem);
- padding: 0.25rem;
- justify-content: center;
-}
-
-@media (max-width: 768px) {
- .nav-links {
- justify-content: flex-start;
- width: 100%;
- gap: 0.25rem;
- }
-}
-
-.nav-links a {
- color: var(--text-secondary);
- text-decoration: none;
- padding: clamp(0.5rem, 1.5vw, 1rem) 0.5rem;
- font-weight: 500;
- white-space: nowrap;
- transition: all 0.2s ease;
- display: flex;
- align-items: center;
- gap: 0.5rem;
- border-radius: 8px;
-}
-
-@media (max-width: 768px) {
- .nav-links a {
- padding: 0.5rem;
- font-size: 13px;
- }
-
- .nav-links a .material-icons-round {
- font-size: 20px;
- }
-}
-
-.nav-links a:hover {
- color: var(--text-primary);
- text-decoration: none;
- background-color: var(--card-card);
-}
-
-.nav-links a.active {
- color: var(--accent-accent);
-}
-
/* User profile styles */
.user-profile {
position: relative;
@@ -247,19 +172,6 @@ body {
text-align: right;
}
-.user-name {
- display: block;
- color: var(--text-primary);
- font-size: 16px;
- font-weight: 500;
-}
-
-.user-time {
- display: block;
- color: var(--text-secondary);
- font-size: 14px;
-}
-
.user-dropdown {
position: absolute;
top: 100%;
@@ -292,7 +204,6 @@ body {
background: var(--button-secondaryFill);
}
-/* Main content styles */
.kreta-main {
flex: 1;
padding: clamp(1rem, 3vw, 2rem);
@@ -301,12 +212,10 @@ body {
width: 100%;
}
-/* Disable Kréta styles */
.k-overlay, .k-widget.k-window {
display: none !important;
}
-/* Card styles */
.card {
border-radius: 24px;
overflow: hidden;
@@ -314,7 +223,6 @@ body {
margin-bottom: 1rem;
}
-/* Timetable specific styles */
.timetable-grid {
display: grid;
grid-template-columns: 80px repeat(5, 1fr);
@@ -489,7 +397,6 @@ body {
font-size: 14px;
}
-/* Week selector styling */
.week-controls {
display: flex;
gap: 16px;
@@ -530,7 +437,6 @@ body {
color: var(--accent-accent);
}
-/* Responsive adjustments */
@media (max-width: 1024px) {
.timetable-grid {
grid-template-columns: 60px repeat(5, minmax(200px, 1fr));
@@ -561,7 +467,6 @@ body {
}
}
-/* Modal styles */
.lesson-modal {
display: none;
position: fixed;
@@ -741,27 +646,11 @@ body {
text-align: center;
}
- .nav-links {
- justify-content: start;
- overflow-x: auto;
- padding-bottom: 0.5rem;
- }
-
- .nav-links::-webkit-scrollbar {
- display: none;
- }
-
.lesson-cell {
min-width: 200px;
}
}
-/* Material Icons */
-.material-icons-round {
- font-size: 20px;
- vertical-align: middle;
-}
-
/* Scrollbar styling */
::-webkit-scrollbar {
width: 8px;
diff --git a/timetable/timetable.js b/timetable/timetable.js
index f012e09..b2374c7 100644
--- a/timetable/timetable.js
+++ b/timetable/timetable.js
@@ -1,27 +1,20 @@
(() => {
- // Órarendi adatok gyűjtése
async function collectTimetableData() {
await helper.waitForElement('#Calendar');
await helper.waitForElement('.modalBckgroundMain:not(.isOverlayActiv)');
- const calendar = document.querySelector('#Calendar');
const dates = Array.from(document.querySelectorAll('.fc-day-header')).map(header => {
const fullText = header.textContent.trim();
- // Remove the day name from the beginning and clean up the format
const dateText = fullText.replace(/^(hétfő|kedd|szerda|csütörtök|péntek)/, '').trim();
return {
date: fullText,
formattedDate: dateText
};
});
- // Fix the Thursday issue by ensuring we have all 5 days
if (dates.length === 4) {
- // Get Wednesday's date parts
const wedDate = dates[2].formattedDate;
const [month, day] = wedDate.split(' ');
const dayNum = parseInt(day.replace('.', ''));
-
- // Create Thursday's date
const thursdayDate = `${month} ${dayNum + 1}.`;
dates.splice(3, 0, {
@@ -29,9 +22,8 @@
formattedDate: thursdayDate
});
}
- // Set week selector based on the current date
const weekOptions = Array.from(document.querySelectorAll('#Calendar_tanevHetek_listbox li'));
- const currentDate = dates[0]?.formattedDate; // Using Monday's date
+ const currentDate = dates[0]?.formattedDate;
const matchingWeek = weekOptions.find(opt => opt.textContent.includes(currentDate));
if (matchingWeek) {
@@ -60,11 +52,10 @@
selected: li.classList.contains('k-state-selected')
}))
},
- weekDates: dates, // Add the dates to the data object
+ weekDates: dates,
lessons: []
};
-
- // Órák adatainak gyűjtése
+
for (const event of document.querySelectorAll('.fc-event')) {
const timeEl = event.querySelector('.fc-time');
const titleEl = event.querySelector('.fc-title');
@@ -101,7 +92,6 @@
return timetableData;
}
- // Grid generálása
function generateTimeGrid(lessons, weekDates) {
const times = [...new Set(lessons.map(l => l.startTime))].sort((a, b) => {
const timeA = helper.convertTimeToMinutes(a);
@@ -157,7 +147,6 @@
`).join('')}
`;
}
- // Óra részletek modal
function showLessonModal(lesson) {
const modal = document.createElement('div');
modal.className = 'lesson-modal';
@@ -229,7 +218,6 @@
document.body.appendChild(modal);
- // Modal bezárás
const closeModal = () => {
modal.classList.remove('show');
setTimeout(() => modal.remove(), 300);
@@ -240,7 +228,6 @@
if (e.target === modal) closeModal();
});
- // ESC gomb kezelése
const handleEscape = (e) => {
if (e.key === 'Escape') {
closeModal();
@@ -249,15 +236,12 @@
};
document.addEventListener('keydown', handleEscape);
- // Animáció
requestAnimationFrame(() => {
modal.classList.add('show');
});
}
- // Eseménykezelők beállítása
function setupEventListeners(data) {
- // Órakártyák
document.querySelectorAll('.lesson-card').forEach(card => {
card.addEventListener('click', () => {
const lessonData = JSON.parse(card.dataset.lesson);
@@ -265,7 +249,6 @@
});
});
- // Felhasználói menü
const userBtn = document.querySelector('.user-dropdown-btn');
const userDropdown = document.querySelector('.user-dropdown');
@@ -278,7 +261,6 @@
userDropdown?.classList.remove('show');
});
- // Hét navigáció
const prevBtn = document.querySelector('.prev-week');
const nextBtn = document.querySelector('.next-week');
const weekSelect = document.querySelector('.week-select');
@@ -313,8 +295,6 @@
}
});
}
-
- // Oldal transzformáció
async function transformTimetablePage() {
try {
const data = await collectTimetableData();
@@ -323,9 +303,6 @@
return;
}
- const schoolNameFull = `${data.schoolInfo.id} - ${data.schoolInfo.name}`;
- const shortenedSchoolName = helper.shortenSchoolName(schoolNameFull);
-
document.body.innerHTML = `
${createTemplate.header()}
@@ -357,6 +334,8 @@
`;
createTemplate.importFonts();
+ setupUserDropdown();
+ setupMobileNavigation();
setupEventListeners(data);
loadingScreen.hide();
diff --git a/tools/createTemplate.js b/tools/createTemplate.js
index 47e91ad..5c8e9c5 100644
--- a/tools/createTemplate.js
+++ b/tools/createTemplate.js
@@ -28,6 +28,12 @@ const createTemplate = {