svg inline fontawesome icons

This commit is contained in:
Christoph Wiechert
2017-07-18 13:55:47 +02:00
parent 7371f56862
commit 9c9dd61735
17 changed files with 110 additions and 50 deletions

View File

@@ -13,13 +13,17 @@ Copies a string into the clipboard
<template lang="pug">
span(@click.stop='copy()', style='cursor: pointer')
slot(:state='state')
i.fa.fa-fw(:class="{'fa-copy':state=='pristine','fa-check':state=='copied','fa-exclamation-triangle':state=='error'}")
icon.fa-fw(name="copy", v-if="state==='pristine'")
icon.fa-fw(name="check", v-if="state==='copied'")
icon.fa-fw(name="exclamation-triangle", v-if="state==='error'")
slot(name='text') Copy
</template>
<script type="text/babel">
"use strict";
import 'vue-awesome/icons/check';
import 'vue-awesome/icons/copy';
import 'vue-awesome/icons/exclamation-triangle';
export default {
name: "Clipboard",

View File

@@ -1,13 +1,17 @@
<template lang="pug">
div.file-icon
i.fa.fa-fw.fa-3x(v-if='!isImageBlob', :class='iconClass')
icon(:name="iconClass", v-if="!isImageBlob", scale="3")
|
img(v-if='isImageBlob', :src='blobUrl')
</template>
<script type="text/babel">
"use strict";
import 'vue-awesome/icons/file-image-o';
import 'vue-awesome/icons/file-text-o';
import 'vue-awesome/icons/file-video-o';
import 'vue-awesome/icons/file-audio-o';
import 'vue-awesome/icons/file-archive-o';
export default {
props: ['file'],
@@ -15,14 +19,14 @@
computed: {
iconClass() {
const type = this.file.type || this.file.metadata && this.file.metadata.type;
if(!type) return 'fa-file-o';
if(type.startsWith('image')) return 'fa-file-image-o';
if(type.startsWith('text')) return 'fa-file-text-o';
if(type.startsWith('video')) return 'fa-file-video-o';
if(type.startsWith('audio')) return 'fa-file-audio-o';
if(type === 'application/pdf') return 'fa-file-pdf-o';
if(type.startsWith('application')) return 'fa-file-archive-o';
return 'fa-file-o';
if(!type) return 'file-o';
if(type.startsWith('image')) return 'file-image-o';
if(type.startsWith('text')) return 'file-text-o';
if(type.startsWith('video')) return 'file-video-o';
if(type.startsWith('audio')) return 'file-audio-o';
if(type === 'application/pdf') return 'file-pdf-o';
if(type.startsWith('application')) return 'file-archive-o';
return 'file-o';
},
isImageBlob() {
if(!URL && !webkitURL) return false;