nx-card

Simple and beautiful card made for vue.js.

Installation

npm install --save nx-card

Default import

Install all the components:

import Vue from 'vue'
import NxCard from 'nx-card'

Vue.use(NxCard)

⚠️ A css file is included when importing the package. You may have to setup your bundler to embed the css in your page.

Distribution import

Install all the components:

import 'nx-card/dist/nx-card.css'
import NxCard from 'nx-card/dist/nx-card.common'

Vue.use(NxCard)

⚠️ You may have to setup your bundler to embed the css file in your page.

Browser

<link rel="stylesheet" href="nx-card/dist/nx-card.css"/>
<script src="vue.js"></script>
<script src="nx-card/dist/nx-card.browser.js"></script>

The plugin should be auto-installed. If not, you can install it manually with the instructions below.

Install all the components:

Vue.use(NxCard)

Usage

In the template, use the nx-card directive:

<nx-card	
title="Lorem ipsum dolor sit amet."
description="Lorem ipsum dolor sit amet, consectetur adipisicing elit. Commodi eveniet, iusto, exercitationem maxime sit molestias dolor mollitia quo voluptate libero optio, nihil molestiae voluptatem rem."
image="src/image.png"></nx-card>
         

GitHub