diff options
| author |  Martin Trapp <94928215+martrapp@users.noreply.github.com>
| 2024-02-26 17:04:57 +0100 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2024-02-26 17:04:57 +0100 |
| commit | ade9759cae74ca262b988260250bcb202235e811 (patch) | |
| tree | 548906cb3777a178284a089e81348bf5ac2a2b7b | |
| parent | 6012163d8f015d60cbf40bf17caa792254e9b859 (diff) | |
| download | astro-ade9759cae74ca262b988260250bcb202235e811.tar.gz astro-ade9759cae74ca262b988260250bcb202235e811.tar.zst astro-ade9759cae74ca262b988260250bcb202235e811.zip | |
Warn when view transitions run on a prefer-reduced-motion device (#10222)
* Warn when view transitions run on a prefere-reduced-motion device
* ViewTransitions.astro aktualisieren
Co-authored-by: Emanuele Stoppa <my.burning@gmail.com>
---------
Co-authored-by: Emanuele Stoppa <my.burning@gmail.com>
| -rw-r--r-- | .changeset/wicked-eyes-prove.md | 5 | ||||
| -rw-r--r-- | packages/astro/components/ViewTransitions.astro | 3 |
2 files changed, 8 insertions, 0 deletions
diff --git a/.changeset/wicked-eyes-prove.md b/.changeset/wicked-eyes-prove.md new file mode 100644 index 000000000..4e907e00f --- /dev/null +++ b/.changeset/wicked-eyes-prove.md @@ -0,0 +1,5 @@ +--- +"astro": patch +--- + +Adds a warning in DEV mode when using view transitions on a device with prefer-reduced-motion enabled. diff --git a/packages/astro/components/ViewTransitions.astro b/packages/astro/components/ViewTransitions.astro index bf372f15c..97bf62096 100644 --- a/packages/astro/components/ViewTransitions.astro +++ b/packages/astro/components/ViewTransitions.astro @@ -51,6 +51,9 @@ const { fallback = 'animate' } = Astro.props; } if (supportsViewTransitions || getFallback() !== 'none') { + if (import.meta.env.DEV && window.matchMedia('(prefers-reduced-motion)').matches) { + console.warn(`[transitions]: all view transition animations, including fallback animation, are disabled as this device has the prefer-reduced-motion setting enabled.`); + } document.addEventListener('click', (ev) => { let link = ev.target; if (ev.composed) { |