Most complete implementation of Spectre.css on Vue.js
A Lightweight, Simple and Responsive Component Framework
Vectre is a set of lightweight, simple and responsive Vue components based on Spectre CSS
The documentation is in a separate repository and the source code is an excellent example of using the framework.
Browse online documentation here
You need Vue version 2.5+.
npm install --save spectre.css @vectrejs/vectre
#OR
yarn add spectre.css @vectrejs/vectre
All components
import Vue from 'vue';
import 'spectre.css/dist/spectre-exp.css';
import 'spectre.css/dist/spectre-icons.css';
import 'spectre.css/dist/spectre.css';
import { VectrePlugin } from '@vectrejs/vectre';
Vue.use(VectrePlugin);
or specific components
import Vue from 'vue';
import 'spectre.css/dist/spectre.css';
import { Tag, Modal } from '@vectrejs/vectre';
Vue.component('Tag', Tag);
Vue.component('Modal', Modal);
Alternatively, you can download or reference the script and the stylesheet in your HTML:
<!-- jsDelivr --->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/spectre.css/dist/spectre.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/spectre.css/dist/spectre-icons.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/spectre.css/dist/spectre-exp.min.css">
<script src="https://cdn.jsdelivr.net/npm/@vectrejs/vectre/dist/vectre.min.js"></script>
<!-- unpkg --->
<link rel="stylesheet" href="https://unpkg.com/spectre.css/dist/spectre.min.css">
<link rel="stylesheet" href="https://unpkg.com/spectre.css/dist/spectre-icons.min.css">
<link rel="stylesheet" href="https://unpkg.com/spectre.css/dist/spectre-exp.min.css">
<script src="https://unpkg.com/@vectrejs/vectre/dist/vectre.min.js"></script>
At present, Vectre supports all modern browsers and additionally has a build to support older browsers like IE 10 or Safari 9
<!-- jsDelivr --->
<script src="https://cdn.jsdelivr.net/npm/@vectrejs/vectre/dist/vectre.legacy.min.js"></script>
<!-- unpkg --->
<script src="https://unpkg.com/@vectrejs/vectre/dist/vectre.legacy.min.js"></script>
Code released under MIT license.