mirror of
https://github.com/affaan-m/ECC.git
synced 2026-10-17 13:45:34 +02:00
Adds a curated, Pi-native, skills+prompts-only profile at pi/core/ for downstream packagers that mirror GitHub Releases. - manifests/pi-core.json: explicit include lists, per-item exclusion reasons, curation rules, safety allowlists; every root skill and command must be classified. - scripts/build-pi-core.js regenerates pi/core deterministically (package.json from VERSION, LICENSE, README.md, CURATION.md, skills/, commands/); --check fails CI on drift. council is renamed ecc-council inside pi/core only. - Safety checks: no callable endpoints outside the allowlist, no npx/curl|sh/pip install, no secrets, no absolute home paths, no symlinks, valid frontmatter, no duplicate names. - CI: build + drift check and an offline Pi CLI load test of pi/core. - Release: VERSION, package.json and pi/core/package.json at 2.2.2, CHANGELOG, tag-triggered release verification, and a two-week cadence in CONTRIBUTING.md. pi/core: 123 of 293 skills and 24 of 94 commands; 35,006 characters of skill description text.
1.6 KiB
1.6 KiB
Route Transition Animations
Angular Router supports the browser's View Transitions API for smooth visual transitions between routes.
Enabling View Transitions
Add withViewTransitions() to your router configuration.
provideRouter(routes, withViewTransitions());
This is a progressive enhancement. In browsers that don't support the API, the router will still work but without the transition animation.
How it Works
- Browser takes a screenshot of the old state.
- Router updates the DOM (activates new component).
- Browser takes a screenshot of the new state.
- Browser animates between the two states.
Customizing with CSS
Transitions are customized in global CSS files (not component-scoped CSS).
Use the ::view-transition-old() and ::view-transition-new() pseudo-elements.
/* Example: Cross-fade + Slide */
::view-transition-old(root) {
animation: 90ms cubic-bezier(0.4, 0, 1, 1) both fade-out;
}
::view-transition-new(root) {
animation: 210ms cubic-bezier(0, 0, 0.2, 1) 90ms both fade-in;
}
Advanced Control
Use onViewTransitionCreated to skip transitions or customize behavior based on the navigation context.
withViewTransitions({
onViewTransitionCreated: ({transition, from, to}) => {
// Skip animation for specific routes
if (to.url === '/no-animation') {
transition.skipTransition();
}
},
});
Best Practices
- Global Styles: Always define transition animations in
styles.cssto avoid view encapsulation issues. - View Transition Names: Assign unique
view-transition-nameto elements that should transition smoothly across routes (e.g., a header image).