spacemono added
This commit is contained in:
parent
019ea85e19
commit
e4ad517e33
|
@ -1,8 +1,8 @@
|
||||||
Vue.component('fontpicker', {
|
Vue.component('fontpicker', {
|
||||||
template: `
|
template: `
|
||||||
<span
|
<span
|
||||||
class="style-pick"
|
class="style-pick"
|
||||||
v-on:click="toggle"
|
v-on:click="toggle"
|
||||||
v-bind:class="{ 'tagged': tag.isTrue}">
|
v-bind:class="{ 'tagged': tag.isTrue}">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</span>
|
</span>
|
||||||
|
@ -14,41 +14,41 @@ Vue.component('fontpicker', {
|
||||||
this.tag.isTrue = !this.tag.isTrue
|
this.tag.isTrue = !this.tag.isTrue
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
Vue.component('fontdemo', {
|
Vue.component('fontdemo', {
|
||||||
template: `
|
template: `
|
||||||
<div class="single-font" v-show="typeface.tags.some(o => o.isTrue === true) || fresh">
|
<div class="single-font" v-show="typeface.tags.some(o => o.isTrue === true) || fresh">
|
||||||
<p :style="{
|
<p :style="{
|
||||||
'font-family': typeface.name,
|
'font-family': typeface.name,
|
||||||
'font-size' : this.fontSize,
|
'font-size' : this.fontSize,
|
||||||
'font-weight' : this.fontWeight,
|
'font-weight' : this.fontWeight,
|
||||||
'font-style' : this.fontStyle
|
'font-style' : this.fontStyle
|
||||||
}">
|
}">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</p>
|
</p>
|
||||||
<footer>
|
<footer>
|
||||||
<section class="font-weights">
|
<section class="font-weights">
|
||||||
<span
|
<span
|
||||||
v-for="weight in weights"
|
v-for="weight in weights"
|
||||||
:style="{ 'font-weight': weight }"
|
:style="{ 'font-weight': weight }"
|
||||||
v-on:click="setWeight(weight)"
|
v-on:click="setWeight(weight)"
|
||||||
>{{ weight }}</span>
|
>{{ weight }}</span>
|
||||||
<span
|
<span
|
||||||
v-if="hasItalic"
|
v-if="hasItalic"
|
||||||
class="brz9-icon-italic"
|
class="brz9-icon-italic"
|
||||||
v-on:click="fontStyle = fontStyle == 'normal' ? 'italic' : 'normal'"
|
v-on:click="fontStyle = fontStyle == 'normal' ? 'italic' : 'normal'"
|
||||||
></span>
|
></span>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<section class="font-name">
|
<section class="font-name">
|
||||||
<span class="font-name">{{ typeface.name }} - </span>
|
<span class="font-name">{{ typeface.name }} - </span>
|
||||||
<span class="copy-css" v-on:click="copyToClipboard()">Copy CSS Link import</span>
|
<span class="copy-css" v-on:click="copyToClipboard()">Copy CSS Link import</span>
|
||||||
<span
|
<span
|
||||||
class="copy-icon-popup"
|
class="copy-icon-popup"
|
||||||
v-bind:class="{ 'success': isCopied}"
|
v-bind:class="{ 'success': isCopied}"
|
||||||
ref="element">Copied!</span>
|
ref="element">Copied!</span>
|
||||||
</section>
|
</section>
|
||||||
</footer>
|
</footer>
|
||||||
|
@ -71,7 +71,7 @@ Vue.component('fontdemo', {
|
||||||
return this.size + "rem";
|
return this.size + "rem";
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
copyToClipboard() {
|
copyToClipboard() {
|
||||||
let text = this.linkText + this.typeface.name.toLowerCase() + ".css" + this.linkTextEnd;
|
let text = this.linkText + this.typeface.name.toLowerCase() + ".css" + this.linkTextEnd;
|
||||||
const textarea = document.createElement('textarea')
|
const textarea = document.createElement('textarea')
|
||||||
|
@ -93,7 +93,7 @@ Vue.component('fontdemo', {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.weights = this.typeface.fonts.filter(function(weight) {
|
this.weights = this.typeface.fonts.filter(function(weight) {
|
||||||
return weight.indexOf("i") == -1;
|
return weight.indexOf("i") == -1;
|
||||||
});
|
});
|
||||||
this.weights.sort(function(a, b) {
|
this.weights.sort(function(a, b) {
|
||||||
|
@ -1137,6 +1137,18 @@ let vm = new Vue({
|
||||||
"commercial": false,
|
"commercial": false,
|
||||||
"open": false,
|
"open": false,
|
||||||
},
|
},
|
||||||
|
spacemono : {
|
||||||
|
"name": "SpaceMono",
|
||||||
|
"fonts" : [
|
||||||
|
],
|
||||||
|
"tags" : ["mono"],
|
||||||
|
"link" : "https://www.colophon-foundry.org/custom-projects/space-mono",
|
||||||
|
"creator" : "Colophon Foundry",
|
||||||
|
"creatorLink" : "https://www.colophon-foundry.org/",
|
||||||
|
"licence" : "SIL",
|
||||||
|
"commercial" : true,
|
||||||
|
"open": true,
|
||||||
|
},
|
||||||
surfingcapital : {
|
surfingcapital : {
|
||||||
"name": "SurfingCapital",
|
"name": "SurfingCapital",
|
||||||
"fonts": [
|
"fonts": [
|
||||||
|
@ -1319,6 +1331,7 @@ let vm = new Vue({
|
||||||
this.resin,
|
this.resin,
|
||||||
this.montrappist,
|
this.montrappist,
|
||||||
this.hamletcicero,
|
this.hamletcicero,
|
||||||
|
this.spacemono,
|
||||||
this.imposible,
|
this.imposible,
|
||||||
this.grobedeutschmeister,
|
this.grobedeutschmeister,
|
||||||
this.theboldfont,
|
this.theboldfont,
|
||||||
|
@ -1402,7 +1415,7 @@ let vm = new Vue({
|
||||||
this.blankenburg.tags = [this.taglist.display, this.taglist.goth]
|
this.blankenburg.tags = [this.taglist.display, this.taglist.goth]
|
||||||
this.blazed.tags = [this.taglist.display, this.taglist.graphic]
|
this.blazed.tags = [this.taglist.display, this.taglist.graphic]
|
||||||
this.bondi.tags = [this.taglist.display, this.taglist.allcaps]
|
this.bondi.tags = [this.taglist.display, this.taglist.allcaps]
|
||||||
this.boston.tags = [this.taglist.display, this.taglist.retro]
|
this.boston.tags = [this.taglist.display, this.taglist.retro]
|
||||||
this.catreporter.tags = [this.taglist.display, this.taglist.comic]
|
this.catreporter.tags = [this.taglist.display, this.taglist.comic]
|
||||||
this.canobis.tags = [this.taglist.display, this.taglist.fancy, this.taglist.artnouv]
|
this.canobis.tags = [this.taglist.display, this.taglist.fancy, this.taglist.artnouv]
|
||||||
this.cherish.tags = [this.taglist.display, this.taglist.hand]
|
this.cherish.tags = [this.taglist.display, this.taglist.hand]
|
||||||
|
@ -1452,6 +1465,7 @@ let vm = new Vue({
|
||||||
this.rousseaudeco.tags = [this.taglist.display, this.taglist.fancy, this.taglist.artnouv]
|
this.rousseaudeco.tags = [this.taglist.display, this.taglist.fancy, this.taglist.artnouv]
|
||||||
this.saintregus.tags = [this.taglist.display]
|
this.saintregus.tags = [this.taglist.display]
|
||||||
this.sonderregular.tags = [this.taglist.display, this.taglist.fancy]
|
this.sonderregular.tags = [this.taglist.display, this.taglist.fancy]
|
||||||
|
this.spacemono.tags = [this.taglist.mono]
|
||||||
this.surfingcapital.tags = [this.taglist.graphic]
|
this.surfingcapital.tags = [this.taglist.graphic]
|
||||||
this.theboldfont.tags = [this.taglist.display, this.taglist.allcaps]
|
this.theboldfont.tags = [this.taglist.display, this.taglist.allcaps]
|
||||||
this.theater.tags = [this.taglist.display, this.taglist.allcaps, this.taglist.condensed]
|
this.theater.tags = [this.taglist.display, this.taglist.allcaps, this.taglist.condensed]
|
||||||
|
|
Loading…
Reference in New Issue