vue3-mq/README.md

Build responsive design into your Vue 3 app

<p align="center">
  <a href="https://vuepress.vuejs.org/" target="_blank">
    <img width="450" src="https://github.com/craigrileyuk/vue3-mq/blob/4b5919c9f20a75eddb9f2f060d70b9204fb24b2a/docs/.vuepress/public/images/logo.png" alt="logo">
  </a>
</p>

<p align="center">
  <img src="https://img.shields.io/npm/dm/vue3-mq.svg" alt="Downloads"></a>
  <a href="https://www.npmjs.com/package/vue3-mq"><img src="https://img.shields.io/npm/v/vue3-mq.svg" alt="Version"></a>
  <a href="https://github.com/craigrileyuk/vue3-mq/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/vue3-mq.svg" alt="License"></a>
</p>

Bring fully reactive, responsive design to your Vue 3 project with Vue3-MQ, a plugin which allows your components and pages to adapt to changes in the browser environment.

-   Completely customisable breakpoints
-   Includes MQ-Responsive Vue component for unparalleled ease of use
-   Access a fully reactive environment analysis object
-   Adapt to your users' preference for light or dark themes
-   React to changes in screen orientation
-   Respect user preference for reduced motion direct in your Vue files
-   Choose from a range of breakpoint presets, including Bootstrap 4, Bootstrap 5, Vuetify or Tailwind
-   Render on single breakpoints, arrays of breakpoints or ranges

## Documentation

Check out the documentation at [Vue3 MQ: Github Pages](https://craigrileyuk.github.io/vue3-mq/).

## License

[MIT](https://github.com/craigrileyuk/vue3-mq/blob/main/LICENSE)

## Sponsor / Donate

Finding this package useful? Then help keep the coffee flowing.

[Sponsor Craig Riley on Github](https://github.com/sponsors/craigrileyuk/)

## Other Packages by the Author

-   [Tailwind Fluid Typography](https://github.com/craigrileyuk/tailwind-fluid-typography)
-   [Laravel Mix Ziggy Watch](https://github.com/craigrileyuk/laravel-mix-ziggy-watch)
-   [Vue 3 Snackbar](https://github.com/craigrileyuk/vue3-snackbar)
-   [Vue 3 Slide Up Down](https://github.com/craigrileyuk/vue3-slide-up-down)
-   [Vue 3 Icon](https://github.com/craigrileyuk/vue3-icon)

## Bugs / Support

Please [open an issue](https://github.com/craigrileyuk/vue3-mq/issues/new) for support.

## Thanks

Thanks to [Alexandre Bonaventure](https://github.com/AlexandreBonaventure/vue-mq) for creating the Vue 2 project that this is based upon.