├── src ├── docs │ ├── icons │ │ ├── _icons.scss │ │ ├── snippet.html │ │ ├── index.js │ │ ├── icons.html │ │ └── icons.json │ ├── introduction │ │ ├── index.js │ │ └── introduction.html │ └── index.js ├── theme │ └── _docs.scss ├── components │ ├── compiled.js │ ├── index.js │ └── icons │ │ ├── icons.html │ │ ├── index.js │ │ ├── svg4everybody.js │ │ └── icons.scss ├── utils │ └── index.js └── index.js ├── .gitignore ├── assets ├── favicon.ico ├── vuestrap-logo.svg └── icons.min.svg ├── dist ├── vuestrapIcons.css.map ├── vuestrapIcons.min.js ├── vuestrapIcons.min.css ├── vuestrapIcons.css ├── vuestrapIcons.js ├── vuestrapIcons-bundle.min.js ├── vuestrapIcons.js.map └── vuestrapIcons-bundle.js ├── webpack.config.js ├── bower.json ├── LICENCE ├── index.html ├── README.md ├── examples └── icons.html ├── package.json ├── webpack.build.js └── .eslintrc /src/docs/icons/_icons.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | bower_components/ 3 | -------------------------------------------------------------------------------- /src/theme/_docs.scss: -------------------------------------------------------------------------------- 1 | $brand-primary: #563d7c; 2 | $brand-success: #42b983; -------------------------------------------------------------------------------- /assets/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kzima/vuestrap-icons/HEAD/assets/favicon.ico -------------------------------------------------------------------------------- /dist/vuestrapIcons.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":[],"names":[],"mappings":"","file":"./dist/vuestrapIcons.css","sourceRoot":""} -------------------------------------------------------------------------------- /src/components/compiled.js: -------------------------------------------------------------------------------- 1 | /** 2 | * IMPORT EACH COMPONENT 3 | */ 4 | import icons from 'src/components/icons' 5 | 6 | const vuestrapIcons = { 7 | icons, 8 | } 9 | 10 | export default vuestrapIcons 11 | -------------------------------------------------------------------------------- /src/components/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * IMPORT EACH COMPONENT 3 | */ 4 | import icons from 'src/components/icons' 5 | 6 | const vuestrapIcons = { 7 | 'vsIcon': icons, 8 | } 9 | 10 | export default vuestrapIcons 11 | -------------------------------------------------------------------------------- /src/docs/introduction/index.js: -------------------------------------------------------------------------------- 1 | import template from './introduction.html' 2 | 3 | export default { 4 | route: { 5 | url: '/', 6 | name: 'introduction', 7 | title: 'Intoduction', 8 | }, 9 | template: template, 10 | data() { 11 | return { 12 | pkg: this.$parent.pkg, 13 | componentName: 'icons', 14 | componentNameSurfixed: 'vs-icon', 15 | componentNameCamelCase: 'vsIcon', 16 | } 17 | }, 18 | } 19 | -------------------------------------------------------------------------------- /src/components/icons/icons.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/docs/index.js: -------------------------------------------------------------------------------- 1 | // import vuestrap dependencies 2 | import 'vuestrap/core' 3 | import 'vuestrap/components/nav' 4 | import 'vuestrap/components/navbar' 5 | import 'vuestrap/components/buttons' 6 | import 'vuestrap/components/list-group' 7 | import 'vuestrap/components/forms' 8 | import 'vuestrap/components/labels' 9 | import 'vuestrap/components/alert' 10 | import 'vuestrap/components/tables' 11 | 12 | // import modules and pages 13 | import introduction from './introduction' 14 | import icons from './icons' 15 | export default { 16 | pages: [ 17 | introduction, 18 | icons 19 | ] 20 | } 21 | -------------------------------------------------------------------------------- /src/utils/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Some common stuff used in demo pages 3 | */ 4 | export const variants = [{ 5 | text: 'default', 6 | value: 'default' 7 | }, { 8 | text: 'primary', 9 | value: 'primary' 10 | }, { 11 | text: 'success', 12 | value: 'success' 13 | }, { 14 | text: 'info', 15 | value: 'info' 16 | }, { 17 | text: 'warning', 18 | value: 'warning' 19 | }, { 20 | text: 'danger', 21 | value: 'danger' 22 | } 23 | ] 24 | export const sizes = [{ 25 | text: 'sm', 26 | value: 'sm' 27 | }, { 28 | text: 'md', 29 | value: 'md' 30 | }, { 31 | text: 'lg', 32 | value: 'lg' 33 | } 34 | ] 35 | -------------------------------------------------------------------------------- /src/docs/icons/snippet.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 11 | -------------------------------------------------------------------------------- /src/docs/icons/index.js: -------------------------------------------------------------------------------- 1 | import snippet from './snippet.html' 2 | import template from './icons.html' 3 | import meta from './icons.json' 4 | import './_icons.scss' 5 | import {sizes, variants} from '../../utils' 6 | import icon from 'src/components/icons' 7 | import demo from 'vuestrap-docs/src/components/demo' 8 | 9 | export default { 10 | route: { 11 | url: '/icons', 12 | name: 'icons', 13 | title: 'Icons', 14 | }, 15 | template: template, 16 | data() { 17 | return { 18 | meta: meta, 19 | snippet: snippet, 20 | controls: { 21 | size: 'xxl', 22 | sizes: sizes.concat([{text: 'xl', value: 'xl'}, {text: 'xxl', value: 'xxl'}]), 23 | variant: 'info', 24 | variants: variants.concat([{text: 'light', value: 'light'}, {text: 'dark', value: 'dark'}]), 25 | } 26 | } 27 | }, 28 | components: { 29 | 'vs-icon': icon, 30 | demo: demo, 31 | }, 32 | } 33 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | var webpack = require('webpack') 2 | var path = require('path') 3 | var ExtractTextPlugin = require('extract-text-webpack-plugin') 4 | 5 | // export config 6 | module.exports = { 7 | themeLoader: { 8 | themes: ['./src/theme/docs.scss', './node_modules/vuestrap/theme/bootstrap.scss'], // docs theme, default bootstrap 9 | }, 10 | resolve: { 11 | root: path.resolve('./') 12 | }, 13 | module: { 14 | loaders: [{ 15 | test: /\.js$/, 16 | include: [ 17 | path.resolve('./src'), 18 | path.resolve('./node_modules/vuestrap'), 19 | path.resolve('./node_modules/gritcode-components') 20 | ], 21 | loader: 'babel' 22 | }, { 23 | test: /\.html$/, 24 | exclude: /(snippet.html)/, 25 | loader: 'html' 26 | }, { 27 | test: /snippet.html$/, 28 | loader: 'html!highlightjs?lang=html' 29 | }, { 30 | test: /\.json$/, 31 | loader: 'json' 32 | }] 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vuestrap-icons", 3 | "homepage": "https://github.com/kzima/vuestrap-icons", 4 | "authors": [ 5 | "kzima " 6 | ], 7 | "description": "Vuestrap Icons Component complements Vuestrap web components with svg icons.", 8 | "main": [ 9 | "dist/vuestrapIcons.js", 10 | "dist/vuestrapIcons.js.map", 11 | "dist/vuestrapIcons.min.js", 12 | "dist/vuestrapIcons.css", 13 | "dist/vuestrapIcons.css.map", 14 | "dist/vuestrapIcons.min.css", 15 | "dist/vuestrapIcons-bundle.js", 16 | "dist/vuestrapIcons-bundle.min.js" 17 | ], 18 | "moduleType": [ 19 | "amd", 20 | "globals" 21 | ], 22 | "keywords": [ 23 | "bootstrap4", 24 | "vuestrap", 25 | "vue-components", 26 | "web-components" 27 | ], 28 | "license": "MIT", 29 | "ignore": [ 30 | "assets/*", 31 | "!assets/icons.min.svg", 32 | "!assets/icons.svg", 33 | "node_modules", 34 | "bower_components", 35 | "docs", 36 | "src", 37 | "build", 38 | "gulpfile.js", 39 | "index.html", 40 | "webpack*.js", 41 | "utils", 42 | "dist/docs.js" 43 | ] 44 | } 45 | -------------------------------------------------------------------------------- /LICENCE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Kris Zima 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | // docs component handles routing and demo pages 2 | import {vsDocsPages, vsDocsDrawer} from 'vuestrap-docs/src/components' 3 | import {offcanvasWrapper as vsOffcanvasWrapper, offcanvasDrawer as vsOffcanvasDrawer} from 'gritcode-components/src/components/offcanvas-drawer' 4 | 5 | // import utils 6 | import {getRoutes} from 'vuestrap-docs/src/utils' 7 | 8 | // import demo pages compatibile with docs component 9 | import docsRoutes from 'src/docs' 10 | 11 | // import package.json meta data 12 | import pkg from 'package.json' 13 | 14 | // get list of the route objects 15 | const routes = getRoutes(docsRoutes) 16 | 17 | // create components from routes and attach it to the docs.components object 18 | routes.forEach((route) => { 19 | vsDocsPages.components[route.id] = route.component 20 | }) 21 | 22 | Vue.mixin({ 23 | vuestrapIconsPath: 'assets/icons.min.svg', 24 | }) 25 | 26 | // start docs instance 27 | window.docs = new Vue({ 28 | el: '#docs', 29 | data: { 30 | routes: routes, 31 | pkg: pkg, 32 | pageTitle: 'Vuestrap Docs', 33 | }, 34 | components: { 35 | vsDocsPages, 36 | vsDocsDrawer, 37 | vsOffcanvasDrawer, 38 | vsOffcanvasWrapper, 39 | }, 40 | }) 41 | 42 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Vuestrap Docs 6 | 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 |
30 | 31 |
32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Vuestrap Icons Component 2 | ========= 3 | 4 | Vuestrap Icons Component complements [vuestrap web components](http://kzima.github.io/vuestrap-base-components/#/) with svg icons. 5 | SVG sprite consists of 223 icons from Iconic — www.useiconic.com/open plus two custom ones: circle-fill and circle-outline 6 | 7 | DEMO 8 | ========= 9 | 10 | [Documentation](http://kzima.github.io/vuestrap-icons/#/icons) 11 | 12 | QUICK USE 13 | ========= 14 | 15 | **Bower:** 16 | 17 | - `bower install vuestrap-icons` 18 | - add script in your html document: 19 | ```js 20 | 21 | ``` 22 | - use it within your Vue instance like this: 23 | 24 | ```js 25 | new Vue({ 26 | el: '#app', 27 | components: { 'vs-icon': vuestrapIcons.icons } 28 | }) 29 | ``` 30 | 31 | 32 | **From source:** 33 | 34 | - `npm install vuestrap-icons` 35 | - import* desired component like so: 36 | 37 | ```js 38 | import icons from 'vuestrap-icons/src/components/icons' 39 | ``` 40 | 41 | - load it in your Vue instance: 42 | 43 | ```js 44 | new Vue({ 45 | el: '#app', 46 | components: { 'vs-icon': icons } 47 | }) 48 | ``` 49 | 50 | *Note: You will need Babel Loader in your Webpack config file to support ES6 syntax. 51 | 52 | You can then use icon component in your html, like so: 53 | ```html 54 | 55 | ``` 56 | 57 | TODO 58 | ========= 59 | - create html page with list of icons 60 | - testing 61 | -------------------------------------------------------------------------------- /src/docs/introduction/introduction.html: -------------------------------------------------------------------------------- 1 |
2 |

{{pkg.name}} {{pkg.version}}

3 |

{{pkg.description}}

4 |
5 |

Installation

6 |
7 |
8 |

Compiled

9 |

Minified CSS and JavaScript with no documentation or original source files.

10 | bower install {{pkg.name}} --save-dev 11 |
12 |
13 |

Source

14 |

Source Sass, JavaScript, and documentation files.

15 | npm install {{pkg.name}} --save-dev 16 |
17 |
18 | 19 |
20 |

Usage

21 |

For compiled components, use it within your Vue instance like this:

22 |

new Vue({ components: { '{{componentNameSurfixed}}': {{pkg.library}}.{{componentName}} }})

23 | 24 |
25 | OR 26 |
27 | 28 |

If you chosen to work with source components, just import* desired component like so:

29 |

import { {{componentNameCamelCase}} } from '{{pkg.name}}/src/components'

30 |

and then load it in your Vue instance:

31 |

new Vue({ components: { {{componentNameCamelCase}} }})

32 |

*Note: You will need Babel Loader in your Webpack config file to support ES6 syntax.

33 | 34 |
35 |

Examples

36 | -------------------------------------------------------------------------------- /examples/icons.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 27 | 30 |
31 | 37 | 38 | 39 | -------------------------------------------------------------------------------- /src/docs/icons/icons.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 |
5 | 13 | 14 | 22 |
23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 |
37 | 38 | -------------------------------------------------------------------------------- /src/components/icons/index.js: -------------------------------------------------------------------------------- 1 | // import dependencies 2 | import './icons.scss' 3 | import template from './icons.html' 4 | // enable support for svg in all browsers 5 | import './svg4everybody.js' 6 | 7 | // export component object 8 | export default { 9 | template: template, 10 | replace: true, 11 | computed: { 12 | iconsSize() { 13 | return !this.size ? `icons-sm` : `icons-${this.size}` 14 | }, 15 | iconsAlign() { 16 | return !this.align ? `` : `icons-${this.align}` 17 | }, 18 | iconsVariant() { 19 | return !this.variant ? `` : `icons-${this.variant}` 20 | }, 21 | iconsBackground() { 22 | let bg = this.background.split('-') 23 | bg = (bg[1]) ? bg[1] : 'fill' 24 | return !this.background ? `` : `icons-bg-${bg}` 25 | }, 26 | }, 27 | props: { 28 | name: { 29 | type: String 30 | }, 31 | background: { 32 | type: String, 33 | default: '', 34 | }, 35 | align: { 36 | type: String, 37 | default: '' 38 | }, 39 | size: { 40 | type: String, 41 | default: 'sm' 42 | }, 43 | text: { 44 | type: String, 45 | default: '' 46 | }, 47 | variant: { 48 | type: String, 49 | default: 'standard' 50 | }, 51 | path: { 52 | type: String, 53 | default() { 54 | if (process.env.NODE_ENV === 'production') { 55 | return 'bower_components/vuestrap-icons/assets/icons.min.svg' 56 | } 57 | if (process.env.NODE_ENV === 'docs') { 58 | return 'assets/icons.min.svg' 59 | } 60 | return 'node_modules/vuestrap-icons/assets/icons.min.svg' 61 | } 62 | }, 63 | ready() { 64 | if (!this.path && this.$options.vuestrapIconsPath) { 65 | this.path = this.$options.vuestrapIconsPath 66 | } 67 | } 68 | } 69 | } 70 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vuestrap-icons", 3 | "version": "0.5.2", 4 | "description": "Vuestrap Icons Component complements Vuestrap web components with svg icons.", 5 | "library": "vuestrapIcons", 6 | "repository": { 7 | "type": "git", 8 | "url": "git+https://github.com/kzima/vuestrap-icons.git" 9 | }, 10 | "scripts": { 11 | "build": "npm run docs && npm run dev && npm run dev-bundle && npm run dist && npm run dist-bundle", 12 | "dist": "webpack --colors --progress --config webpack.build.js --env production", 13 | "dist-bundle": "webpack --colors --progress --config webpack.build.js --env production --bundle true", 14 | "dev": "webpack --colors --progress --config webpack.build.js --env development", 15 | "dev-bundle": "webpack --colors --progress --config webpack.build.js --env development --bundle true", 16 | "docs": "webpack --colors --progress --config webpack.build.js --env docs", 17 | "serve-docs": "webpack-dev-server --port 8082 --inline --hot --quiet --config webpack.build.js --env docs", 18 | "release-win": "bash build/release.sh && bash build/gh-pages.sh" 19 | }, 20 | "keywords": [ 21 | "Bootstrap4", 22 | "Web", 23 | "Components", 24 | "Polymer" 25 | ], 26 | "author": { 27 | "name": "Kris Zima", 28 | "email": "kris@mosquito.ie", 29 | "url": "https://github.com/kzima" 30 | }, 31 | "license": "MIT", 32 | "bugs": { 33 | "url": "https://github.com/kzima/vuestrap-icons/issues" 34 | }, 35 | "dependencies": { 36 | "vue": "^1.0.10" 37 | }, 38 | "devDependencies": { 39 | "autoprefixer-loader": "^3.1.0", 40 | "babel-core": "^5.8.33", 41 | "babel-eslint": "^4.1.3", 42 | "babel-loader": "^5.3.3", 43 | "css-loader": "^0.21.0", 44 | "director": "^1.2.8", 45 | "extract-text-webpack-plugin": "^0.8.2", 46 | "gritcode-components": "^0.4.0", 47 | "highlightjs-loader": "^0.2.3", 48 | "html-loader": "^0.3.0", 49 | "json-loader": "^0.5.4", 50 | "node-sass": "^3.4.1", 51 | "optimist": "^0.6.1", 52 | "sass-loader": "^3.1.1", 53 | "style-loader": "^0.13.0", 54 | "vuestrap": "^1.0.1", 55 | "vuestrap-docs": "^0.5.1", 56 | "vuestrap-theme-loader": "^0.1.2", 57 | "webpack": "^1.12.9", 58 | "webpack-dev-server": "^1.12.1" 59 | }, 60 | "homepage": "https://github.com/kzima/vuestrap-icons#readme" 61 | } 62 | -------------------------------------------------------------------------------- /src/docs/icons/icons.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "icons", 3 | "title": "Icons", 4 | "description": "SVG sprite consists of 223 icons from Iconic, plus two custom ones: circle-fill and circle-outline.", 5 | "accessibility": "By default icons component sets aria-hidden='true' attribute to avoid confusing output in screen readers. For more information please refer to Accessible Icons section in Bootstrap Docs.", 6 | "dependencies": ["vuestrap/core/icons"], 7 | "category": "components", 8 | "note": "From version 0.5.0 you can now change path or svg sprite by just setting a global vuestrapIconsPath mixin property.", 9 | "browserSupport": { 10 | "browsers": ["*IE9+", "*Android 4.3"], 11 | "note": "* Icons use svg4everybody v.2.0.0 polyfill and it is embedded in the component's code base." 12 | }, 13 | "options": [ 14 | { 15 | "name": "name", 16 | "type": "String", 17 | "default": "''", 18 | "required": false, 19 | "description": "A name of the icon. For icon names please refer to https://useiconic.com/open/. You can also set a global mixin vuestrapIconsPath and point to your own svg sprite." 20 | }, 21 | { 22 | "name": "background", 23 | "type": "String", 24 | "default": "''", 25 | "required": false, 26 | "description": "A name of the background icon. It will be stacked behind the main icon. It supports circle-outline and circle-fill background icons." 27 | }, 28 | { 29 | "name": "align", 30 | "type": "String", 31 | "values": ["left", "right"], 32 | "default": "''", 33 | "required": false, 34 | "description": "Adds extra padding on the left/right of the icon." 35 | }, 36 | { 37 | "name": "size", 38 | "type": "String", 39 | "values": ["sm","md","lg","xl","xxl"], 40 | "default": "md", 41 | "description": "Size of the icon. 'sm' starts at 1.0em ('sm') and increments by 0.5em for next sizes." 42 | }, 43 | { 44 | "name": "text", 45 | "type": "String", 46 | "default": "", 47 | "description": "To place custom text above the icon. Works well with background icon `circle-fill` and supports up to two characters." 48 | }, 49 | { 50 | "name": "variant", 51 | "type": "String", 52 | "values": ["light", "dark", "primary","success","info","warning","danger"], 53 | "default": "light", 54 | "description": "Button color context." 55 | }, 56 | { 57 | "name": "path", 58 | "type": "String", 59 | "default": "", 60 | "description": "It allows you to specify a path to svg sprite. Default path is set to node_modules/vuestrap-icons/assets/sprite.svg for development and bower_components/vuestrap-icons/assets/sprite.svg for production." 61 | } 62 | ] 63 | } -------------------------------------------------------------------------------- /webpack.build.js: -------------------------------------------------------------------------------- 1 | var config = require('./webpack.config.js') 2 | var webpack = require('webpack') 3 | var optimist = require('optimist') 4 | var pkg = require('./package.json') 5 | var ExtractTextPlugin = require('extract-text-webpack-plugin') 6 | 7 | // get some options 8 | var ENV = optimist.argv.env || 'development' 9 | var BUNDLE = optimist.argv.bundle || false 10 | 11 | // file name 12 | var fileName = (ENV === 'production') ? './dist/[name].min' : './dist/[name]' 13 | if (BUNDLE) { 14 | fileName = (ENV === 'production') ? './dist/[name]-bundle.min' : './dist/[name]-bundle' 15 | } 16 | 17 | /** 18 | * define environment 19 | */ 20 | // set an environment variable to be available in the build script 21 | config.plugins = [] 22 | if (ENV) { 23 | config.plugins.push(new webpack.DefinePlugin({ 24 | 'process.env': { 25 | NODE_ENV: '"' + ENV + '"' 26 | } 27 | })) 28 | } 29 | 30 | // define plugins for production 31 | if (ENV === 'production') { 32 | config.plugins.push(new webpack.optimize.UglifyJsPlugin({ 33 | sourceMap: false, 34 | compress: { 35 | warnings: false 36 | } 37 | })) 38 | } 39 | 40 | /** 41 | * define devtool for source maps 42 | */ 43 | if (ENV === 'development' && !BUNDLE) { 44 | config.devtool = 'source-map' 45 | } 46 | 47 | /** 48 | * define scss loaders 49 | * in docs we want css stuff served from static bundle js that has css and js included 50 | */ 51 | if (ENV === 'docs' || BUNDLE) { 52 | config.module.loaders.push({ 53 | test: /\.scss$/, 54 | loader: 'style-loader!css-loader!autoprefixer-loader!sass-loader!vuestrap-theme-loader' 55 | }) 56 | } else { 57 | config.plugins.push(new ExtractTextPlugin(fileName + '.css')) 58 | config.module.loaders.push({ 59 | test: /\.scss$/, 60 | loader: ExtractTextPlugin.extract('style-loader', 'css-loader!autoprefixer-loader!sass-loader!vuestrap-theme-loader') 61 | }) 62 | } 63 | 64 | /** 65 | * define entry 66 | * if docs get everything, including styling, all source components and docs compoenents 67 | * otherwise just load source components 68 | */ 69 | if (ENV !== 'docs') { 70 | config.entry = {} 71 | config.entry[pkg.library] = './src/components/compiled.js' 72 | } else { 73 | config.entry = './src/index.js' 74 | } 75 | 76 | /** 77 | * define output 78 | * creates bundle files that include css and js -> this is a main script in package.json 79 | * creates seperate styling and js files -> these files will be included in bower 80 | * creates docs bundle file that includes everything -> used in index.html (gh_pages) 81 | */ 82 | config.output = (ENV !== 'docs') ? { 83 | filename: fileName + '.js', 84 | library: pkg.library, 85 | libraryTarget: 'umd' 86 | } : { 87 | path: './dist', 88 | publicPath: '/dist/', 89 | filename: 'docs.js' 90 | } 91 | 92 | module.exports = config 93 | -------------------------------------------------------------------------------- /src/components/icons/svg4everybody.js: -------------------------------------------------------------------------------- 1 | /*! svg4everybody v2.0.0 | github.com/jonathantneal/svg4everybody */ 2 | var LEGACY_SUPPORT = false; 3 | 4 | function embed(svg, g) { 5 | if (g) { 6 | var viewBox = !svg.getAttribute('viewBox') && g.getAttribute('viewBox'); 7 | var fragment = document.createDocumentFragment(); 8 | var clone = g.cloneNode(true); 9 | 10 | if (viewBox) { 11 | svg.setAttribute('viewBox', viewBox); 12 | } 13 | 14 | while (clone.childNodes.length) { 15 | fragment.appendChild(clone.firstChild); 16 | } 17 | 18 | svg.appendChild(fragment); 19 | } 20 | } 21 | 22 | function loadreadystatechange(xhr) { 23 | xhr.onreadystatechange = function () { 24 | if (xhr.readyState === 4) { 25 | var x = document.createElement('x'); 26 | 27 | x.innerHTML = xhr.responseText; 28 | 29 | xhr.s.splice(0).map(function (array) { 30 | embed(array[0], x.querySelector('#' + array[1].replace(/(\W)/g, '\\$1'))); 31 | }); 32 | } 33 | }; 34 | 35 | xhr.onreadystatechange(); 36 | } 37 | 38 | function svg4everybody(opts) { 39 | opts = opts || {}; 40 | 41 | var uses = document.getElementsByTagName('use'); 42 | var nosvg; 43 | 44 | if (LEGACY_SUPPORT) { 45 | var fallback = opts.fallback || function (src) { 46 | return src.replace(/\?[^#]+/, '').replace('#', '.').replace(/^\./, '') + '.png' + (/\?[^#]+/.exec(src) || [''])[0]; 47 | }; 48 | 49 | nosvg = 'nosvg' in opts ? opts.nosvg : /\bMSIE [1-8]\b/.test(navigator.userAgent); 50 | 51 | if (nosvg) { 52 | document.createElement('svg'); 53 | document.createElement('use'); 54 | } 55 | } 56 | 57 | var polyfill = 'polyfill' in opts ? opts.polyfill : LEGACY_SUPPORT ? ( 58 | nosvg || /\bEdge\/12\b|\bMSIE [1-8]\b|\bTrident\/[567]\b|\bVersion\/7.0 Safari\b/.test(navigator.userAgent) || (navigator.userAgent.match(/AppleWebKit\/(\d+)/) || [])[1] < 537 59 | ) : ( 60 | /\bEdge\/12\b|\bTrident\/[567]\b|\bVersion\/7.0 Safari\b/.test(navigator.userAgent) || (navigator.userAgent.match(/AppleWebKit\/(\d+)/) || [])[1] < 537 61 | ); 62 | 63 | var validate = opts.validate; 64 | var requestAnimationFrame = window.requestAnimationFrame || setTimeout; 65 | var svgCache = {}; 66 | 67 | function oninterval() { 68 | var use; 69 | 70 | while (use = uses[0]) { 71 | var svg = use.parentNode; 72 | 73 | if (svg && /svg/i.test(svg.nodeName)) { 74 | var src = use.getAttribute('xlink:href'); 75 | 76 | if (LEGACY_SUPPORT && nosvg) { 77 | var img = new Image(); 78 | var width = svg.getAttribute('width'); 79 | var height = svg.getAttribute('height'); 80 | 81 | img.src = fallback(src, svg, use); 82 | 83 | if (width) { 84 | img.setAttribute('width', width); 85 | } 86 | 87 | if (height) { 88 | img.setAttribute('height', height); 89 | } 90 | 91 | svg.replaceChild(img, use); 92 | } else if (polyfill) { 93 | if (!validate || validate(src, svg, use)) { 94 | var url = src.split('#'); 95 | var url_root = url[0]; 96 | var url_hash = url[1]; 97 | 98 | svg.removeChild(use); 99 | 100 | if (url_root.length) { 101 | var xhr = svgCache[url_root] = svgCache[url_root] || new XMLHttpRequest(); 102 | 103 | if (!xhr.s) { 104 | xhr.s = []; 105 | 106 | xhr.open('GET', url_root); 107 | 108 | xhr.send(); 109 | } 110 | 111 | xhr.s.push([svg, url_hash]); 112 | 113 | loadreadystatechange(xhr); 114 | } else { 115 | embed(svg, document.getElementById(url_hash)); 116 | } 117 | } 118 | } 119 | } 120 | } 121 | 122 | requestAnimationFrame(oninterval, 17); 123 | } 124 | 125 | if (polyfill) { 126 | oninterval(); 127 | } 128 | } 129 | 130 | export const svgPolyfill = { 131 | svg4everybody: svg4everybody() 132 | } 133 | -------------------------------------------------------------------------------- /dist/vuestrapIcons.min.js: -------------------------------------------------------------------------------- 1 | !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.vuestrapIcons=t():e.vuestrapIcons=t()}(this,function(){return function(e){function t(i){if(n[i])return n[i].exports;var s=n[i]={exports:{},id:i,loaded:!1};return e[i].call(s.exports,s,s.exports,t),s.loaded=!0,s.exports}var n={};return t.m=e,t.c=n,t.p="",t(0)}([function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0});var s=n(1),r=i(s),a={icons:r["default"]};t["default"]=a,e.exports=t["default"]},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0}),n(2);var s=n(6),r=i(s);n(7),t["default"]={template:r["default"],replace:!0,computed:{iconsSize:function(){return this.size?"icons-"+this.size:"icons-sm"},iconsAlign:function(){return this.align?"icons-"+this.align:""},iconsVariant:function(){return this.variant?"icons-"+this.variant:""},iconsBackground:function(){var e=this.background.split("-");return e=e[1]?e[1]:"fill",this.background?"icons-bg-"+e:""}},props:{name:{type:String},background:{type:String,"default":""},align:{type:String,"default":""},size:{type:String,"default":"sm"},text:{type:String,"default":""},variant:{type:String,"default":"standard"},path:{type:String,"default":function(){return"bower_components/vuestrap-icons/assets/icons.min.svg"}},ready:function(){!this.path&&this.$options.vuestrapIconsPath&&(this.path=this.$options.vuestrapIconsPath)}}},e.exports=t["default"]},function(e,t){},,,,function(e,t){e.exports=''},function(e,t){/*! svg4everybody v2.0.0 | github.com/jonathantneal/svg4everybody */ 2 | "use strict";function n(e,t){if(t){var n=!e.getAttribute("viewBox")&&t.getAttribute("viewBox"),i=document.createDocumentFragment(),s=t.cloneNode(!0);for(n&&e.setAttribute("viewBox",n);s.childNodes.length;)i.appendChild(s.firstChild);e.appendChild(i)}}function i(e){e.onreadystatechange=function(){if(4===e.readyState){var t=document.createElement("x");t.innerHTML=e.responseText,e.s.splice(0).map(function(e){n(e[0],t.querySelector("#"+e[1].replace(/(\W)/g,"\\$1")))})}},e.onreadystatechange()}function s(e){function t(){for(var e;e=a[0];){var p=e.parentNode;if(p&&/svg/i.test(p.nodeName)){var f=e.getAttribute("xlink:href");if(r&&s){var g=new Image,v=p.getAttribute("width"),h=p.getAttribute("height");g.src=o(f,p,e),v&&g.setAttribute("width",v),h&&g.setAttribute("height",h),p.replaceChild(g,e)}else if(u&&(!c||c(f,p,e))){var b=f.split("#"),m=b[0],y=b[1];if(p.removeChild(e),m.length){var x=d[m]=d[m]||new XMLHttpRequest;x.s||(x.s=[],x.open("GET",m),x.send()),x.s.push([p,y]),i(x)}else n(p,document.getElementById(y))}}}l(t,17)}e=e||{};var s,a=document.getElementsByTagName("use");if(r){var o=e.fallback||function(e){return e.replace(/\?[^#]+/,"").replace("#",".").replace(/^\./,"")+".png"+(/\?[^#]+/.exec(e)||[""])[0]};s="nosvg"in e?e.nosvg:/\bMSIE [1-8]\b/.test(navigator.userAgent),s&&(document.createElement("svg"),document.createElement("use"))}var u="polyfill"in e?e.polyfill:r?s||/\bEdge\/12\b|\bMSIE [1-8]\b|\bTrident\/[567]\b|\bVersion\/7.0 Safari\b/.test(navigator.userAgent)||(navigator.userAgent.match(/AppleWebKit\/(\d+)/)||[])[1]<537:/\bEdge\/12\b|\bTrident\/[567]\b|\bVersion\/7.0 Safari\b/.test(navigator.userAgent)||(navigator.userAgent.match(/AppleWebKit\/(\d+)/)||[])[1]<537,c=e.validate,l=window.requestAnimationFrame||setTimeout,d={};u&&t()}Object.defineProperty(t,"__esModule",{value:!0});var r=!1,a={svg4everybody:s()};t.svgPolyfill=a}])}); -------------------------------------------------------------------------------- /dist/vuestrapIcons.min.css: -------------------------------------------------------------------------------- 1 | .icons-vuestrap{font-size:1.5rem;line-height:1.5rem;width:1.5rem;height:1.5rem;display:inline-block;vertical-align:middle;position:relative}.icons-vuestrap .icon{width:100%;height:100%;top:0;left:0;position:absolute;z-index:2}.icons-vuestrap .icon-background{width:100%;height:100%;position:absolute;top:0;left:0;z-index:1}.icons-vuestrap.icons-bg-fill .icon,.icons-vuestrap.icons-bg-outline .icon{width:50%;height:50%;top:25%;left:25%}.icons-vuestrap .text{position:relative;color:#fff;z-index:3;font-size:70%;width:100%;height:100%;display:table;text-align:center}.icons-vuestrap .text>span{display:table-cell;vertical-align:middle}.icons-vuestrap.icons-right{margin-left:.2em;margin-right:0}.icons-vuestrap.icons-left{margin-left:0;margin-right:.2em}.icons-vuestrap .hidden{display:none}.icons-vuestrap.icons-sm{font-size:1rem;line-height:1rem;width:1rem;height:1rem}.icons-vuestrap.icons-md{font-size:1.5rem;line-height:1.5rem;width:1.5rem;height:1.5rem}.icons-vuestrap.icons-lg{font-size:2rem;line-height:2rem;width:2rem;height:2rem}.icons-vuestrap.icons-xl{font-size:3rem;line-height:3rem;width:3rem;height:3rem}.icons-vuestrap.icons-xxl{font-size:3.5rem;line-height:3.5rem;width:3.5rem;height:3.5rem}.icons-vuestrap .icon{fill:#818a91}.icons-vuestrap.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-bg-fill .icon-background{fill:#818a91}.icons-vuestrap.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-bg-outline .icon-background{fill:#818a91}.icons-vuestrap.icons-bg-outline .text{color:#818a91}.icons-vuestrap.icons-primary .icon{fill:#563d7c}.icons-vuestrap.icons-primary.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-primary.icons-bg-fill .icon-background{fill:#563d7c}.icons-vuestrap.icons-primary.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-primary.icons-bg-outline .icon-background{fill:#563d7c}.icons-vuestrap.icons-primary.icons-bg-outline .text{color:#563d7c}.icons-vuestrap.icons-info .icon{fill:#5bc0de}.icons-vuestrap.icons-info.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-info.icons-bg-fill .icon-background{fill:#5bc0de}.icons-vuestrap.icons-info.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-info.icons-bg-outline .icon-background{fill:#5bc0de}.icons-vuestrap.icons-info.icons-bg-outline .text{color:#5bc0de}.icons-vuestrap.icons-success .icon{fill:#42b983}.icons-vuestrap.icons-success.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-success.icons-bg-fill .icon-background{fill:#42b983}.icons-vuestrap.icons-success.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-success.icons-bg-outline .icon-background{fill:#42b983}.icons-vuestrap.icons-success.icons-bg-outline .text{color:#42b983}.icons-vuestrap.icons-warning .icon{fill:#f0ad4e}.icons-vuestrap.icons-warning.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-warning.icons-bg-fill .icon-background{fill:#f0ad4e}.icons-vuestrap.icons-warning.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-warning.icons-bg-outline .icon-background{fill:#f0ad4e}.icons-vuestrap.icons-warning.icons-bg-outline .text{color:#f0ad4e}.icons-vuestrap.icons-danger .icon{fill:#d9534f}.icons-vuestrap.icons-danger.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-danger.icons-bg-fill .icon-background{fill:#d9534f}.icons-vuestrap.icons-danger.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-danger.icons-bg-outline .icon-background{fill:#d9534f}.icons-vuestrap.icons-danger.icons-bg-outline .text{color:#d9534f}.icons-vuestrap.icons-dark .icon{fill:#000}.icons-vuestrap.icons-dark.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-dark.icons-bg-fill .icon-background{fill:#000}.icons-vuestrap.icons-dark.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-dark.icons-bg-outline .icon-background{fill:#000}.icons-vuestrap.icons-dark.icons-bg-outline .text{color:#000}.icons-vuestrap.icons-light .icon{fill:#fff}.icons-vuestrap.icons-light.icons-bg-fill .icon{fill:#000}.icons-vuestrap.icons-light.icons-bg-fill .icon-background{fill:#fff}.icons-vuestrap.icons-light.icons-bg-fill .text{color:#000}.icons-vuestrap.icons-light.icons-bg-outline .icon-background{fill:#fff}.icons-vuestrap.icons-light.icons-bg-outline .text{color:#fff}.btn.disabled svg{opacity:.5}.btn:hover svg{fill:#fff} -------------------------------------------------------------------------------- /src/components/icons/icons.scss: -------------------------------------------------------------------------------- 1 | // kzima/icons 2 | // variables 3 | $icons-size-sm: 1.0rem !default; 4 | $icons-size-md: 1.5rem !default; 5 | $icons-size-lg: 2.0rem !default; 6 | $icons-size-xl: 3.0rem !default; 7 | $icons-size-xxl: 3.5rem !default; 8 | $icons-fill-default: #818a91 !default; 9 | $icons-fill-dark: #000 !default; 10 | $icons-fill-light: #fff !default; 11 | $icons-fill-primary: $brand-primary !default; 12 | $icons-fill-info: $brand-info !default; 13 | $icons-fill-success: $brand-success !default; 14 | $icons-fill-warning: $brand-warning !default; 15 | $icons-fill-danger: $brand-danger !default; 16 | // mixins 17 | @mixin icon-variant ($mainColor, $secondaryColor) { 18 | .icon { 19 | fill: $mainColor; 20 | } 21 | &.icons-bg-fill { 22 | .icon { 23 | fill: $secondaryColor; 24 | } 25 | .icon-background { 26 | fill: $mainColor; 27 | } 28 | .text { 29 | color: $secondaryColor; 30 | } 31 | } 32 | &.icons-bg-outline { 33 | .icon-background { 34 | fill: $mainColor; 35 | } 36 | .text { 37 | color: $mainColor; 38 | } 39 | } 40 | } 41 | 42 | @mixin icon-size ($size) { 43 | font-size: $size; 44 | line-height: $size; 45 | @include size($size); 46 | } 47 | 48 | // global default 49 | .icons-vuestrap { 50 | @include icon-size ($icons-size-md) display: inline-block; 51 | vertical-align: middle; 52 | position: relative; 53 | .icon { 54 | @include size(100%); 55 | top: 0%; 56 | left: 0%; 57 | position: absolute; 58 | z-index: 2; 59 | } 60 | .icon-background { 61 | @include size(100%); 62 | position: absolute; 63 | top: 0; 64 | left: 0; 65 | z-index: 1; 66 | } 67 | &.icons-bg-fill, 68 | &.icons-bg-outline { 69 | .icon { 70 | @include size(50%); 71 | top: 25%; 72 | left: 25%; 73 | } 74 | } 75 | .text { 76 | position: relative; 77 | color: #fff; 78 | z-index: 3; 79 | font-size: 70%; 80 | width: 100%; 81 | height: 100%; 82 | display: table; 83 | text-align: center; 84 | > span { 85 | display: table-cell; 86 | vertical-align: middle; 87 | } 88 | } 89 | &.icons-right { 90 | margin-left: 0.2em; 91 | margin-right: 0; 92 | } 93 | &.icons-left { 94 | margin-left: 0; 95 | margin-right: 0.2em; 96 | } 97 | .hidden { 98 | display: none; 99 | } 100 | } 101 | 102 | // svg icon sizes 103 | .icons-vuestrap { 104 | &.icons-sm { 105 | @include icon-size($icons-size-sm) 106 | } 107 | &.icons-md { 108 | @include icon-size($icons-size-md) 109 | } 110 | &.icons-lg { 111 | @include icon-size($icons-size-lg) 112 | } 113 | &.icons-xl { 114 | @include icon-size($icons-size-xl) 115 | } 116 | &.icons-xxl { 117 | @include icon-size($icons-size-xxl) 118 | } 119 | } 120 | 121 | // svg icon fill variants 122 | .icons-vuestrap { 123 | //default 124 | @include icon-variant($icons-fill-default, $icons-fill-light); 125 | // other variants 126 | &.icons-primary { 127 | @include icon-variant($icons-fill-primary, #fff); 128 | } 129 | &.icons-info { 130 | @include icon-variant($icons-fill-info, #fff); 131 | } 132 | &.icons-success { 133 | @include icon-variant($icons-fill-success, #fff); 134 | } 135 | &.icons-warning { 136 | @include icon-variant($icons-fill-warning, #fff); 137 | } 138 | &.icons-danger { 139 | @include icon-variant($icons-fill-danger, #fff); 140 | } 141 | &.icons-dark { 142 | @include icon-variant($icons-fill-dark, $icons-fill-light); 143 | } 144 | &.icons-light { 145 | @include icon-variant($icons-fill-light, $icons-fill-dark); 146 | } 147 | } 148 | 149 | // if icon is inside disabled button, decrease opacity 150 | .btn.disabled { 151 | svg { 152 | opacity: 0.5; 153 | } 154 | } 155 | 156 | // if icon is inside hovered state button, make it white 157 | .btn:hover { 158 | svg { 159 | fill: $icons-fill-light; 160 | } 161 | } 162 | -------------------------------------------------------------------------------- /dist/vuestrapIcons.css: -------------------------------------------------------------------------------- 1 | .icons-vuestrap { 2 | font-size: 1.5rem; 3 | line-height: 1.5rem; 4 | width: 1.5rem; 5 | height: 1.5rem; 6 | display: inline-block; 7 | vertical-align: middle; 8 | position: relative; } 9 | .icons-vuestrap .icon { 10 | width: 100%; 11 | height: 100%; 12 | top: 0%; 13 | left: 0%; 14 | position: absolute; 15 | z-index: 2; } 16 | .icons-vuestrap .icon-background { 17 | width: 100%; 18 | height: 100%; 19 | position: absolute; 20 | top: 0; 21 | left: 0; 22 | z-index: 1; } 23 | .icons-vuestrap.icons-bg-fill .icon, .icons-vuestrap.icons-bg-outline .icon { 24 | width: 50%; 25 | height: 50%; 26 | top: 25%; 27 | left: 25%; } 28 | .icons-vuestrap .text { 29 | position: relative; 30 | color: #fff; 31 | z-index: 3; 32 | font-size: 70%; 33 | width: 100%; 34 | height: 100%; 35 | display: table; 36 | text-align: center; } 37 | .icons-vuestrap .text > span { 38 | display: table-cell; 39 | vertical-align: middle; } 40 | .icons-vuestrap.icons-right { 41 | margin-left: 0.2em; 42 | margin-right: 0; } 43 | .icons-vuestrap.icons-left { 44 | margin-left: 0; 45 | margin-right: 0.2em; } 46 | .icons-vuestrap .hidden { 47 | display: none; } 48 | 49 | .icons-vuestrap.icons-sm { 50 | font-size: 1rem; 51 | line-height: 1rem; 52 | width: 1rem; 53 | height: 1rem; } 54 | 55 | .icons-vuestrap.icons-md { 56 | font-size: 1.5rem; 57 | line-height: 1.5rem; 58 | width: 1.5rem; 59 | height: 1.5rem; } 60 | 61 | .icons-vuestrap.icons-lg { 62 | font-size: 2rem; 63 | line-height: 2rem; 64 | width: 2rem; 65 | height: 2rem; } 66 | 67 | .icons-vuestrap.icons-xl { 68 | font-size: 3rem; 69 | line-height: 3rem; 70 | width: 3rem; 71 | height: 3rem; } 72 | 73 | .icons-vuestrap.icons-xxl { 74 | font-size: 3.5rem; 75 | line-height: 3.5rem; 76 | width: 3.5rem; 77 | height: 3.5rem; } 78 | 79 | .icons-vuestrap .icon { 80 | fill: #818a91; } 81 | 82 | .icons-vuestrap.icons-bg-fill .icon { 83 | fill: #fff; } 84 | 85 | .icons-vuestrap.icons-bg-fill .icon-background { 86 | fill: #818a91; } 87 | 88 | .icons-vuestrap.icons-bg-fill .text { 89 | color: #fff; } 90 | 91 | .icons-vuestrap.icons-bg-outline .icon-background { 92 | fill: #818a91; } 93 | 94 | .icons-vuestrap.icons-bg-outline .text { 95 | color: #818a91; } 96 | 97 | .icons-vuestrap.icons-primary .icon { 98 | fill: #563d7c; } 99 | 100 | .icons-vuestrap.icons-primary.icons-bg-fill .icon { 101 | fill: #fff; } 102 | 103 | .icons-vuestrap.icons-primary.icons-bg-fill .icon-background { 104 | fill: #563d7c; } 105 | 106 | .icons-vuestrap.icons-primary.icons-bg-fill .text { 107 | color: #fff; } 108 | 109 | .icons-vuestrap.icons-primary.icons-bg-outline .icon-background { 110 | fill: #563d7c; } 111 | 112 | .icons-vuestrap.icons-primary.icons-bg-outline .text { 113 | color: #563d7c; } 114 | 115 | .icons-vuestrap.icons-info .icon { 116 | fill: #5bc0de; } 117 | 118 | .icons-vuestrap.icons-info.icons-bg-fill .icon { 119 | fill: #fff; } 120 | 121 | .icons-vuestrap.icons-info.icons-bg-fill .icon-background { 122 | fill: #5bc0de; } 123 | 124 | .icons-vuestrap.icons-info.icons-bg-fill .text { 125 | color: #fff; } 126 | 127 | .icons-vuestrap.icons-info.icons-bg-outline .icon-background { 128 | fill: #5bc0de; } 129 | 130 | .icons-vuestrap.icons-info.icons-bg-outline .text { 131 | color: #5bc0de; } 132 | 133 | .icons-vuestrap.icons-success .icon { 134 | fill: #42b983; } 135 | 136 | .icons-vuestrap.icons-success.icons-bg-fill .icon { 137 | fill: #fff; } 138 | 139 | .icons-vuestrap.icons-success.icons-bg-fill .icon-background { 140 | fill: #42b983; } 141 | 142 | .icons-vuestrap.icons-success.icons-bg-fill .text { 143 | color: #fff; } 144 | 145 | .icons-vuestrap.icons-success.icons-bg-outline .icon-background { 146 | fill: #42b983; } 147 | 148 | .icons-vuestrap.icons-success.icons-bg-outline .text { 149 | color: #42b983; } 150 | 151 | .icons-vuestrap.icons-warning .icon { 152 | fill: #f0ad4e; } 153 | 154 | .icons-vuestrap.icons-warning.icons-bg-fill .icon { 155 | fill: #fff; } 156 | 157 | .icons-vuestrap.icons-warning.icons-bg-fill .icon-background { 158 | fill: #f0ad4e; } 159 | 160 | .icons-vuestrap.icons-warning.icons-bg-fill .text { 161 | color: #fff; } 162 | 163 | .icons-vuestrap.icons-warning.icons-bg-outline .icon-background { 164 | fill: #f0ad4e; } 165 | 166 | .icons-vuestrap.icons-warning.icons-bg-outline .text { 167 | color: #f0ad4e; } 168 | 169 | .icons-vuestrap.icons-danger .icon { 170 | fill: #d9534f; } 171 | 172 | .icons-vuestrap.icons-danger.icons-bg-fill .icon { 173 | fill: #fff; } 174 | 175 | .icons-vuestrap.icons-danger.icons-bg-fill .icon-background { 176 | fill: #d9534f; } 177 | 178 | .icons-vuestrap.icons-danger.icons-bg-fill .text { 179 | color: #fff; } 180 | 181 | .icons-vuestrap.icons-danger.icons-bg-outline .icon-background { 182 | fill: #d9534f; } 183 | 184 | .icons-vuestrap.icons-danger.icons-bg-outline .text { 185 | color: #d9534f; } 186 | 187 | .icons-vuestrap.icons-dark .icon { 188 | fill: #000; } 189 | 190 | .icons-vuestrap.icons-dark.icons-bg-fill .icon { 191 | fill: #fff; } 192 | 193 | .icons-vuestrap.icons-dark.icons-bg-fill .icon-background { 194 | fill: #000; } 195 | 196 | .icons-vuestrap.icons-dark.icons-bg-fill .text { 197 | color: #fff; } 198 | 199 | .icons-vuestrap.icons-dark.icons-bg-outline .icon-background { 200 | fill: #000; } 201 | 202 | .icons-vuestrap.icons-dark.icons-bg-outline .text { 203 | color: #000; } 204 | 205 | .icons-vuestrap.icons-light .icon { 206 | fill: #fff; } 207 | 208 | .icons-vuestrap.icons-light.icons-bg-fill .icon { 209 | fill: #000; } 210 | 211 | .icons-vuestrap.icons-light.icons-bg-fill .icon-background { 212 | fill: #fff; } 213 | 214 | .icons-vuestrap.icons-light.icons-bg-fill .text { 215 | color: #000; } 216 | 217 | .icons-vuestrap.icons-light.icons-bg-outline .icon-background { 218 | fill: #fff; } 219 | 220 | .icons-vuestrap.icons-light.icons-bg-outline .text { 221 | color: #fff; } 222 | 223 | .btn.disabled svg { 224 | opacity: 0.5; } 225 | 226 | .btn:hover svg { 227 | fill: #fff; } 228 | 229 | /*# sourceMappingURL=vuestrapIcons.css.map*/ -------------------------------------------------------------------------------- /assets/vuestrap-logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 22 | Vue Strap Logo 24 | 26 | 51 | 55 | 59 | 63 | 67 | 71 | 75 | 76 | 78 | 79 | 81 | image/svg+xml 82 | 84 | Vue Strap Logo 85 | 86 | 87 | Kris Zima 88 | 89 | 90 | 91 | 92 | Kris Zima 93 | 94 | 95 | 97 | 98 | 100 | 102 | 104 | 106 | 108 | 110 | 111 | 112 | 113 | 118 | 121 | 124 | 127 | 132 | S 144 | 147 | 153 | 159 | 160 | 163 | 169 | 175 | 176 | 177 | 186 | 187 | 188 | 189 | 190 | 191 | -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "plugins": [ 3 | "html" // https://github.com/BenoitZugmeyer/eslint-plugin-html 4 | ], 5 | "parser": "babel-eslint", 6 | "env": { // http://eslint.org/docs/user-guide/configuring.html#specifying-environments 7 | "browser": true, // browser global variables 8 | "node": true // Node.js global variables and Node.js-specific rules 9 | }, 10 | "ecmaFeatures": { 11 | "arrowFunctions": true, 12 | "blockBindings": true, 13 | "classes": true, 14 | "defaultParams": true, 15 | "destructuring": true, 16 | "forOf": true, 17 | "generators": false, 18 | "modules": true, 19 | "objectLiteralComputedProperties": true, 20 | "objectLiteralDuplicateProperties": false, 21 | "objectLiteralShorthandMethods": true, 22 | "objectLiteralShorthandProperties": true, 23 | "spread": true, 24 | "superInFunctions": true, 25 | "templateStrings": true, 26 | "jsx": false 27 | }, 28 | "rules": { 29 | /** 30 | * Strict mode 31 | */ 32 | // babel inserts "use strict"; for us 33 | "strict": [2, "never"], // http://eslint.org/docs/rules/strict 34 | 35 | /** 36 | * ES6 37 | */ 38 | "no-var": 1, // http://eslint.org/docs/rules/no-var 39 | "prefer-const": 1, // http://eslint.org/docs/rules/prefer-const 40 | 41 | /** 42 | * Variables 43 | */ 44 | "no-shadow": 2, // http://eslint.org/docs/rules/no-shadow 45 | "no-shadow-restricted-names": 2, // http://eslint.org/docs/rules/no-shadow-restricted-names 46 | "no-unused-vars": [2, { // http://eslint.org/docs/rules/no-unused-vars 47 | "vars": "local", 48 | "args": "after-used" 49 | }], 50 | "no-use-before-define": 2, // http://eslint.org/docs/rules/no-use-before-define 51 | 52 | /** 53 | * Possible errors 54 | */ 55 | "comma-dangle": 0, 56 | "no-cond-assign": [2, "always"], // http://eslint.org/docs/rules/no-cond-assign 57 | "no-console": 1, // http://eslint.org/docs/rules/no-console 58 | "no-debugger": 1, // http://eslint.org/docs/rules/no-debugger 59 | "no-alert": 1, // http://eslint.org/docs/rules/no-alert 60 | "no-constant-condition": 1, // http://eslint.org/docs/rules/no-constant-condition 61 | "no-dupe-keys": 2, // http://eslint.org/docs/rules/no-dupe-keys 62 | "no-duplicate-case": 2, // http://eslint.org/docs/rules/no-duplicate-case 63 | "no-empty": 2, // http://eslint.org/docs/rules/no-empty 64 | "no-ex-assign": 2, // http://eslint.org/docs/rules/no-ex-assign 65 | "no-extra-boolean-cast": 0, // http://eslint.org/docs/rules/no-extra-boolean-cast 66 | "no-extra-semi": 2, // http://eslint.org/docs/rules/no-extra-semi 67 | "no-func-assign": 2, // http://eslint.org/docs/rules/no-func-assign 68 | "no-inner-declarations": 2, // http://eslint.org/docs/rules/no-inner-declarations 69 | "no-invalid-regexp": 2, // http://eslint.org/docs/rules/no-invalid-regexp 70 | "no-irregular-whitespace": 2, // http://eslint.org/docs/rules/no-irregular-whitespace 71 | "no-obj-calls": 2, // http://eslint.org/docs/rules/no-obj-calls 72 | "no-sparse-arrays": 2, // http://eslint.org/docs/rules/no-sparse-arrays 73 | "no-unreachable": 2, // http://eslint.org/docs/rules/no-unreachable 74 | "use-isnan": 2, // http://eslint.org/docs/rules/use-isnan 75 | "block-scoped-var": 2, // http://eslint.org/docs/rules/block-scoped-var 76 | 77 | /** 78 | * Best practices 79 | */ 80 | "consistent-return": 2, // http://eslint.org/docs/rules/consistent-return 81 | "curly": [2, "multi-line"], // http://eslint.org/docs/rules/curly 82 | "default-case": 2, // http://eslint.org/docs/rules/default-case 83 | "dot-notation": [2, { // http://eslint.org/docs/rules/dot-notation 84 | "allowKeywords": true 85 | }], 86 | "eqeqeq": 2, // http://eslint.org/docs/rules/eqeqeq 87 | "guard-for-in": 2, // http://eslint.org/docs/rules/guard-for-in 88 | "no-caller": 2, // http://eslint.org/docs/rules/no-caller 89 | "no-else-return": 2, // http://eslint.org/docs/rules/no-else-return 90 | "no-eq-null": 2, // http://eslint.org/docs/rules/no-eq-null 91 | "no-eval": 2, // http://eslint.org/docs/rules/no-eval 92 | "no-extend-native": 2, // http://eslint.org/docs/rules/no-extend-native 93 | "no-extra-bind": 2, // http://eslint.org/docs/rules/no-extra-bind 94 | "no-fallthrough": 2, // http://eslint.org/docs/rules/no-fallthrough 95 | "no-floating-decimal": 2, // http://eslint.org/docs/rules/no-floating-decimal 96 | "no-implied-eval": 2, // http://eslint.org/docs/rules/no-implied-eval 97 | "no-lone-blocks": 2, // http://eslint.org/docs/rules/no-lone-blocks 98 | "no-loop-func": 2, // http://eslint.org/docs/rules/no-loop-func 99 | "no-multi-str": 2, // http://eslint.org/docs/rules/no-multi-str 100 | "no-native-reassign": 2, // http://eslint.org/docs/rules/no-native-reassign 101 | "no-new": 0, 102 | "no-new-func": 2, // http://eslint.org/docs/rules/no-new-func 103 | "no-new-wrappers": 2, // http://eslint.org/docs/rules/no-new-wrappers 104 | "no-octal": 2, // http://eslint.org/docs/rules/no-octal 105 | "no-octal-escape": 2, // http://eslint.org/docs/rules/no-octal-escape 106 | "no-param-reassign": 2, // http://eslint.org/docs/rules/no-param-reassign 107 | "no-proto": 2, // http://eslint.org/docs/rules/no-proto 108 | "no-redeclare": 2, // http://eslint.org/docs/rules/no-redeclare 109 | "no-return-assign": 2, // http://eslint.org/docs/rules/no-return-assign 110 | "no-script-url": 2, // http://eslint.org/docs/rules/no-script-url 111 | "no-self-compare": 2, // http://eslint.org/docs/rules/no-self-compare 112 | "no-sequences": 2, // http://eslint.org/docs/rules/no-sequences 113 | "no-throw-literal": 2, // http://eslint.org/docs/rules/no-throw-literal 114 | "no-with": 2, // http://eslint.org/docs/rules/no-with 115 | "radix": 2, // http://eslint.org/docs/rules/radix 116 | "vars-on-top": 2, // http://eslint.org/docs/rules/vars-on-top 117 | "wrap-iife": [2, "any"], // http://eslint.org/docs/rules/wrap-iife 118 | "yoda": 2, // http://eslint.org/docs/rules/yoda 119 | 120 | /** 121 | * Style 122 | */ 123 | "brace-style": [2, // http://eslint.org/docs/rules/brace-style 124 | "1tbs", { 125 | "allowSingleLine": true 126 | }], 127 | "quotes": [ 128 | 2, "single", "avoid-escape" // http://eslint.org/docs/rules/quotes 129 | ], 130 | "camelcase": [2, { // http://eslint.org/docs/rules/camelcase 131 | "properties": "never" 132 | }], 133 | "comma-spacing": [2, { // http://eslint.org/docs/rules/comma-spacing 134 | "before": false, 135 | "after": true 136 | }], 137 | "comma-style": [2, "last"], // http://eslint.org/docs/rules/comma-style 138 | "eol-last": 2, // http://eslint.org/docs/rules/eol-last 139 | "func-names": 1, // http://eslint.org/docs/rules/func-names 140 | "key-spacing": [2, { // http://eslint.org/docs/rules/key-spacing 141 | "beforeColon": false, 142 | "afterColon": true 143 | }], 144 | "new-cap": [2, { // http://eslint.org/docs/rules/new-cap 145 | "newIsCap": true 146 | }], 147 | "no-multiple-empty-lines": 0, 148 | "no-nested-ternary": 2, // http://eslint.org/docs/rules/no-nested-ternary 149 | "no-new-object": 2, // http://eslint.org/docs/rules/no-new-object 150 | "no-spaced-func": 2, // http://eslint.org/docs/rules/no-spaced-func 151 | "no-trailing-spaces": 2, // http://eslint.org/docs/rules/no-trailing-spaces 152 | "no-extra-parens": [2, "functions"], // http://eslint.org/docs/rules/no-extra-parens 153 | "no-underscore-dangle": 0, // http://eslint.org/docs/rules/no-underscore-dangle 154 | "one-var": [2, "never"], // http://eslint.org/docs/rules/one-var 155 | "padded-blocks": [2, "never"], // http://eslint.org/docs/rules/padded-blocks 156 | "semi": [2, "never"], // http://eslint.org/docs/rules/semi 157 | "semi-spacing": [2, { // http://eslint.org/docs/rules/semi-spacing 158 | "before": false, 159 | "after": true 160 | }], 161 | "space-after-keywords": 2, // http://eslint.org/docs/rules/space-after-keywords 162 | "space-before-blocks": 2, // http://eslint.org/docs/rules/space-before-blocks 163 | "space-before-function-paren": [2, "never"], // http://eslint.org/docs/rules/space-before-function-paren 164 | "space-infix-ops": 2, // http://eslint.org/docs/rules/space-infix-ops 165 | "space-return-throw-case": 2, // http://eslint.org/docs/rules/space-return-throw-case 166 | "spaced-comment": [2, "always", {// http://eslint.org/docs/rules/spaced-comment 167 | "exceptions": ["-", "+"], 168 | "markers": ["=", "!"] // space here to support sprockets directives 169 | }] 170 | } 171 | } 172 | -------------------------------------------------------------------------------- /dist/vuestrapIcons.js: -------------------------------------------------------------------------------- 1 | (function webpackUniversalModuleDefinition(root, factory) { 2 | if(typeof exports === 'object' && typeof module === 'object') 3 | module.exports = factory(); 4 | else if(typeof define === 'function' && define.amd) 5 | define([], factory); 6 | else if(typeof exports === 'object') 7 | exports["vuestrapIcons"] = factory(); 8 | else 9 | root["vuestrapIcons"] = factory(); 10 | })(this, function() { 11 | return /******/ (function(modules) { // webpackBootstrap 12 | /******/ // The module cache 13 | /******/ var installedModules = {}; 14 | /******/ 15 | /******/ // The require function 16 | /******/ function __webpack_require__(moduleId) { 17 | /******/ 18 | /******/ // Check if module is in cache 19 | /******/ if(installedModules[moduleId]) 20 | /******/ return installedModules[moduleId].exports; 21 | /******/ 22 | /******/ // Create a new module (and put it into the cache) 23 | /******/ var module = installedModules[moduleId] = { 24 | /******/ exports: {}, 25 | /******/ id: moduleId, 26 | /******/ loaded: false 27 | /******/ }; 28 | /******/ 29 | /******/ // Execute the module function 30 | /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); 31 | /******/ 32 | /******/ // Flag the module as loaded 33 | /******/ module.loaded = true; 34 | /******/ 35 | /******/ // Return the exports of the module 36 | /******/ return module.exports; 37 | /******/ } 38 | /******/ 39 | /******/ 40 | /******/ // expose the modules object (__webpack_modules__) 41 | /******/ __webpack_require__.m = modules; 42 | /******/ 43 | /******/ // expose the module cache 44 | /******/ __webpack_require__.c = installedModules; 45 | /******/ 46 | /******/ // __webpack_public_path__ 47 | /******/ __webpack_require__.p = ""; 48 | /******/ 49 | /******/ // Load entry module and return exports 50 | /******/ return __webpack_require__(0); 51 | /******/ }) 52 | /************************************************************************/ 53 | /******/ ([ 54 | /* 0 */ 55 | /***/ function(module, exports, __webpack_require__) { 56 | 57 | /** 58 | * IMPORT EACH COMPONENT 59 | */ 60 | 'use strict'; 61 | 62 | Object.defineProperty(exports, '__esModule', { 63 | value: true 64 | }); 65 | 66 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; } 67 | 68 | var _srcComponentsIcons = __webpack_require__(1); 69 | 70 | var _srcComponentsIcons2 = _interopRequireDefault(_srcComponentsIcons); 71 | 72 | var vuestrapIcons = { 73 | icons: _srcComponentsIcons2['default'] 74 | }; 75 | 76 | exports['default'] = vuestrapIcons; 77 | module.exports = exports['default']; 78 | 79 | /***/ }, 80 | /* 1 */ 81 | /***/ function(module, exports, __webpack_require__) { 82 | 83 | // import dependencies 84 | 'use strict'; 85 | 86 | Object.defineProperty(exports, '__esModule', { 87 | value: true 88 | }); 89 | 90 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; } 91 | 92 | __webpack_require__(2); 93 | 94 | var _iconsHtml = __webpack_require__(6); 95 | 96 | var _iconsHtml2 = _interopRequireDefault(_iconsHtml); 97 | 98 | // enable support for svg in all browsers 99 | 100 | __webpack_require__(7); 101 | 102 | // export component object 103 | exports['default'] = { 104 | template: _iconsHtml2['default'], 105 | replace: true, 106 | computed: { 107 | iconsSize: function iconsSize() { 108 | return !this.size ? 'icons-sm' : 'icons-' + this.size; 109 | }, 110 | iconsAlign: function iconsAlign() { 111 | return !this.align ? '' : 'icons-' + this.align; 112 | }, 113 | iconsVariant: function iconsVariant() { 114 | return !this.variant ? '' : 'icons-' + this.variant; 115 | }, 116 | iconsBackground: function iconsBackground() { 117 | var bg = this.background.split('-'); 118 | bg = bg[1] ? bg[1] : 'fill'; 119 | return !this.background ? '' : 'icons-bg-' + bg; 120 | } 121 | }, 122 | props: { 123 | name: { 124 | type: String 125 | }, 126 | background: { 127 | type: String, 128 | 'default': '' 129 | }, 130 | align: { 131 | type: String, 132 | 'default': '' 133 | }, 134 | size: { 135 | type: String, 136 | 'default': 'sm' 137 | }, 138 | text: { 139 | type: String, 140 | 'default': '' 141 | }, 142 | variant: { 143 | type: String, 144 | 'default': 'standard' 145 | }, 146 | path: { 147 | type: String, 148 | 'default': function _default() { 149 | if (false) { 150 | return 'bower_components/vuestrap-icons/assets/icons.min.svg'; 151 | } 152 | if (false) { 153 | return 'assets/icons.min.svg'; 154 | } 155 | return 'node_modules/vuestrap-icons/assets/icons.min.svg'; 156 | } 157 | }, 158 | ready: function ready() { 159 | if (!this.path && this.$options.vuestrapIconsPath) { 160 | this.path = this.$options.vuestrapIconsPath; 161 | } 162 | } 163 | } 164 | }; 165 | module.exports = exports['default']; 166 | 167 | /***/ }, 168 | /* 2 */ 169 | /***/ function(module, exports) { 170 | 171 | // removed by extract-text-webpack-plugin 172 | 173 | /***/ }, 174 | /* 3 */, 175 | /* 4 */, 176 | /* 5 */, 177 | /* 6 */ 178 | /***/ function(module, exports) { 179 | 180 | module.exports = "\r\n\t\r\n\t\t\r\n\t\t\t\r\n\t\t\r\n\t\r\n\t\r\n\t\t\r\n\t\t\t\r\n\t\t\r\n\t\r\n\t\r\n\t\t{{text}}\r\n\t\r\n"; 181 | 182 | /***/ }, 183 | /* 7 */ 184 | /***/ function(module, exports) { 185 | 186 | /*! svg4everybody v2.0.0 | github.com/jonathantneal/svg4everybody */ 187 | 'use strict'; 188 | 189 | Object.defineProperty(exports, '__esModule', { 190 | value: true 191 | }); 192 | var LEGACY_SUPPORT = false; 193 | 194 | function embed(svg, g) { 195 | if (g) { 196 | var viewBox = !svg.getAttribute('viewBox') && g.getAttribute('viewBox'); 197 | var fragment = document.createDocumentFragment(); 198 | var clone = g.cloneNode(true); 199 | 200 | if (viewBox) { 201 | svg.setAttribute('viewBox', viewBox); 202 | } 203 | 204 | while (clone.childNodes.length) { 205 | fragment.appendChild(clone.firstChild); 206 | } 207 | 208 | svg.appendChild(fragment); 209 | } 210 | } 211 | 212 | function loadreadystatechange(xhr) { 213 | xhr.onreadystatechange = function () { 214 | if (xhr.readyState === 4) { 215 | var x = document.createElement('x'); 216 | 217 | x.innerHTML = xhr.responseText; 218 | 219 | xhr.s.splice(0).map(function (array) { 220 | embed(array[0], x.querySelector('#' + array[1].replace(/(\W)/g, '\\$1'))); 221 | }); 222 | } 223 | }; 224 | 225 | xhr.onreadystatechange(); 226 | } 227 | 228 | function svg4everybody(opts) { 229 | opts = opts || {}; 230 | 231 | var uses = document.getElementsByTagName('use'); 232 | var nosvg; 233 | 234 | if (LEGACY_SUPPORT) { 235 | var fallback = opts.fallback || function (src) { 236 | return src.replace(/\?[^#]+/, '').replace('#', '.').replace(/^\./, '') + '.png' + (/\?[^#]+/.exec(src) || [''])[0]; 237 | }; 238 | 239 | nosvg = 'nosvg' in opts ? opts.nosvg : /\bMSIE [1-8]\b/.test(navigator.userAgent); 240 | 241 | if (nosvg) { 242 | document.createElement('svg'); 243 | document.createElement('use'); 244 | } 245 | } 246 | 247 | var polyfill = 'polyfill' in opts ? opts.polyfill : LEGACY_SUPPORT ? nosvg || /\bEdge\/12\b|\bMSIE [1-8]\b|\bTrident\/[567]\b|\bVersion\/7.0 Safari\b/.test(navigator.userAgent) || (navigator.userAgent.match(/AppleWebKit\/(\d+)/) || [])[1] < 537 : /\bEdge\/12\b|\bTrident\/[567]\b|\bVersion\/7.0 Safari\b/.test(navigator.userAgent) || (navigator.userAgent.match(/AppleWebKit\/(\d+)/) || [])[1] < 537; 248 | 249 | var validate = opts.validate; 250 | var requestAnimationFrame = window.requestAnimationFrame || setTimeout; 251 | var svgCache = {}; 252 | 253 | function oninterval() { 254 | var use; 255 | 256 | while (use = uses[0]) { 257 | var svg = use.parentNode; 258 | 259 | if (svg && /svg/i.test(svg.nodeName)) { 260 | var src = use.getAttribute('xlink:href'); 261 | 262 | if (LEGACY_SUPPORT && nosvg) { 263 | var img = new Image(); 264 | var width = svg.getAttribute('width'); 265 | var height = svg.getAttribute('height'); 266 | 267 | img.src = fallback(src, svg, use); 268 | 269 | if (width) { 270 | img.setAttribute('width', width); 271 | } 272 | 273 | if (height) { 274 | img.setAttribute('height', height); 275 | } 276 | 277 | svg.replaceChild(img, use); 278 | } else if (polyfill) { 279 | if (!validate || validate(src, svg, use)) { 280 | var url = src.split('#'); 281 | var url_root = url[0]; 282 | var url_hash = url[1]; 283 | 284 | svg.removeChild(use); 285 | 286 | if (url_root.length) { 287 | var xhr = svgCache[url_root] = svgCache[url_root] || new XMLHttpRequest(); 288 | 289 | if (!xhr.s) { 290 | xhr.s = []; 291 | 292 | xhr.open('GET', url_root); 293 | 294 | xhr.send(); 295 | } 296 | 297 | xhr.s.push([svg, url_hash]); 298 | 299 | loadreadystatechange(xhr); 300 | } else { 301 | embed(svg, document.getElementById(url_hash)); 302 | } 303 | } 304 | } 305 | } 306 | } 307 | 308 | requestAnimationFrame(oninterval, 17); 309 | } 310 | 311 | if (polyfill) { 312 | oninterval(); 313 | } 314 | } 315 | 316 | var svgPolyfill = { 317 | svg4everybody: svg4everybody() 318 | }; 319 | exports.svgPolyfill = svgPolyfill; 320 | 321 | /***/ } 322 | /******/ ]) 323 | }); 324 | ; 325 | //# sourceMappingURL=vuestrapIcons.js.map -------------------------------------------------------------------------------- /dist/vuestrapIcons-bundle.min.js: -------------------------------------------------------------------------------- 1 | !function(e,n){"object"==typeof exports&&"object"==typeof module?module.exports=n():"function"==typeof define&&define.amd?define([],n):"object"==typeof exports?exports.vuestrapIcons=n():e.vuestrapIcons=n()}(this,function(){return function(e){function n(t){if(i[t])return i[t].exports;var o=i[t]={exports:{},id:t,loaded:!1};return e[t].call(o.exports,o,o.exports,n),o.loaded=!0,o.exports}var i={};return n.m=e,n.c=i,n.p="",n(0)}([function(e,n,i){"use strict";function t(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(n,"__esModule",{value:!0});var o=i(1),s=t(o),r={icons:s["default"]};n["default"]=r,e.exports=n["default"]},function(e,n,i){"use strict";function t(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(n,"__esModule",{value:!0}),i(2);var o=i(6),s=t(o);i(7),n["default"]={template:s["default"],replace:!0,computed:{iconsSize:function(){return this.size?"icons-"+this.size:"icons-sm"},iconsAlign:function(){return this.align?"icons-"+this.align:""},iconsVariant:function(){return this.variant?"icons-"+this.variant:""},iconsBackground:function(){var e=this.background.split("-");return e=e[1]?e[1]:"fill",this.background?"icons-bg-"+e:""}},props:{name:{type:String},background:{type:String,"default":""},align:{type:String,"default":""},size:{type:String,"default":"sm"},text:{type:String,"default":""},variant:{type:String,"default":"standard"},path:{type:String,"default":function(){return"bower_components/vuestrap-icons/assets/icons.min.svg"}},ready:function(){!this.path&&this.$options.vuestrapIconsPath&&(this.path=this.$options.vuestrapIconsPath)}}},e.exports=n["default"]},function(e,n,i){var t=i(3);"string"==typeof t&&(t=[[e.id,t,""]]);i(5)(t,{});t.locals&&(e.exports=t.locals)},function(e,n,i){n=e.exports=i(4)(),n.push([e.id,".icons-vuestrap{font-size:1.5rem;line-height:1.5rem;width:1.5rem;height:1.5rem;display:inline-block;vertical-align:middle;position:relative}.icons-vuestrap .icon{width:100%;height:100%;top:0;left:0;position:absolute;z-index:2}.icons-vuestrap .icon-background{width:100%;height:100%;position:absolute;top:0;left:0;z-index:1}.icons-vuestrap.icons-bg-fill .icon,.icons-vuestrap.icons-bg-outline .icon{width:50%;height:50%;top:25%;left:25%}.icons-vuestrap .text{position:relative;color:#fff;z-index:3;font-size:70%;width:100%;height:100%;display:table;text-align:center}.icons-vuestrap .text>span{display:table-cell;vertical-align:middle}.icons-vuestrap.icons-right{margin-left:.2em;margin-right:0}.icons-vuestrap.icons-left{margin-left:0;margin-right:.2em}.icons-vuestrap .hidden{display:none}.icons-vuestrap.icons-sm{font-size:1rem;line-height:1rem;width:1rem;height:1rem}.icons-vuestrap.icons-md{font-size:1.5rem;line-height:1.5rem;width:1.5rem;height:1.5rem}.icons-vuestrap.icons-lg{font-size:2rem;line-height:2rem;width:2rem;height:2rem}.icons-vuestrap.icons-xl{font-size:3rem;line-height:3rem;width:3rem;height:3rem}.icons-vuestrap.icons-xxl{font-size:3.5rem;line-height:3.5rem;width:3.5rem;height:3.5rem}.icons-vuestrap .icon{fill:#818a91}.icons-vuestrap.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-bg-fill .icon-background{fill:#818a91}.icons-vuestrap.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-bg-outline .icon-background{fill:#818a91}.icons-vuestrap.icons-bg-outline .text{color:#818a91}.icons-vuestrap.icons-primary .icon{fill:#563d7c}.icons-vuestrap.icons-primary.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-primary.icons-bg-fill .icon-background{fill:#563d7c}.icons-vuestrap.icons-primary.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-primary.icons-bg-outline .icon-background{fill:#563d7c}.icons-vuestrap.icons-primary.icons-bg-outline .text{color:#563d7c}.icons-vuestrap.icons-info .icon{fill:#5bc0de}.icons-vuestrap.icons-info.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-info.icons-bg-fill .icon-background{fill:#5bc0de}.icons-vuestrap.icons-info.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-info.icons-bg-outline .icon-background{fill:#5bc0de}.icons-vuestrap.icons-info.icons-bg-outline .text{color:#5bc0de}.icons-vuestrap.icons-success .icon{fill:#42b983}.icons-vuestrap.icons-success.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-success.icons-bg-fill .icon-background{fill:#42b983}.icons-vuestrap.icons-success.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-success.icons-bg-outline .icon-background{fill:#42b983}.icons-vuestrap.icons-success.icons-bg-outline .text{color:#42b983}.icons-vuestrap.icons-warning .icon{fill:#f0ad4e}.icons-vuestrap.icons-warning.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-warning.icons-bg-fill .icon-background{fill:#f0ad4e}.icons-vuestrap.icons-warning.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-warning.icons-bg-outline .icon-background{fill:#f0ad4e}.icons-vuestrap.icons-warning.icons-bg-outline .text{color:#f0ad4e}.icons-vuestrap.icons-danger .icon{fill:#d9534f}.icons-vuestrap.icons-danger.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-danger.icons-bg-fill .icon-background{fill:#d9534f}.icons-vuestrap.icons-danger.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-danger.icons-bg-outline .icon-background{fill:#d9534f}.icons-vuestrap.icons-danger.icons-bg-outline .text{color:#d9534f}.icons-vuestrap.icons-dark .icon{fill:#000}.icons-vuestrap.icons-dark.icons-bg-fill .icon{fill:#fff}.icons-vuestrap.icons-dark.icons-bg-fill .icon-background{fill:#000}.icons-vuestrap.icons-dark.icons-bg-fill .text{color:#fff}.icons-vuestrap.icons-dark.icons-bg-outline .icon-background{fill:#000}.icons-vuestrap.icons-dark.icons-bg-outline .text{color:#000}.icons-vuestrap.icons-light .icon{fill:#fff}.icons-vuestrap.icons-light.icons-bg-fill .icon{fill:#000}.icons-vuestrap.icons-light.icons-bg-fill .icon-background{fill:#fff}.icons-vuestrap.icons-light.icons-bg-fill .text{color:#000}.icons-vuestrap.icons-light.icons-bg-outline .icon-background{fill:#fff}.icons-vuestrap.icons-light.icons-bg-outline .text{color:#fff}.btn.disabled svg{opacity:.5}.btn:hover svg{fill:#fff}",""])},function(e,n){e.exports=function(){var e=[];return e.toString=function(){for(var e=[],n=0;n=0&&x.splice(n,1)}function c(e){var n=document.createElement("style");return n.type="text/css",s(e,n),n}function a(e){var n=document.createElement("link");return n.rel="stylesheet",s(e,n),n}function l(e,n){var i,t,o;if(n.singleton){var s=m++;i=b||(b=c(n)),t=f.bind(null,i,s,!1),o=f.bind(null,i,s,!0)}else e.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(i=a(n),t=p.bind(null,i),o=function(){r(i),i.href&&URL.revokeObjectURL(i.href)}):(i=c(n),t=u.bind(null,i),o=function(){r(i)});return t(e),function(n){if(n){if(n.css===e.css&&n.media===e.media&&n.sourceMap===e.sourceMap)return;t(e=n)}else o()}}function f(e,n,i,t){var o=i?"":t.css;if(e.styleSheet)e.styleSheet.cssText=y(n,o);else{var s=document.createTextNode(o),r=e.childNodes;r[n]&&e.removeChild(r[n]),r.length?e.insertBefore(s,r[n]):e.appendChild(s)}}function u(e,n){var i=n.css,t=n.media;n.sourceMap;if(t&&e.setAttribute("media",t),e.styleSheet)e.styleSheet.cssText=i;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(i))}}function p(e,n){var i=n.css,t=(n.media,n.sourceMap);t&&(i+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(t))))+" */");var o=new Blob([i],{type:"text/css"}),s=e.href;e.href=URL.createObjectURL(o),s&&URL.revokeObjectURL(s)}var d={},g=function(e){var n;return function(){return"undefined"==typeof n&&(n=e.apply(this,arguments)),n}},v=g(function(){return/msie [6-9]\b/.test(window.navigator.userAgent.toLowerCase())}),h=g(function(){return document.head||document.getElementsByTagName("head")[0]}),b=null,m=0,x=[];e.exports=function(e,n){n=n||{},"undefined"==typeof n.singleton&&(n.singleton=v()),"undefined"==typeof n.insertAt&&(n.insertAt="bottom");var i=o(e);return t(i,n),function(e){for(var s=[],r=0;r