Skip to content

Commit

Permalink
Merge branch 'develop'
Browse files Browse the repository at this point in the history
  • Loading branch information
cb109 committed Apr 4, 2018
2 parents f448296 + 8d528eb commit 58c05c3
Show file tree
Hide file tree
Showing 7 changed files with 7,162 additions and 8 deletions.
2 changes: 2 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
node_modules/
dist/
1 change: 1 addition & 0 deletions .npmignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
src/
51 changes: 51 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
# vue-md-breakpoint

Access the current breakpoint from the material design spec inside a Vue app.
Resizing the browser will update the breakpoint accordingly.

## Demo

[![Edit vue-md-breakpoint demo](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/n7nj0p76ml)

## Installation

npm install vue-md-breakpoint
# or:
yarn add vue-md-breakpoint

## Usage

You can use it as a mixin for your app.

import Vue from 'vue';
import breakpoint from 'vue-md-breakpoint';

// in your app/component:

mixins: [breakpoint],

// and in your templates:

<div v-if="$breakpoint.smAndUp"></div>

## API

- `$breakpoint.name`
- `$breakpoint.xsOnly`
- `$breakpoint.smOnly`
- `$breakpoint.smAndDown`
- `$breakpoint.smAndUp`
- `$breakpoint.mdOnly`
- `$breakpoint.mdAndDown`
- `$breakpoint.mdAndUp`
- `$breakpoint.lgOnly`
- `$breakpoint.lgAndDown`
- `$breakpoint.lgAndUp`
- `$breakpoint.xlOnly`
- `$breakpoint.width`
- `$breakpoint.height`

## Tests

npm run test

Loading

0 comments on commit 58c05c3

Please sign in to comment.