Displaying 1 to 20 from 25 results

react-media - CSS media queries for React

  •    Javascript

react-media is a CSS media query component for React.A <Media> component listens for matches to a CSS media query and renders stuff based on whether the query matches or not.

enquire.js - Awesome Media Queries in JavaScript

  •    Javascript

enquire.js is a lightweight, pure javascript library (with no dependencies) for programmatically responding to media queries. This should be enough to get you going, but please read the full enquire.js documentation if you wish to learn about the other cool features.

react-responsive - Media queries in react for responsive design

  •    Javascript

The best supported, easiest to use react media query module. This module is pretty straightforward: You specify a set of requirements, and the children will be rendered if they are met. Also handles changes so if you resize or flip or whatever it all just works.

css-element-queries - CSS-Element-Queries Polyfill

  •    Javascript

Element Queries is a polyfill adding support for element based media-queries to all new browsers (incl. IE7+). It allows not only to define media-queries based on window-size but also adds 'media-queries' functionality depending on element (any selector supported) size while not causing performance lags due to event based implementation. It's a proof-of-concept event-based CSS element dimension query with valid CSS selector syntax.




conditioner - 💆🏻 Frizz free, context-aware, JavaScript modules

  •    Javascript

Conditioner provides a straight forward Progressive Enhancement based solution for linking JavaScript modules to DOM elements. Modules can be linked based on contextual parameters like viewport size and element visibilty making Conditioner your perfect Responsive Design companion. Mount a component (like a Date Picker, Section Toggler or Carrousel), but only do it on wide viewports and when the user has seen it.

styled-media-query - 💅💍 Better media queries for styled-component

  •    Javascript

Beautiful media queries better than CSS @media for styled-components with ability to specify custom breakpoints. Note: This documentation is for the latest version (v2). We still support v1 syntax but it'll be removed in v3.

ember-responsive - Easy responsive layouts with Ember

  •    Javascript

ember-responsive is an ember-cli addon that give you a simple, Ember-aware way of dealing with media queries. This default config has already been provided for you. If you wish to change the values or add new ones, simply create a new app/breakpoints.js in your project and export your chosen config.

react-bounds - :left_right_arrow: The Future of Media Queries

  •    Javascript

Like Media Queries - Set min and max values like breakpoints. Use the Bounds in JS - Active bounds are passed down as props.


vue-media - A CSS media query component for Vue.js

  •    Javascript

Like react-media but for Vue.js, and this library is pretty small, it's 969 bytes after minified without gzip.The value of query can also be a media query string like (max-width: 500px), for more info please see json2mq doc.

flex-layout-builds - Build snapshots for @angular/flex-layout

  •    Javascript

Angular Flex Layout provides a sophisticated layout API using Flexbox CSS + mediaQuery. This module provides Angular developers with component layout features using a custom Layout API, mediaQuery observables, and injected DOM flexbox-2016 CSS stylings.The Flex Layout engine intelligently automates the process of applying appropriate Flexbox CSS to browser view hierarchies. This automation also addresses many of the complexities and workarounds encountered with the traditional, manual, CSS-only application of box CSS.

mq-sass - Sass library to manage responsive breakpoints and generate media queries

  •    CSS

mq-sass is a Sass library to help you manage your responsive breakpoints and easily generate media queries. Also available as a Ruby gem to use within your Rails application—see below for more information.

ember-element-query - Element queries for Ember

  •    HTML

This Ember addon lets you apply styles to elements conditionally based on their own width, instead of using media queries based on window width. It lets you implement reusable responsive components — with encapsulated styles, decoupled from their parent context. Such components will realign their content depending on how much space is available to them.

react-mq - Media Query Component for React.

  •    Javascript

Media Query Component for React. Then open localhost:9999 in a browser.

css-mediaquery - Parses and determines if a given CSS Media Query matches a set of values via JavaScript

  •    Javascript

Parses and determines if a given CSS Media Query matches a set of values via JavaScript. This package has two exports: parse(), and match() which can parse CSS Media Queries and determine if a media query matches a given set of values.

react-native-responsive-ui - Building responsive UIs in React Native.

  •    Javascript

Building responsive UIs in React Native. An example is available via expo here.

postcss-media-variables - PostCSS plugin to use CSS Custom Properties in media query parameters

  •    Javascript

PostCSS plugin to use CSS Custom Properties in @media query parameters. Every other plugin is optional, but keep this order of plugins if you use any of them.

ergonomic-breakpoint - Ergonomic CSS media queries

  •    CSS

Ergonomic CSS media queries. Uses CSS custom media queries. Wrist viewport. <320px.