future-vue-components v0.0.25

Documentation

Go here 👉 https://danny-aguilar.gitbook.io/future-vue-components/

Installation

install moment , animate.css , tailwind

npm install --save future-vue-components

in case of error when you import css files from tailwind, try the complete route from where the @import is (main.scss file) => /src/assets/scss/main.scss

 @import "./../../../node_modules/tailwindcss/dist/base.css";
 @import "./../../../node_modules/tailwindcss/dist/components.css";
 @import "./../../../node_modules/tailwindcss/dist/utilities.css";

⚠️ Warning: due to a bug already issued it to momentjs, other locales as spanish are not available for the moment, this error is shown as Can't resolve './locale'

Usage

import Vue from "vue"

import Datepicker from 'future-vue-components'
Vue.use(Datepicker)

import Card from 'future-vue-components'
Vue.use(Card)

vue template

<!-- Card -->
<future-card
  :user="{
    avatar_url: 'https://i.pinimg.com/originals/39/ec/15/39ec15a87824a1bdd57484e6a5459593.jpg',
    name: 'emily rudd'
  }"
>
  <span slot="title">This is a title</span>
  <span>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatibus quia, nulla! Maiores et perferendis eaque, exercitationem praesentium nihil.
  </span>
</future-card>

<!-- Datepicker -->
<input
  @click="datepicker = true"
  type="text"
  placeholder="date"
  autocomplete="off"
  spellcheck="false"
  readonly="readonly"
  v-model="date"
>
<future-datepicker
  :show="datepicker"
  @close="datepicker = false"
  @date="(datepicker) => {date = datepicker}"  
/>

vue template

export default {
  props: {},
  data() {
    return {
      date: '',
      datepicker: false,
    }
  },
};

Props

Datepicker

Card

Development

npm install
npm run Test
# open localhost:8080

TODO

• Datepicker choose by year
• Fix .locale moment bug

License

MIT