Skip to content

julon/vue-creativecommons

Repository files navigation

vue-creativecommons

Rollup badge Jest Vue Storybook Commitizen semantic-release Npm badge Build Status Coverage Status Greenkeeper badge

CreativeCommons.org Vue.js components library.

Generated using vue-cli-template-library.

Installation

npm install vue-creativecommons

vue-creativecommons can be used as a module in both CommonJS and ES modular environments.

When in non-modular environment, vue-creativecommons will register all the components to vue by itself.

ES6

//
// You can register a component manually
//
import { CreativeCommonsIcon, CreativeCommonsLabel } from 'vue-creativecommons';

export default {
  ...
  components: {
    CreativeCommonsIcon,
    CreativeCommonsLabel
  },
  ...
};

//
// or register the whole module with vue
//
import vueCreativeCommons from 'vue-creativecommons';

// Install this library
Vue.use(vueCreativeCommons);

CommonJS

//
// You can register a component manually
//
var Vue = require('vue');
var vueCreativeCommons = require('vue-creativecommons');

var YourComponent = Vue.extend({
  ...
  components: {
    'cc-icon': vueCreativeCommons.CreativeCommonsIcon,
    'cc-label': vueCreativeCommons.CreativeCommonsLabel
  },
  ...
});

//
// or register the whole module with vue
//
var Vue = require('vue');
var vueCreativeCommons = require('vue-creativecommons');

// Install this library
Vue.use(vueCreativeCommons);

Browser

<script src="path/to/vue/vue.min.js"></script>
<script src="path/to/vue-creativecommons/dist/vue-creativecommons.min.js"></script>
<!-- Components are registered globally -->

Usage

Icon component

Example

<!-- normal icon -->
<cc-icon allow-adaptations="yes" allow-commercial-use="yes" icon-size="normal"></cc-icon>

<!-- compact icon -->
<cc-icon allow-adaptations="yes" allow-commercial-use="yes" icon-size="compact"></cc-icon>

alt text alt text

Props

  • allowAdaptations(required) - Allow adaptations of your work to be shared? yes, no or share-alike
  • allowCommercialUse(required) - Allow commercial uses of your work? yes or no
  • iconSize(required) : compact or normal

Label component

Example

<cc-label allow-adaptations="yes" allow-commercial-use="yes"></cc-label>

This work is licensed under a Creative Commons Attribution 4.0 International License.

Props

  • allowAdaptations(required) - Allow adaptations of your work to be shared? yes, no or share-alike
  • allowCommercialUse(required) - Allow commercial uses of your work? yes or no

Changelog

See the GitHub release history.

Contributing

See CONTRIBUTING.md.