fix: reorder color conditions

[toreis-up]

This pull request updates the logic for determining the color status of timers in both the TimerBar.vue and TimerInlined.vue components. The main change is reordering the conditional checks so that the "overdue" (red) status takes precedence over the "warning" (yellow) status, ensuring that timers exceeding 100% are always shown as red.

Timer color logic update:

• Changed the order of conditional checks in the color computed property in TimerBar.vue so that timers with a percentage over 100 are assigned the "bg-red" class before checking for the "bg-yellow" warning state.
• Updated the color computed property in TimerInlined.vue to apply the "text-red6 dark:text-red3" class when the percentage is over 100 before checking for the yellow warning state, matching the intended priority.

[netlify]

❌ Deploy Preview for slidev failed.

Name	Link
🔨 Latest commit	19a9817
🔍 Latest deploy log	https://app.netlify.com/projects/slidev/deploys/6941642732a44a00084bfaab

[pkg-pr-new]

Open in StackBlitz

@slidev/client

npm i https://pkg.pr.new/slidevjs/slidev/@slidev/client@2411

create-slidev

npm i https://pkg.pr.new/slidevjs/slidev/create-slidev@2411

create-slidev-theme

npm i https://pkg.pr.new/slidevjs/slidev/create-slidev-theme@2411

@slidev/parser

npm i https://pkg.pr.new/slidevjs/slidev/@slidev/parser@2411

@slidev/cli

npm i https://pkg.pr.new/slidevjs/slidev/@slidev/cli@2411

@slidev/types

npm i https://pkg.pr.new/slidevjs/slidev/@slidev/types@2411

commit: 19a9817

[Copilot]

Pull request overview

This PR fixes a logic bug in the timer color status determination for both TimerBar.vue and TimerInlined.vue components. The issue was that timers exceeding 100% were incorrectly displayed in yellow instead of red because the warning threshold (> 80%) was checked before the overdue threshold (> 100%).

Key Changes:

• Reordered conditional checks to prioritize the overdue (red) state over the warning (yellow) state
• Ensures timers with percentage > 100 are always displayed as red, regardless of other thresholds

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.

File	Description
packages/client/internals/TimerInlined.vue	Fixed color logic to check percentage > 100 before checking > 80, ensuring overdue timers display in red text
packages/client/internals/TimerBar.vue	Fixed color logic to check percentage > 100 before checking > 80, ensuring overdue timers display with red background

---

After reviewing the changes, I found no issues with this pull request. The fix correctly addresses the bug by reordering the conditional checks so that the more critical condition (percentage > 100) is evaluated before the less critical condition (percentage > 80). This ensures timers that are overdue are always displayed in red as intended. The changes are consistent across both components and follow the same logic pattern.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.