@jporto/vue-flex v6.0.4

@jporto/vue-flex

A Vue JS Flex component for mobile first layouts

Checkout the Demo which contains the component documentation.

If you enjoy this component, feel free to drop me feedback, either via the repository, or via joseporto@icloud.com.

Also, please verify my project at torre.co.

Instalation

yarn add @jporto/vue-flex

or

npm install @jporto/vue-flex

Setup

Vue.js

• Add the following to you application main.js file:

import VueFlex from '@jporto/vue-flex'

Vue.use(VueFlex)

import the styles

• Add a similar object to configure the breakpoints, before importing the stylesheet

$var-breakpoints: (
  "pm": 320,
  "pl": 375,
  "ts": 425,
  "tw": 768,
  "ds": 1024,
  "dw": 1440
);

@import '@jporto/vue-flex/dist/@jporto/main.scss';

NuxtJS

• Similar as with Vue.js, but I recomend adding a components.js file to plugins, with the following content:

import Vue from 'vue'
import VueFlex from '@jporto/vue-flex';
Vue.use(VueFlex);

• Register the plugin in nuxt.config.js:

plugins: [
  '@/plugins/components',
],