Make an oblique.
This commit is contained in:
be5invis
parent
f95465836e
commit
e0bf066e06
5 changed files with 174 additions and 83 deletions
|
|
@ -493,8 +493,8 @@ symbol-block 'a'
|
|||
include eMarks
|
||||
set-anchor 'trailing' BASE (RIGHTSB - markHalfStroke) 0
|
||||
local bartop (XH * BARPOS * 1.02 + HALFSTROKE)
|
||||
local lowslope : let [k : linreg 18 0 126 0.85 STROKE] : [shoulderMidSlope SHOULDERFINE nothing (-1)] * k - TANSLANT * (1 - k)
|
||||
local lowmiddle : [mix (SB + OX) (RIGHTSB - HALFSTROKE * HVCONTRAST) [linreg 72 0.51 126 0.56 STROKE]] + CORRECTION_OMIDS
|
||||
local lowslope : shoulderMidSlope SHOULDERFINE nothing (-1)
|
||||
local lowmiddle : [mix (SB + OX) (RIGHTSB - HALFSTROKE * HVCONTRAST) [linreg 72 0.51 126 0.58 STROKE]] + CORRECTION_OMIDS * 0.5
|
||||
local barsmooth : mix SB RIGHTSB 0.55
|
||||
include : dispiro
|
||||
widths.lhs
|
||||
|
|
@ -510,9 +510,8 @@ symbol-block 'a'
|
|||
g4 (SB + OX) (bartop * 0.95 * (SMALLSMOOTHB / (SMALLSMOOTHA + SMALLSMOOTHB)))
|
||||
arcvh
|
||||
g4 (lowmiddle + (-lowslope) * STROKE) O [heading {.y 1 .x lowslope}]
|
||||
archv
|
||||
flat (RIGHTSB - STROKE * HVCONTRAST) (SMALLSMOOTHB * 0.9) [widths 0 SHOULDERFINE]
|
||||
curl (RIGHTSB - STROKE * HVCONTRAST) (SMALLSMOOTHB * 0.9 + 1)
|
||||
archv 16
|
||||
straight.up.end (RIGHTSB - STROKE * HVCONTRAST + SHOULDERFINE * HVCONTRAST) (SMALLSMOOTHB * 0.9) [widths.lhs SHOULDERFINE]
|
||||
if SLAB : begin
|
||||
include : tagged 'serifRB' : RightwardBottomSerif RIGHTSB 0 SIDEJUT
|
||||
|
||||
|
|
@ -2393,7 +2392,7 @@ define {LongSShape} : symbol-block 'f'
|
|||
g4 (RIGHTSB + RBALANCE2 - OXE) (CAP - HOOK * 0.7)
|
||||
hookstart (CAP - O) true
|
||||
flat barleft [CAP - SMOOTHA * 0.85]
|
||||
curl barleft 0
|
||||
curl barleft 0 [heading DOWNWARD]
|
||||
include : HBarTop [mix SB RIGHTSB 0] [mix SB RIGHTSB 0.95] fbar
|
||||
if SLAB : include : HBarBottom [mix SB RIGHTSB 0.02] [mix SB RIGHTSB 0.875] 0
|
||||
|
||||
|
|
|
|||
77
onegroup.mk
77
onegroup.mk
|
|
@ -21,10 +21,8 @@ NODE = node
|
|||
|
||||
UPRIGHT = $(OBJDIR)/$(PREFIX)-thin.ttf $(OBJDIR)/$(PREFIX)-extralight.ttf $(OBJDIR)/$(PREFIX)-light.ttf $(OBJDIR)/$(PREFIX)-regular.ttf $(OBJDIR)/$(PREFIX)-medium.ttf $(OBJDIR)/$(PREFIX)-bold.ttf $(OBJDIR)/$(PREFIX)-heavy.ttf
|
||||
ITALIC = $(OBJDIR)/$(PREFIX)-thinitalic.ttf $(OBJDIR)/$(PREFIX)-extralightitalic.ttf $(OBJDIR)/$(PREFIX)-lightitalic.ttf $(OBJDIR)/$(PREFIX)-italic.ttf $(OBJDIR)/$(PREFIX)-mediumitalic.ttf $(OBJDIR)/$(PREFIX)-bolditalic.ttf $(OBJDIR)/$(PREFIX)-heavyitalic.ttf
|
||||
EXTUPRG =
|
||||
EXTITAL =
|
||||
OUTPUTS = $(UPRIGHT) $(ITALIC)
|
||||
TARGETS = $(UPRIGHT) $(ITALIC) $(EXTUPRG) $(EXTITAL)
|
||||
OBLIQUE = $(OBJDIR)/$(PREFIX)-thinoblique.ttf $(OBJDIR)/$(PREFIX)-extralightoblique.ttf $(OBJDIR)/$(PREFIX)-lightoblique.ttf $(OBJDIR)/$(PREFIX)-oblique.ttf $(OBJDIR)/$(PREFIX)-mediumoblique.ttf $(OBJDIR)/$(PREFIX)-boldoblique.ttf $(OBJDIR)/$(PREFIX)-heavyoblique.ttf
|
||||
TARGETS = $(UPRIGHT) $(ITALIC) $(OBLIQUE)
|
||||
MAPS = $(subst .ttf,.charmap,$(TARGETS))
|
||||
|
||||
|
||||
|
|
@ -32,57 +30,66 @@ FDTS = $(subst .ttf,.fdt,$(subst $(OBJDIR)/,$(OBJDIR)/.pass0-,$(TARGETS)))
|
|||
SVG0 = $(subst .ttf,.svg,$(subst $(OBJDIR)/,$(OBJDIR)/.pass0-,$(TARGETS)))
|
||||
|
||||
ABFEAT = $(subst .ttf,.ab.fea,$(subst $(OBJDIR)/,$(OBJDIR)/.pass0-,$(TARGETS)))
|
||||
FEATURE = $(subst .ttf,.fea,$(subst $(OBJDIR)/,$(OBJDIR)/.pass0-,$(UPRIGHT) $(EXTUPRG)))
|
||||
FEATITA = $(subst .ttf,.fea,$(subst $(OBJDIR)/,$(OBJDIR)/.pass0-,$(ITALIC) $(EXTITAL)))
|
||||
FEATURE = $(subst .ttf,.fea,$(subst $(OBJDIR)/,$(OBJDIR)/.pass0-,$(UPRIGHT) $(OBLIQUE)))
|
||||
FEATITA = $(subst .ttf,.fea,$(subst $(OBJDIR)/,$(OBJDIR)/.pass0-,$(ITALIC)))
|
||||
PASS1 = $(subst $(OBJDIR)/,$(OBJDIR)/.pass0-,$(TARGETS))
|
||||
PASS1 = $(subst $(OBJDIR)/,$(OBJDIR)/.pass1-,$(TARGETS))
|
||||
PASS2 = $(subst $(OBJDIR)/,$(OBJDIR)/.pass2-,$(TARGETS))
|
||||
PASS3 = $(subst $(OBJDIR)/,$(OBJDIR)/.pass3-,$(TARGETS))
|
||||
PASS4 = $(subst $(OBJDIR)/,$(OBJDIR)/.pass4-,$(TARGETS))
|
||||
|
||||
fonts : $(OUTPUTS)
|
||||
fonts : $(TARGETS)
|
||||
|
||||
OUTPUT_FDTS = $(subst .ttf,.fdt,$(subst $(OBJDIR)/,$(OBJDIR)/.pass0-,$(OUTPUTS)))
|
||||
OUTPUT_SVG0 = $(subst .ttf,.svg,$(subst $(OBJDIR)/,$(OBJDIR)/.pass0-,$(OUTPUTS)))
|
||||
|
||||
fdts : $(OUTPUT_FDTS)
|
||||
svgs : $(OUTPUT_SVG0)
|
||||
fdts : $(FDTS)
|
||||
svgs : $(SVG0)
|
||||
|
||||
|
||||
# Pass 0 : file construction
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-thin.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-thin s-upright $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-thinitalic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-thin s-italic $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-extralight.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-extralight s-upright $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-extralightitalic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-extralight s-italic $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-light.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-light s-upright $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-lightitalic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-light s-italic $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-regular.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-book s-upright $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-italic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-book s-italic $(STYLE_ITALIC) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-medium.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-medium s-upright $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-mediumitalic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-medium s-italic $(STYLE_ITALIC) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-bold.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-bold s-upright $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-bolditalic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-bold s-italic $(STYLE_ITALIC) $(STYLE_SUFFIX)
|
||||
#$(OBJDIR)/.pass0-$(PREFIX)-extrabold.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
# $(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-extrabold s-upright $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
#$(OBJDIR)/.pass0-$(PREFIX)-extrabolditalic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
# $(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-extrabold s-italic $(STYLE_ITALIC) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-heavy.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-heavy s-upright $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-thinitalic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-thin s-italic $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-extralightitalic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-extralight s-italic $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-lightitalic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-light s-italic $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-italic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-book s-italic $(STYLE_ITALIC) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-mediumitalic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-medium s-italic $(STYLE_ITALIC) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-bolditalic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-bold s-italic $(STYLE_ITALIC) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-heavyitalic.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-heavy s-italic $(STYLE_ITALIC) $(STYLE_SUFFIX)
|
||||
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-thinoblique.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-thin s-oblique $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-extralightoblique.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-extralight s-oblique $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-lightoblique.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-light s-oblique $(STYLE_UPRIGHT) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-oblique.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-book s-oblique $(STYLE_oblique) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-mediumoblique.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-medium s-oblique $(STYLE_oblique) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-boldoblique.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-bold s-oblique $(STYLE_oblique) $(STYLE_SUFFIX)
|
||||
$(OBJDIR)/.pass0-$(PREFIX)-heavyoblique.fdt : $(SCRIPTS) | $(OBJDIR)
|
||||
$(NODE_FDT) generate -o $@ iosevka $(STYLE_COMMON) w-heavy s-oblique $(STYLE_oblique) $(STYLE_SUFFIX)
|
||||
|
||||
$(SVG0) : $(OBJDIR)/.pass0-%.svg : $(OBJDIR)/.pass0-%.fdt
|
||||
$(NODE) extract --uprightify 1 --svg $@ $<
|
||||
$(ABFEAT) : $(OBJDIR)/.pass0-%.ab.fea : $(OBJDIR)/.pass0-%.fdt
|
||||
|
|
@ -97,7 +104,7 @@ $(FEATITA) : $(OBJDIR)/.pass0-%.fea : $(OBJDIR)/.pass0-%.ab.fea features/common.
|
|||
|
||||
# Pass 1 : Outline cleanup and merge
|
||||
$(PASS1) : $(OBJDIR)/.pass1-%.ttf : pass1-cleanup.py $(OBJDIR)/.pass0-%.svg
|
||||
fontforge -quiet -script $^ $@ $(if $(findstring italic,$@),10,0) $(FAST) $(SUPPRESS_ERRORS)
|
||||
fontforge -quiet -script $^ $@ $(if $(findstring italic,$@),10,$(if $(findstring oblique,$@),10,0)) $(FAST) $(SUPPRESS_ERRORS)
|
||||
$(PASS2) : $(OBJDIR)/.pass2-%.ttf : pass2-smartround.js $(OBJDIR)/.pass1-%.ttf $(OBJDIR)/.pass0-%.fdt
|
||||
$(NODE) $^ -o $@ --upm $(TARGETUPM)
|
||||
$(PASS3) : $(OBJDIR)/.pass3-%.ttf : pass3-features.py $(OBJDIR)/.pass2-%.ttf $(OBJDIR)/.pass0-%.fea
|
||||
|
|
@ -117,12 +124,12 @@ $(OBJDIR) :
|
|||
RELEASEDIR = releases
|
||||
ARCHIVEDIR = release-archives
|
||||
|
||||
RELEASES = $(subst $(OBJDIR)/,$(RELEASEDIR)/,$(OUTPUTS))
|
||||
RELEASES = $(subst $(OBJDIR)/,$(RELEASEDIR)/,$(TARGETS))
|
||||
$(RELEASES) : $(RELEASEDIR)/%.ttf : $(OBJDIR)/%.ttf
|
||||
cp $< $@
|
||||
|
||||
PAGEDIR = pages/assets
|
||||
PAGESTTF = $(subst $(OBJDIR)/,$(PAGEDIR)/,$(OUTPUTS))
|
||||
PAGESTTF = $(subst $(OBJDIR)/,$(PAGEDIR)/,$(TARGETS))
|
||||
$(PAGESTTF) : $(PAGEDIR)/%.ttf : $(OBJDIR)/%.ttf
|
||||
cp $< $@
|
||||
PAGESWOFF = $(subst .ttf,.woff,$(PAGESTTF))
|
||||
|
|
@ -132,9 +139,9 @@ PAGESMAPS = $(subst $(OBJDIR)/,$(PAGEDIR)/,$(MAPS))
|
|||
$(PAGESMAPS) : $(PAGEDIR)/%.charmap : $(OBJDIR)/%.charmap
|
||||
cp $< $@
|
||||
|
||||
$(ARCHIVEDIR)/$(ARCPREFIX)$(ARCPREFIXB)-$(VERSION).tar.bz2 : $(OUTPUTS)
|
||||
$(ARCHIVEDIR)/$(ARCPREFIX)$(ARCPREFIXB)-$(VERSION).tar.bz2 : $(TARGETS)
|
||||
cd $(OBJDIR) && tar -cjvf ../$@ $(subst $(OBJDIR)/,,$^)
|
||||
$(ARCHIVEDIR)/$(ARCPREFIX)$(ARCPREFIXB)-$(VERSION).zip : $(OUTPUTS)
|
||||
$(ARCHIVEDIR)/$(ARCPREFIX)$(ARCPREFIXB)-$(VERSION).zip : $(TARGETS)
|
||||
cd $(OBJDIR) && 7z a -tzip ../$@ $(subst $(OBJDIR)/,,$^)
|
||||
|
||||
archives : $(ARCHIVEDIR)/$(ARCPREFIX)$(ARCPREFIXB)-$(VERSION).tar.bz2 $(ARCHIVEDIR)/$(ARCPREFIX)$(ARCPREFIXB)-$(VERSION).zip
|
||||
|
|
@ -143,13 +150,13 @@ release : $(RELEASES) archives pages
|
|||
|
||||
# testdrive
|
||||
TESTDIR = testdrive/assets
|
||||
TESTTTF = $(subst $(OBJDIR)/,$(TESTDIR)/,$(OUTPUTS))
|
||||
TESTTTF = $(subst $(OBJDIR)/,$(TESTDIR)/,$(TARGETS))
|
||||
$(TESTTTF) : $(TESTDIR)/%.ttf : $(OBJDIR)/%.ttf
|
||||
cp $< $@
|
||||
TESTWOFF = $(subst .ttf,.woff,$(TESTTTF))
|
||||
$(TESTWOFF) : $(TESTDIR)/%.woff : $(TESTDIR)/%.ttf
|
||||
sfnt2woff $<
|
||||
OUTMAPS = $(subst .ttf,.charmap,$(OUTPUTS))
|
||||
OUTMAPS = $(subst .ttf,.charmap,$(TARGETS))
|
||||
TESTMAPS = $(subst $(OBJDIR)/,$(TESTDIR)/,$(OUTMAPS))
|
||||
$(TESTMAPS) : $(TESTDIR)/%.charmap : $(OBJDIR)/%.charmap
|
||||
cp $< $@
|
||||
|
|
|
|||
|
|
@ -192,6 +192,14 @@ jhook = 120
|
|||
[s-italic.adds]
|
||||
style = " Italic"
|
||||
|
||||
[s-oblique]
|
||||
isItalic = false
|
||||
slantAngle = 10
|
||||
jhook = 120
|
||||
|
||||
[s-oblique.adds]
|
||||
style = " Oblique"
|
||||
|
||||
# Slab variant
|
||||
[slab]
|
||||
slab = true
|
||||
|
|
|
|||
|
|
@ -9,6 +9,12 @@
|
|||
font-style: italic;
|
||||
src: url('assets/iosevka-thinitalic.woff') format('woff'), url('assets/iosevka-thinitalic.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-weight: 100;
|
||||
font-style: oblique;
|
||||
src: url('assets/iosevka-thinoblique.woff') format('woff'), url('assets/iosevka-thinoblique.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-weight: 200;
|
||||
|
|
@ -20,6 +26,12 @@
|
|||
font-style: italic;
|
||||
src: url('assets/iosevka-extralightitalic.woff') format('woff'), url('assets/iosevka-extralightitalic.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-weight: 200;
|
||||
font-style: oblique;
|
||||
src: url('assets/iosevka-extralightoblique.woff') format('woff'), url('assets/iosevka-extralightoblique.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-weight: 300;
|
||||
|
|
@ -31,6 +43,12 @@
|
|||
font-style: italic;
|
||||
src: url('assets/iosevka-lightitalic.woff') format('woff'), url('assets/iosevka-lightitalic.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-weight: 300;
|
||||
font-style: oblique;
|
||||
src: url('assets/iosevka-lightoblique.woff') format('woff'), url('assets/iosevka-lightoblique.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
src: url('assets/iosevka-regular.woff') format('woff'), url('assets/iosevka-regular.ttf') format('truetype');
|
||||
|
|
@ -40,6 +58,11 @@
|
|||
font-style: italic;
|
||||
src: url('assets/iosevka-italic.woff') format('woff'), url('assets/iosevka-italic.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-style: oblique;
|
||||
src: url('assets/iosevka-oblique.woff') format('woff'), url('assets/iosevka-oblique.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-weight: 500;
|
||||
|
|
@ -51,6 +74,12 @@
|
|||
font-weight: 500;
|
||||
src: url('assets/iosevka-mediumitalic.woff') format('woff'), url('assets/iosevka-mediumitalic.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-style: oblique;
|
||||
font-weight: 500;
|
||||
src: url('assets/iosevka-mediumoblique.woff') format('woff'), url('assets/iosevka-mediumoblique.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-weight: 700;
|
||||
|
|
@ -62,19 +91,12 @@
|
|||
font-weight: 700;
|
||||
src: url('assets/iosevka-bolditalic.woff') format('woff'), url('assets/iosevka-bolditalic.ttf') format('truetype');
|
||||
}
|
||||
/*
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-weight: 800;
|
||||
src: url('assets/iosevka-extrabold.woff') format('woff'), url('assets/iosevka-extrabold.ttf') format('truetype');
|
||||
font-style: oblique;
|
||||
font-weight: 700;
|
||||
src: url('assets/iosevka-boldoblique.woff') format('woff'), url('assets/iosevka-boldoblique.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-style: italic;
|
||||
font-weight: 800;
|
||||
src: url('assets/iosevka-extrabolditalic.woff') format('woff'), url('assets/iosevka-extrabolditalic.ttf') format('truetype');
|
||||
}
|
||||
*/
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-weight: 900;
|
||||
|
|
@ -86,6 +108,12 @@
|
|||
font-weight: 900;
|
||||
src: url('assets/iosevka-heavyitalic.woff') format('woff'), url('assets/iosevka-heavyitalic.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaWEB;
|
||||
font-style: oblique;
|
||||
font-weight: 900;
|
||||
src: url('assets/iosevka-heavyoblique.woff') format('woff'), url('assets/iosevka-heavyoblique.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-weight: 100;
|
||||
|
|
@ -97,6 +125,12 @@
|
|||
font-style: italic;
|
||||
src: url('assets/iosevka-slab-thinitalic.woff') format('woff'), url('assets/iosevka-slab-thinitalic.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-weight: 100;
|
||||
font-style: oblique;
|
||||
src: url('assets/iosevka-slab-thinoblique.woff') format('woff'), url('assets/iosevka-slab-thinoblique.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-weight: 200;
|
||||
|
|
@ -108,6 +142,12 @@
|
|||
font-style: italic;
|
||||
src: url('assets/iosevka-slab-extralightitalic.woff') format('woff'), url('assets/iosevka-slab-extralightitalic.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-weight: 200;
|
||||
font-style: oblique;
|
||||
src: url('assets/iosevka-slab-extralightoblique.woff') format('woff'), url('assets/iosevka-slab-extralightoblique.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-weight: 300;
|
||||
|
|
@ -119,6 +159,12 @@
|
|||
font-style: italic;
|
||||
src: url('assets/iosevka-slab-lightitalic.woff') format('woff'), url('assets/iosevka-slab-lightitalic.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-weight: 300;
|
||||
font-style: oblique;
|
||||
src: url('assets/iosevka-slab-lightoblique.woff') format('woff'), url('assets/iosevka-slab-lightoblique.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
src: url('assets/iosevka-slab-regular.woff') format('woff'), url('assets/iosevka-slab-regular.ttf') format('truetype');
|
||||
|
|
@ -128,6 +174,11 @@
|
|||
font-style: italic;
|
||||
src: url('assets/iosevka-slab-italic.woff') format('woff'), url('assets/iosevka-slab-italic.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-style: oblique;
|
||||
src: url('assets/iosevka-slab-oblique.woff') format('woff'), url('assets/iosevka-slab-oblique.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-weight: 500;
|
||||
|
|
@ -139,32 +190,29 @@
|
|||
font-weight: 500;
|
||||
src: url('assets/iosevka-slab-mediumitalic.woff') format('woff'), url('assets/iosevka-slab-mediumitalic.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-style: oblique;
|
||||
font-weight: 500;
|
||||
src: url('assets/iosevka-slab-mediumoblique.woff') format('woff'), url('assets/iosevka-slab-mediumoblique.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-weight: 700;
|
||||
src: url('assets/iosevka-slab-bold.woff') format('woff'), url('assets/iosevka-slab-bold.ttf') format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
src: url('assets/iosevka-slab-bolditalic.woff') format('woff'), url('assets/iosevka-slab-bolditalic.ttf') format('truetype');
|
||||
}
|
||||
/*
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-weight: 800;
|
||||
src: url('assets/iosevka-slab-extrabold.woff') format('woff'), url('assets/iosevka-slab-extrabold.ttf') format('truetype');
|
||||
font-style: oblique;
|
||||
font-weight: 700;
|
||||
src: url('assets/iosevka-slab-boldoblique.woff') format('woff'), url('assets/iosevka-slab-boldoblique.ttf') format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-style: italic;
|
||||
font-weight: 800;
|
||||
src: url('assets/iosevka-slab-extrabolditalic.woff') format('woff'), url('assets/iosevka-slab-extrabolditalic.ttf') format('truetype');
|
||||
}
|
||||
*/
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-weight: 900;
|
||||
|
|
@ -176,6 +224,12 @@
|
|||
font-weight: 900;
|
||||
src: url('assets/iosevka-slab-heavyitalic.woff') format('woff'), url('assets/iosevka-slab-heavyitalic.ttf') format('truetype');
|
||||
}
|
||||
@font-face {
|
||||
font-family: IosevkaSlabWEB;
|
||||
font-style: oblique;
|
||||
font-weight: 900;
|
||||
src: url('assets/iosevka-slab-heavyoblique.woff') format('woff'), url('assets/iosevka-slab-heavyoblique.ttf') format('truetype');
|
||||
}
|
||||
|
||||
.thin { font-weight: 100 }
|
||||
.extralight { font-weight: 200 }
|
||||
|
|
@ -185,4 +239,5 @@
|
|||
.extrabold { font-weight: 800 }
|
||||
.heavy { font-weight: 900 }
|
||||
.italic { font-style: italic }
|
||||
.oblique { font-style: oblique }
|
||||
.slab { font-family: "IosevkaSlabWEB", monospace }
|
||||
|
|
@ -130,24 +130,32 @@
|
|||
right: 0;
|
||||
top: 4rem;
|
||||
background: #ddd;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
#picker:hover .menu{
|
||||
display: block;
|
||||
}
|
||||
#picker:hover .menu .group {
|
||||
#picker .menu .group {
|
||||
display: flex;
|
||||
}
|
||||
#picker:hover .menu .group a {
|
||||
#picker .menu .group a {
|
||||
display: block;
|
||||
padding: 0.5rem;
|
||||
flex: 1;
|
||||
min-width: 10rem;
|
||||
background: #eee;
|
||||
text-shadow: none;
|
||||
font-size: 0.8em;
|
||||
font-size: 1rem;
|
||||
}
|
||||
#picker:hover .menu .group a:hover {
|
||||
#picker .menu .group a.italic, #picker .menu .group a.oblique {
|
||||
flex: 2
|
||||
}
|
||||
#picker .menu .group a.slab {
|
||||
flex: 5
|
||||
}
|
||||
#picker .menu .group a.slab.italic, #picker .menu .group a.slab.oblique {
|
||||
flex: 7
|
||||
}
|
||||
#picker .menu .group a:hover {
|
||||
background: #ddd;
|
||||
}
|
||||
#picker .title {
|
||||
|
|
@ -181,7 +189,7 @@
|
|||
</html>
|
||||
<body>
|
||||
<div id="picker">
|
||||
<span class="title pp {{current.cls}}">{{current.display}} Specimen<span class="icon icon-menu"></span></span>
|
||||
<span class="title pp {{current.cls}}">Iosevka {{current.display}} Specimen<span class="icon icon-menu"></span></span>
|
||||
<div class="menu">
|
||||
<div class="group" v-for="group in fonts">
|
||||
<a href="#" v-for="item in group" v-on:click.prevent="choose(item)" class="pp {{item.cls}} {{item === current ? 'active' : ''}}">{{item.display}}</a>
|
||||
|
|
@ -209,20 +217,34 @@
|
|||
}
|
||||
var BLOCKSIZE = 16 * 4;
|
||||
var fonts = [
|
||||
[ {name: 'iosevka-thin', cls: 'thin', display: 'Iosevka Thin'}, {name: 'iosevka-slab-thin', cls: 'slab thin', display: 'Iosevka Slab Thin'},
|
||||
{name: 'iosevka-thinitalic', cls:'thin italic', display: 'Iosevka Thin Italic'}, {name: 'iosevka-slab-thinitalic', cls:'slab thin italic', display: 'Iosevka Slab Thin Italic'} ],
|
||||
[ {name: 'iosevka-extralight', cls: 'extralight', display: 'Iosevka Extralight'}, {name: 'iosevka-slab-extralight', cls: 'slab extralight', display: 'Iosevka Slab Extralight'},
|
||||
{name: 'iosevka-extralightitalic', cls:'extralight italic', display: 'Iosevka Extralight Italic'}, {name: 'iosevka-slab-extralightitalic', cls:'slab extralight italic', display: 'Iosevka Slab Extralight Italic'} ],
|
||||
[ {name: 'iosevka-light', cls: 'light', display: 'Iosevka Light'}, {name: 'iosevka-slab-light', cls: 'slab light', display: 'Iosevka Slab Light'},
|
||||
{name: 'iosevka-lightitalic', cls:'light italic', display: 'Iosevka Light Italic'}, {name: 'iosevka-slab-lightitalic', cls:'slab light italic', display: 'Iosevka Slab Light Italic'} ],
|
||||
[ {name: 'iosevka-regular', cls: '', display: 'Iosevka'}, {name: 'iosevka-slab-regular', cls: 'slab', display: 'Iosevka Slab'},
|
||||
{name: 'iosevka-italic', cls:'italic', display: 'Iosevka Italic'}, {name: 'iosevka-slab-italic', cls:'slab italic', display: 'Iosevka Slab Italic'} ],
|
||||
[ {name: 'iosevka-medium', cls: 'medium', display: 'Iosevka Medium'}, {name: 'iosevka-slab-medium', cls: 'slab medium', display: 'Iosevka Slab Medium'},
|
||||
{name: 'iosevkamediumitalic', cls:'medium italic', display: 'Iosevka Medium Italic'}, {name: 'iosevka-slab-mediumitalic', cls:'slab medium italic', display: 'Iosevka Slab Medium Italic'} ],
|
||||
[ {name: 'iosevka-bold', cls: 'bold', display: 'Iosevka Bold'}, {name: 'iosevka-slab-bold', cls: 'slab bold', display: 'Iosevka Slab Bold'},
|
||||
{name: 'iosevka-bolditalic', cls:'bold italic', display: 'Iosevka Bold Italic'}, {name: 'iosevka-slab-bolditalic', cls:'slab bold italic', display: 'Iosevka Slab Bold Italic'} ],
|
||||
[ {name: 'iosevka-heavy', cls: 'heavy', display: 'Iosevka Heavy'}, {name: 'iosevka-slab-heavy', cls: 'slab heavy', display: 'Iosevka Slab Heavy'},
|
||||
{name: 'iosevka-heavyitalic', cls:'heavy italic', display: 'Iosevka Heavy Italic'}, {name: 'iosevka-slab-heavyitalic', cls:'slab heavy italic', display: 'Iosevka Slab Heavy Italic'} ]
|
||||
[ {name: 'iosevka-thin', cls: 'thin', display: 'Thin'}, {name: 'iosevka-slab-thin', cls: 'slab thin', display: 'Slab Thin'},
|
||||
{name: 'iosevka-thinitalic', cls:'thin italic', display: 'Thin Italic'}, {name: 'iosevka-slab-thinitalic', cls:'slab thin italic', display: 'Slab Thin Italic'},
|
||||
{name: 'iosevka-thinoblique', cls:'thin oblique', display: 'Thin Oblique'}, {name: 'iosevka-slab-thinoblique', cls:'slab thin oblique', display: 'Slab Thin Oblique'}
|
||||
],
|
||||
[ {name: 'iosevka-extralight', cls: 'extralight', display: 'Extralight'}, {name: 'iosevka-slab-extralight', cls: 'slab extralight', display: 'Slab Extralight'},
|
||||
{name: 'iosevka-extralightitalic', cls:'extralight italic', display: 'Extralight Italic'}, {name: 'iosevka-slab-extralightitalic', cls:'slab extralight italic', display: 'Slab Extralight Italic'},
|
||||
{name: 'iosevka-extralightoblique', cls:'extralight oblique', display: 'Extralight Oblique'}, {name: 'iosevka-slab-extralightoblique', cls:'slab extralight oblique', display: 'Slab Extralight Oblique'}
|
||||
],
|
||||
[ {name: 'iosevka-light', cls: 'light', display: 'Light'}, {name: 'iosevka-slab-light', cls: 'slab light', display: 'Slab Light'},
|
||||
{name: 'iosevka-lightitalic', cls:'light italic', display: 'Light Italic'}, {name: 'iosevka-slab-lightitalic', cls:'slab light italic', display: 'Slab Light Italic'},
|
||||
{name: 'iosevka-lightoblique', cls:'light oblique', display: 'Light Oblique'}, {name: 'iosevka-slab-lightoblique', cls:'slab light oblique', display: 'Slab Light Oblique'}
|
||||
],
|
||||
[ {name: 'iosevka-regular', cls: '', display: 'Regular'}, {name: 'iosevka-slab-regular', cls: 'slab', display: 'Slab'},
|
||||
{name: 'iosevka-italic', cls:'italic', display: 'Italic'}, {name: 'iosevka-slab-italic', cls:'slab italic', display: 'Slab Italic'},
|
||||
{name: 'iosevka-oblique', cls:'oblique', display: 'Oblique'}, {name: 'iosevka-slab-oblique', cls:'slab oblique', display: 'Slab Oblique'}
|
||||
],
|
||||
[ {name: 'iosevka-medium', cls: 'medium', display: 'Medium'}, {name: 'iosevka-slab-medium', cls: 'slab medium', display: 'Slab Medium'},
|
||||
{name: 'iosevkamediumitalic', cls:'medium italic', display: 'Medium Italic'}, {name: 'iosevka-slab-mediumitalic', cls:'slab medium italic', display: 'Slab Medium Italic'},
|
||||
{name: 'iosevkamediumoblique', cls:'medium oblique', display: 'Medium Oblique'}, {name: 'iosevka-slab-mediumoblique', cls:'slab medium oblique', display: 'Slab Medium Oblique'}
|
||||
],
|
||||
[ {name: 'iosevka-bold', cls: 'bold', display: 'Bold'}, {name: 'iosevka-slab-bold', cls: 'slab bold', display: 'Slab Bold'},
|
||||
{name: 'iosevka-bolditalic', cls:'bold italic', display: 'Bold Italic'}, {name: 'iosevka-slab-bolditalic', cls:'slab bold italic', display: 'Slab Bold Italic'},
|
||||
{name: 'iosevka-boldoblique', cls:'bold oblique', display: 'Bold Oblique'}, {name: 'iosevka-slab-boldoblique', cls:'slab bold oblique', display: 'Slab Bold Oblique'}
|
||||
],
|
||||
[ {name: 'iosevka-heavy', cls: 'heavy', display: 'Heavy'}, {name: 'iosevka-slab-heavy', cls: 'slab heavy', display: 'Slab Heavy'},
|
||||
{name: 'iosevka-heavyitalic', cls:'heavy italic', display: 'Heavy Italic'}, {name: 'iosevka-slab-heavyitalic', cls:'slab heavy italic', display: 'Slab Heavy Italic'},
|
||||
{name: 'iosevka-heavyoblique', cls:'heavy oblique', display: 'Heavy Oblique'}, {name: 'iosevka-slab-heavyoblique', cls:'slab heavy oblique', display: 'Slab Heavy Oblique'}
|
||||
]
|
||||
];
|
||||
var REGULAR = 3;
|
||||
var lipsums = ['Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur semper ipsum quam, at molestie libero euismod vitae. Etiam vehicula felis mi, et ultricies libero consequat at. Donec consequat, nunc id elementum tempor, lectus orci vulputate leo, eget lobortis lectus nulla sed orci. Donec in dolor non orci aliquet gravida. Nulla volutpat magna et nulla pretium, quis consequat nibh euismod. Suspendisse eget metus enim. Fusce vulputate scelerisque eros et consequat. Quisque dapibus accumsan augue, et semper lectus vehicula sit amet. Ut ornare venenatis tortor, non gravida tellus mattis interdum. In hac habitasse platea dictumst. Donec interdum commodo ex eu tincidunt. Curabitur non fermentum enim. Proin luctus orci ut commodo auctor. Pellentesque accumsan id sem eu semper. Sed non pharetra nibh. Vivamus mattis luctus arcu, a rutrum dui venenatis sit amet. aja ojo ojoined',
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue