Negative slant angle changes to website
This commit is contained in:
Rasmus Andersson
parent
862cd438ed
commit
164e53bb58
5 changed files with 250 additions and 127 deletions
|
|
@ -262,8 +262,8 @@ b \t \u1d47 \t U+1D47 \t | b \t
|
|||
c \t \u1d9c \t U+1D9C \t | c \t
|
||||
d \t \u1d48 \t U+1D48 \t | d \t
|
||||
e \t \u1d49 \t U+1D49 \t | e \t \u2091 \t U+2091
|
||||
f \t \u1da0 \t U+1DA0 \t | f \t
|
||||
g \t \u1d4d \t U+1D4D \t | g \t
|
||||
f \t \u1da0 \t U+1DA0 \t | f \t
|
||||
g \t \u1d4d \t U+1D4D \t | g \t
|
||||
h \t \u02b0 \t U+02B0 \t | h \t \u2095 \t U+2095
|
||||
i \t \u1da6 \t U+1DA6 \t | i \t \u1D62 \t U+1D62
|
||||
j \t \u02b2 \t U+02B2 \t | j \t \u2C7C \t U+2C7C
|
||||
|
|
@ -273,16 +273,16 @@ m \t \u1d50 \t U+1D50 \t | m \t \u2098 \t U+2098
|
|||
n \t \u207f \t U+207F \t | n \t \u2099 \t U+2099
|
||||
o \t \u1d52 \t U+1D52 \t | o \t \u2092 \t U+2092
|
||||
p \t \u1d56 \t U+1D56 \t | p \t \u209A \t U+209A
|
||||
q \t \u146b \t U+146B \t | q \t
|
||||
q \t \u146b \t U+146B \t | q \t
|
||||
r \t \u02b3 \t U+02B3 \t | r \t \u1D63 \t U+1D63
|
||||
s \t \u02e2 \t U+02E2 \t | s \t \u209B \t U+209B
|
||||
t \t \u1d57 \t U+1D57 \t | t \t \u209C \t U+209C
|
||||
u \t \u1d58 \t U+1D58 \t | u \t \u1D64 \t U+1D64
|
||||
v \t \u1d5b \t U+1D5B \t | v \t \u1D65 \t U+1D65
|
||||
w \t \u02b7 \t U+02B7 \t | w \t
|
||||
w \t \u02b7 \t U+02B7 \t | w \t
|
||||
x \t \u02e3 \t U+02E3 \t | x \t \u2093 \t x \t U+2093
|
||||
y \t \u02b8 \t U+02B8 \t | y \t
|
||||
z \t \u1dbb \t U+1DBB \t | z \t
|
||||
y \t \u02b8 \t U+02B8 \t | y \t
|
||||
z \t \u1dbb \t U+1DBB \t | z \t
|
||||
`)
|
||||
|
||||
|
||||
|
|
@ -332,16 +332,16 @@ AO AU AT AY BT BY CT ET Ec
|
|||
",x," ',x,' ‘,x,’ “,x,” x,‛ x,‟
|
||||
L" L' L’ L” L‛ L‟
|
||||
aufkauf aufhalt aufbleib
|
||||
ver/fl ixt auflassen
|
||||
ver/fl ixt auflassen
|
||||
ho/f_f e auffassen
|
||||
/fi le aufißt raufjagen fıne
|
||||
auf/fi nden Tief/fl ieger
|
||||
Sto/f_f los Mu/f_f on Sto/f_f igel O/f_f zier
|
||||
Ra/f_f band Tu/f_f höhle Su/f_f kopp
|
||||
Ra/f_f band Tu/f_f höhle Su/f_f kopp
|
||||
führen fördern fähre
|
||||
wegjagen Bargfeld
|
||||
kyrie afro arte axe luvwärts
|
||||
Gevatter wann
|
||||
Gevatter wann
|
||||
ever gewettet severe
|
||||
davon gewonnen down
|
||||
wichtig recken
|
||||
|
|
@ -411,7 +411,7 @@ nun (...) und ([...] sein
|
|||
«sie». «das», «an»; «ich»:
|
||||
»sie.« »das,« »an!« »ich?«
|
||||
«sie.» «das,» «an!» «ich?»
|
||||
›sie‹. ›da‹, ›an‹; ›ich‹:
|
||||
›sie‹. ›da‹, ›an‹; ›ich‹:
|
||||
‹sie›. ‹das›, ‹an›; ‹ich›:
|
||||
›sie.‹ ›das,‹ ›an!‹ ›ich?‹
|
||||
‹sie.› ‹das,› ‹an!› ‹ich?›
|
||||
|
|
@ -427,7 +427,7 @@ auf//fall den//im den//ärger
|
|||
da//leider auf//aber I//I
|
||||
etwa 50% haben 37° im
|
||||
£50 und ¥20 sind $30 und €60
|
||||
den §235 sowie #35
|
||||
den §235 sowie #35
|
||||
4mal Seite 3f und 12/f_f .
|
||||
Der §45a in den 20ern
|
||||
von 18:30 bis 20:15 Uhr
|
||||
|
|
@ -678,7 +678,7 @@ function getGlyphInfo(cb) {
|
|||
fetch('glyphinfo.json').then(r => r.json()).then(glyphinfo => {
|
||||
console.log('loaded glyphinfo.json')
|
||||
// { "glyphs": [
|
||||
// [name :string, isEmpty: 1|0, unicode? :string|null,
|
||||
// [name :string, isEmpty: 1|0, unicode? :string|null,
|
||||
// unicodeName? :string, color? :string|null],
|
||||
// ["A", 0, 65, "LATIN CAPITAL LETTER A", "#dbeaf7"],
|
||||
// ...
|
||||
|
|
@ -866,7 +866,7 @@ samples.set('Word mix (combo pairs)', {
|
|||
return '<em>loading words...</em>'
|
||||
}
|
||||
|
||||
// TODO: randomize order, or maybe better to zip on
|
||||
// TODO: randomize order, or maybe better to zip on
|
||||
// let combs1 = combs.filter(c => c.indexOf(ch) != -1)
|
||||
// or sometihng like that
|
||||
|
||||
|
|
@ -1581,7 +1581,7 @@ document.head.appendChild(fontCSS)
|
|||
<box contenteditable spellcheck="false" class="primaryFont positive"><span>Rectangle</span></box>
|
||||
<box contenteditable spellcheck="false" class="primaryFont positive tight"><span>Rectangle</span></box>
|
||||
<box contenteditable spellcheck="false" class="primaryFont centered positive"><span>Rectangle</span></box>
|
||||
|
||||
|
||||
<sep></sep>
|
||||
|
||||
<box contenteditable spellcheck="false" class="secondaryFont showOnlyWithSecondarySample"><span>Rectangle</span></box>
|
||||
|
|
@ -2051,8 +2051,8 @@ function main() {
|
|||
})
|
||||
|
||||
let varState = {
|
||||
weight: 400, // 400-900
|
||||
slant: 0, // 0-10
|
||||
weight: 400, // 400..900
|
||||
slant: 0, // 0..-10
|
||||
}
|
||||
|
||||
function updateVarFont() {
|
||||
|
|
@ -2067,7 +2067,7 @@ function main() {
|
|||
varSlantSettingValueImpl = false
|
||||
setCSSProp(
|
||||
"font-variation-settings",
|
||||
`"wght" ${varState.weight}, "slnt" ${varState.slant}`
|
||||
`"wght" ${varState.weight}, "slnt" ${-varState.slant}`
|
||||
)
|
||||
} else {
|
||||
setCSSProp("font-variation-settings", null)
|
||||
|
|
@ -2200,7 +2200,7 @@ function main() {
|
|||
ev.preventDefault()
|
||||
}, {passive:false,capture:true})
|
||||
|
||||
|
||||
|
||||
vars.bind('lineHeight', lineHeightInput, (e, v) => {
|
||||
setCSSProp('line-height', v ? v + 'px' : null)
|
||||
}, (e, prevValue, ev) => {
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@ body {
|
|||
padding: 40px 40px 40px 35px;
|
||||
font-size: var(--size);
|
||||
letter-spacing: -0.03em;
|
||||
font-variation-settings: 'wght' var(--weight), 'slnt' var(--slant);
|
||||
font-variation-settings: 'wght' var(--weight), 'slnt' calc(-1 * var(--slant));
|
||||
}
|
||||
|
||||
@supports (font-variation-settings: normal) {
|
||||
|
|
@ -84,7 +84,7 @@ label {
|
|||
</select>
|
||||
</div>
|
||||
<div class="sample" contenteditable>
|
||||
Inter 3.0<br>
|
||||
Inter Typeface Family<br>
|
||||
Variable weight axis<br>
|
||||
Variable slant/oblique axis<br>
|
||||
ABCDEFGHIJKLMNOPQRSTUVWXYZ<br>
|
||||
|
|
|
|||
Reference in a new issue