Extract blur animation constants to shared module - #15
Open
injoon5 wants to merge 2 commits into
Open
Conversation
… timing Adds the same blur(4px)/opacity transition to calendar month changes that meals and timetable already use on their selector changes. Extracts BLUR_TRANSITION_MS (100ms) and BLUR_TIMER_MS (150ms) into a shared $lib/animation.ts so all three pages stay in sync; durations are slightly shorter than the previous hardcoded 150ms/200ms. https://claude.ai/code/session_012Rizz6AWf3faNH58eNpKvz
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
The blur now clears as soon as Convex delivers new data (via a $effect tracking both query .data references), rather than always waiting for a fixed timer. The fallback timer is kept for same-year month hops where no new fetch occurs and data references don't change. https://claude.ai/code/session_012Rizz6AWf3faNH58eNpKvz
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Refactored blur animation timing values into a centralized configuration module to improve maintainability and consistency across the application.
Key Changes
apps/web/src/lib/animation.tsmodule with exported animation constants:BLUR_TRANSITION_MS = 100- CSS transition duration for blur effectsBLUR_TIMER_MS = 150- Timeout duration for blur state managementapps/web/src/routes/calendar/+page.svelte- Added blur effect logic and replaced hardcoded transition valuesapps/web/src/routes/meals/+page.svelte- Replaced hardcoded200mstimer and150mstransition with constantsapps/web/src/routes/timetable/+page.svelte- Replaced hardcoded200mstimer and150mstransition with constantsImplementation Details
https://claude.ai/code/session_012Rizz6AWf3faNH58eNpKvz