Skip to content

🔮 clearer colors + fixed hover effect #4

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
BB-69 wants to merge 4 commits into
base: main
Choose a base branch
from
Open

🔮 clearer colors + fixed hover effect #4

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
46978d6
🔮 update: idk, got the source from another mastermind
BB-69 Jul 25, 2025
8555167
🔮 update: clearer colors + fixed hover effect light theme
BB-69 Jul 27, 2025
5c6a6c2
✂ nah, why is this here
BB-69 Jul 27, 2025
a12d8cd
⚙ updated to avoid base conflict
BB-69 Jul 27, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "kmitl-x",
"description": "Transform your KMITL timetable into a sleek, modern, and user-friendly interface",
"version": "1.2.6",
"version": "1.2.7",
"license": "MIT",
"type": "module",
"scripts": {
Expand Down
5 changes: 3 additions & 2 deletions src/libs/components/scheduleTable/CardSubject.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,8 @@
</script>

<div
class=" dark:bg-orange-500/10 bg-orange-100/50 border-l-2 dark:border-orange-400 border-orange-200 px-3 py-1 h-full flex flex-col justify-between rounded
class="relative z-5 dark:bg-orange-500/10 bg-orange-100/50 overflow-hidden border-l-4 border-2 border-orange-400/15
border-l-orange-400/70 dark:border-l-orange-400 px-3 py-1 h-full flex flex-col justify-between rounded
hover:border-orange-500 dark:hover:border-orange-600 transition-all dark:text-orange-300 text-black"
>
<div class="flex justify-between text-xs opacity-65 z-10">
Expand All @@ -14,7 +15,7 @@
{subject.time.end}
</p>
</div>
<h3 class="text-orange-400 text-left text-sm">{subject.name}</h3>
<h3 class="text-orange-500 text-left text-sm z-10">{subject.name}</h3>
<div class="flex justify-between text-xs opacity-65">
<p class="whitespace-nowrap">
section({subject.time.type == "ทฤษฏี"
Expand Down
29 changes: 23 additions & 6 deletions src/libs/components/scheduleTable/ScheduleTable.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
<th></th>
{#each Array.from({ length: 20 - 8 }, (_, i) => i + 8) as hour}
{#if hour < 20 - 1}
<th class="border-x dark:border-orange-100/10 border-orange-100 w-[8.33%]" colspan="4">
<th class="border-x dark:border-orange-100/10 border-zinc-400/50 w-[8.33%]" colspan="4">
{`${formatTime(hour)} - ${formatTime(hour + 1)}`}
</th>
{/if}
Expand All @@ -34,17 +34,18 @@
</thead>
<tbody>
{#each days as day}
<tr class="hover:bg-orange-100/20 dark:hover:bg-orange-100/5 group">
<tr class="group">
<td
class="text-right font-semibold text-sm dark:text-orange-400 text-orange-300 whitespace-nowrap group-hover:scale-125 group-hover:text-orange-400 dark:group-hover:text-orange-600 transition-all"
class="td-day text-right font-semibold text-sm dark:text-orange-400 text-orange-500 whitespace-nowrap
group-hover:scale-125 group-hover:text-orange-400 dark:group-hover:text-orange-600 transition-all"
>
{day.name}
</td>
{#each createTimeSlot(schedule, day.code) as slot}
{#if slot == undefined}
<td class="border-x dark:border-orange-100/10 border-orange-100"></td>
<td class="row-hover-overlay border-x dark:border-orange-100/10 border-zinc-400/50"></td>
{:else}
<td colspan={slot.colSpan}>
<td class="row-hover-overlay" colspan={slot.colSpan}>
<CardSubject subject={slot} />
</td>
{/if}
Expand All @@ -56,10 +57,26 @@
</div>

<style scoped>
/* table rows hover effects */
tr.group > td.row-hover-overlay {
position: relative;
}
tr.group > td.row-hover-overlay::before {
@apply absolute inset-0 bg-black/10 dark:bg-white/5 opacity-0 pointer-events-none transition;
content: "";
}
tr.group:hover > td.row-hover-overlay::before {
@apply opacity-100;
}

th {
@apply font-prompt font-normal whitespace-nowrap text-orange-400;
@apply font-prompt font-normal whitespace-nowrap text-orange-500;
}
td {
@apply font-prompt w-[2.22%] p-1 h-28;
}

.td-day {
@apply px-2 py-0 w-auto;
}
</style>
9 changes: 3 additions & 6 deletions src/libs/utils/ScheduleTableScraping.ts
View file
Open in desktop
Copy link
Author

@BB-69 BB-69 Jul 27, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

idk what this does but seems like the files i got is not the same with this current one so ¯_(ツ)_/¯

Original file line number Diff line number Diff line change
Expand Up @@ -71,12 +71,9 @@ export default class ScheduleTableScraping {
.slice(1);

for (const data of studyTableRowsArray) {
const timeText = data.childNodes[25].textContent ?? "";
const matches = timeText.match(/((?:[ก-ฮ]{1,2}|อา)\.\s*\d{2}:\d{2}-\d{2}:\d{2}\s*น?\.?\([ทป]\))/g) || [];
for (let i = 0; i < matches.length; i++) {
const tempNode = data.childNodes;
tempNode[25].textContent = matches[i].trim();
scheduleData.push(this.parseScheduleData(tempNode));
scheduleData.push(this.parseScheduleData(data.childNodes));
if (data.childNodes[21].textContent != "-") {
scheduleData.push(this.parseScheduleData(data.childNodes, 2));
}
}

Expand Down
2 changes: 1 addition & 1 deletion src/pages/StudentTable.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
let originalTableToggle: boolean = true;
let copyPngToggle: boolean = false;

let originalTableRawHTML: string;
let originalTableRawHTML: string = "";

originalTable.subscribe((value) => {
originalTableRawHTML = value;
Expand Down
Loading