Skip to content
A sizable, skinnable tile that provides a button for modal display of overflowed content when it's present
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.vscode
build
config
src
static
test/unit
.babelrc
.editorconfig
.eslintignore
.eslintrc.js
.gitignore
.postcssrc.js
README.md
index.html
package.json

README.md

preview-card

A sizable, skinnable Vue.js card component that provides a button for modal display of overflowed content

Demo

View a demo at the wakecoder blog or check out the code in the example folder

Usage

Install, require (or import) and put in your HTML. NOTE: In most cases you will want to specify a height for the card so the front and back are the same size. This can be done via CSS. See below for more detail:

1. In a shell
npm install --save-dev preview-card
2. In your code
const Vue = require ('vue');
import previewCard from "preview-card/src/preview-card.vue";
const vue = new Vue ({
    el: "#app",
    data: {},
    components: {
        "preview-card": previewCard
    }
})
3. In your HTML
<preview-card transition="fade" style="height: 340px">
    <template slot="front" scope="ignore">
        Front content here
    </template>
    <template slot="back" scope="ignore">
        Back content here
    </template>
</preview-card>
You can’t perform that action at this time.