diff options
Diffstat (limited to 'docs/lab')
| -rw-r--r-- | docs/lab/font-files.js | 106 | ||||
| -rw-r--r-- | docs/lab/glyphinfo.json | 9 | ||||
| -rw-r--r-- | docs/lab/index.html | 168 | ||||
| -rw-r--r-- | docs/lab/lab.css | 3 |
4 files changed, 85 insertions, 201 deletions
diff --git a/docs/lab/font-files.js b/docs/lab/font-files.js index 897a2f495..a7a676457 100644 --- a/docs/lab/font-files.js +++ b/docs/lab/font-files.js @@ -1,11 +1,6 @@ -var fontFamilyName, - fontFamilyNameHinted, - fontFamilyNameVar, - fontFamilyNameVarHinted, - fontFamilyNameDisplay, - fontFamilyNameDisplayHinted, - fontFamilyNameDisplayVar, - fontFamilyNameDisplayVarHinted; +var fontFamilyName +var fontFamilyNameDisplay +var fontFamilyNameVar ;(()=>{ let isLocalServer = document.location.protocol == "http:" @@ -19,37 +14,29 @@ var fontFamilyName, ); fontFamilyName = 'Inter-v' + fontVersion - fontFamilyNameHinted = 'Inter-hinted-v' + fontVersion - fontFamilyNameVar = 'Inter-var-v' + fontVersion - fontFamilyNameVarHinted = 'Inter-var-hinted-v' + fontVersion fontFamilyNameDisplay = 'InterDisplay-v' + fontVersion - fontFamilyNameDisplayHinted = 'InterDisplay-hinted-v' + fontVersion - fontFamilyNameDisplayVar = 'InterDisplay-var-v' + fontVersion - fontFamilyNameDisplayVarHinted = 'InterDisplay-var-hinted-v' + fontVersion + fontFamilyNameVar = 'Inter-var-v' + fontVersion let outbuf = [] function w(s) { outbuf.push(s) } - function getStyleName(weight, isItalic) { - let style = "" + function genStaticFontFace(family, cssname, filepath, weight, isItalic) { + let styleName = "" switch (weight) { - case 100: style = "Thin"; break - case 200: style = "ExtraLight"; break - case 300: style = "Light"; break - case 400: style = ""; break - case 500: style = "Medium"; break - case 600: style = "SemiBold"; break - case 700: style = "Bold"; break - case 800: style = "ExtraBold"; break - case 900: style = "Black"; break + case 100: styleName = "Thin"; break + case 200: styleName = "ExtraLight"; break + case 300: styleName = "Light"; break + case 400: styleName = ""; break + case 500: styleName = "Medium"; break + case 600: styleName = "SemiBold"; break + case 700: styleName = "Bold"; break + case 800: styleName = "ExtraBold"; break + case 900: styleName = "Black"; break } - return style + (isItalic ? "Italic" : "") - } - - function genStaticFontFace(family, cssname, filepath, weight, isItalic) { - let styleName = getStyleName(weight, isItalic) if (styleName == "") { styleName = isItalic ? "Italic" : "Regular" + } else if (isItalic) { + styleName += "Italic" } let filename = `${family}-${styleName}` w(`@font-face {`) @@ -69,15 +56,10 @@ var fontFamilyName, w(` url("../font-files/${filename}.woff?${fontVersion}") format("woff2");`) w(`}`) } - - let families = [ - ["Inter", "static", fontFamilyName], - ["Inter", "static-hinted", fontFamilyNameHinted], - ["InterDisplay", "static", fontFamilyNameDisplay], - ["InterDisplay", "static-hinted", fontFamilyNameDisplayHinted], - ] - - for (let [family, filepath, cssname] of families) { + for (let [family, filepath, cssname] of [ + ["Inter", "static", fontFamilyName], + ["InterDisplay", "static", fontFamilyNameDisplay], + ]) { for (let weight of [100,200,300,400,500,600,700,800,900]) { for (let isItalic of [true,false]) { genStaticFontFace(family, cssname, filepath, weight, isItalic) @@ -85,61 +67,27 @@ var fontFamilyName, } } - for (let [family,cssname] of [ - ["Inter",fontFamilyNameVar], - ["InterDisplay",fontFamilyNameDisplayVar], + for (let [srcname,cssname] of [ + ["InterVariable", fontFamilyNameVar], + ["InterVariable-Italic", fontFamilyNameVar], ]) { w(`@font-face { font-family: '${cssname}'; - font-style: oblique 0deg 10deg; + font-style: ${srcname.indexOf("Italic") != -1 ? "italic" : "normal"}; font-weight: 100 900; font-display: block; src:`) if (includeLabLocalFiles) { - w(` url('fonts/var/${family}.var.woff2?${fontVersion}') format("woff2"),`) - } - w(` url('../font-files/${family}.var.woff2?${fontVersion}') format("woff2");`) - w(`}`) - - w(`@font-face { - font-family: '${cssname} safari'; - font-style: oblique 0deg 10deg; - font-display: block; - src:`) - if (includeLabLocalFiles) { - w(` url('fonts/var/${family}.var.woff2?${fontVersion}') format("woff2"),`) + w(` url('fonts/var/${srcname}.woff2?${fontVersion}') format("woff2"),`) } - w(` url('../font-files/${family}.var.woff2?${fontVersion}') format("woff2");`) + w(` url('../font-files/${srcname}.woff2?${fontVersion}') format("woff2");`) w(`}`) } let css = outbuf.join("\n") - // console.log(css) - const fontCSS = document.createElement("style") fontCSS.setAttribute('type', 'text/css') fontCSS.appendChild(document.createTextNode(css)) document.head.appendChild(fontCSS) - - // // update family names to include CSS fallbacks - // [rsms] Disabled to avoid local-font fallback - // fontFamilyName += ", 'Inter'" - // fontFamilyNameHinted += ", 'Inter'" - // fontFamilyNameVar += ", 'Inter var'" - // fontFamilyNameVarHinted += ", 'Inter var'" - })() - -// const fontCSSTemplate = document.querySelector('#font-css') -// const fontCSS = fontCSSTemplate.cloneNode(true) -// fontCSS.innerHTML = fontCSS.innerHTML -// .replace(/Inter-var-VERSION/g, fontFamilyNameVar) -// .replace(/Inter-var-hinted-VERSION/g, fontFamilyNameVarHinted) -// .replace(/Inter-hinted-VERSION/g, fontFamilyNameHinted) -// .replace(/Inter-VERSION/g, fontFamilyName) -// .replace(/(\.woff2?)/g, '$1?r='+fontVersion) -// fontCSS.setAttribute('id', '') -// fontCSS.setAttribute('type', 'text/css') -// document.head.appendChild(fontCSS) - diff --git a/docs/lab/glyphinfo.json b/docs/lab/glyphinfo.json index fa5931218..627d40536 100644 --- a/docs/lab/glyphinfo.json +++ b/docs/lab/glyphinfo.json @@ -1461,7 +1461,6 @@ , ["brokenbar", "brokenbar", 0, "00A6", "BROKEN BAR"] , ["backslash", "backslash", 0, "005C", "REVERSE SOLIDUS"] , ["hyphen", "hyphen", 0, "002D", "HYPHEN-MINUS"] -, ["softhyphen", "softhyphen", 0, "00AD", "SOFT HYPHEN"] , ["endash", "endash", 0, "2013", "EN DASH"] , ["figuredash", "figuredash", 0, "2012", "FIGURE DASH"] , ["emdash", "emdash", 0, "2014", "EM DASH"] @@ -2583,14 +2582,6 @@ , ["uni2053", "uni2053", 0, "2053", "SWUNG DASH"] , ["uni2054", "uni2054", 0, "2054", "INVERTED UNDERTIE"] , ["uni2055", "uni2055", 0, "2055", "FLOWER PUNCTUATION MARK"] -, ["uni2056", "uni2056", 0, "2056", "THREE DOT PUNCTUATION"] -, ["uni2058", "uni2058", 0, "2058", "FOUR DOT PUNCTUATION"] -, ["uni2059", "uni2059", 0, "2059", "FIVE DOT PUNCTUATION"] -, ["uni205a_", "uni205A", 0, "205A", "TWO DOT PUNCTUATION"] -, ["uni205b_", "uni205B", 0, "205B", "FOUR DOT MARK"] -, ["uni205c_", "uni205C", 0, "205C", "DOTTED CROSS"] -, ["uni205d_", "uni205D", 0, "205D", "TRICOLON"] -, ["uni205e_", "uni205E", 0, "205E", "VERTICAL FOUR DOTS"] , ["verticalbardbl", "verticalbardbl", 0, "2016", "DOUBLE VERTICAL LINE"] , ["hyphen____", "hyphen__", 0, "2010", "HYPHEN"] , ["hyphennobreak", "hyphennobreak", 0, "2011", "NON-BREAKING HYPHEN"] diff --git a/docs/lab/index.html b/docs/lab/index.html index 50c4ce8b7..db8376012 100644 --- a/docs/lab/index.html +++ b/docs/lab/index.html @@ -16,19 +16,10 @@ if (window.matchMedia('(prefers-color-scheme: dark)').matches) { } } -// Safari? -(function(u){ if ( - u.indexOf('Safari/') != -1 && - u.indexOf('Chrome/') == -1 && - u.indexOf('Chromium/') == -1 -) { - document.documentElement.classList.add('safari') -} })(navigator.userAgent); - </script> - <script type="text/javascript" src="samples.js?v=3.19"></script> - <script type="text/javascript" src="build-version.js?v=3.19"></script> - <script type="text/javascript" src="font-files.js?v=3.19"></script> + <script type="text/javascript" src="samples.js?v=4.0"></script> + <script type="text/javascript" src="build-version.js?v=4.0"></script> + <script type="text/javascript" src="font-files.js?v=4.0"></script> <link href="lab.css" rel="stylesheet"> <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:400,400i,500,500i,700,700i,900,900i&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese"> </head> @@ -76,12 +67,6 @@ if (window.matchMedia('(prefers-color-scheme: dark)').matches) { <input type="range" value="400" step="1" min="100" max="900" name="varWeight"> </label> - <label class="label-and-value with-slider varfontControl"> - <span title="Slant">slnt:</span> - <input type="number" value="0" step="0.1" min="0" max="10" name="varSlantNum"> - <input type="range" value="0" step="0.01" min="0" max="10" name="varSlant"> - </label> - <label class="label-and-value staticfontControl"> <span>Weight:</span> <select name="weight" style="max-width:100px"> @@ -169,7 +154,7 @@ if (window.matchMedia('(prefers-color-scheme: dark)').matches) { <span>Compare:</span> <select name="compare"> <option value="-" selected>Nothing</option> - <option value="inter-other">Other Inter family</option> + <!-- <option value="inter-other">Other Inter family</option> --> <option value="system">System font</option> </select> </label> @@ -178,44 +163,60 @@ if (window.matchMedia('(prefers-color-scheme: dark)').matches) { <h3>Features</h3> <div class="checkbox-group"> - <!-- case --><label title="Upper case adjustments"><input type="checkbox" class="featopt" name="feat:case"><span>case (Case alternates)</span></label> - <!-- cpsp --><label title='Capital spacing (adds 16 UPM to each sidebearing)'><input type="checkbox" class="featopt" name="feat:cpsp"><span>cpsp (Capital spacing)</span></label> - <!-- dlig --><label title="Discretionary ligatures, e.g. !? -> interrobang"><input type="checkbox" class="featopt" name="feat:dlig"><span>dlig (Discretionary ligatures)</span></label> + <!-- case --><label title="Case-Sensitive Forms"><input type="checkbox" class="featopt" name="feat:case"><span>case (Case-Sensitive Forms)</span></label> + <!-- dlig --><label title="Discretionary ligatures"><input type="checkbox" class="featopt" name="feat:dlig"><span>dlig (Discretionary ligatures)</span></label> <!-- frac --><label title="Contextual automatic fractions"><input type="checkbox" class="featopt" name="feat:frac"><span>frac (Auto fractions)</span></label> <!-- dnom --><label title="Convert all numbers to denominators"><input type="checkbox" class="featopt" name="feat:dnom"><span>dnom (Denominators)</span></label> <!-- numr --><label title="Convert all numbers to numerators"><input type="checkbox" class="featopt" name="feat:numr"><span>numr (Numerators)</span></label> - <!-- salt --><label title='Stylistic Alternates'><input type="checkbox" class="featopt" name="feat:salt"><span>salt (Stylistic Alternates)</span></label> <!-- subs --><label title="Subscript"><input type="checkbox" class="featopt" name="feat:subs"><span>subs (Subscript)</span></label> <!-- sups --><label title="Superscript"><input type="checkbox" class="featopt" name="feat:sups"><span>sups (Superscript)</span></label> <!-- tnum --><label title="Tabular numbers (fixed width)"><input type="checkbox" class="featopt" name="feat:tnum"><span>tnum (Tabular numbers)</span></label> <!-- zero --><label title="Slashed zero"><input type="checkbox" class="featopt" name="feat:zero"><span>zero (Slashed zero)</span></label> - <label title='Stylistic set 1 "Open Digits"'><input type="checkbox" class="featopt" name="feat:ss01"><span>ss01 (Open Digits)</span></label> - <label title='Stylistic set 2 "Disambiguation"'><input type="checkbox" class="featopt" name="feat:ss02"><span>ss02 (Disambiguation)</span></label> - <label title='Stylistic set 3 "Lower case r curves into round neighbors"'><input type="checkbox" class="featopt" name="feat:ss03"><span>ss03 (Curved r)</span></label> - <label title='Stylistic set 4 "Disambiguation without slashed zero"'><input type="checkbox" class="featopt" name="feat:ss04"><span>ss04 (Disambiguation w/o zero)</span></label> - <label title='Character Variant 1 "Alternate one"'><input type="checkbox" class="featopt" name="feat:cv01"><span>cv01 (Alternate one)</span></label> - <label title='Character Variant 2 "Open four"'><input type="checkbox" class="featopt" name="feat:cv02"><span>cv02 (Open four)</span></label> - <label title='Character Variant 3 "Open six"'><input type="checkbox" class="featopt" name="feat:cv03"><span>cv03 (Open six)</span></label> - <label title='Character Variant 4 "Open nine"'><input type="checkbox" class="featopt" name="feat:cv04"><span>cv04 (Open nine)</span></label> - <label title='Character Variant 5 "Lower case L with tail")'><input type="checkbox" class="featopt" name="feat:cv05"><span>cv05 (Lower case L with tail)</span></label> - <label title='Character Variant 6 "Lower case r with curved tail")'><input type="checkbox" class="featopt" name="feat:cv06"><span>cv06 (Curved lower case r)</span></label> - <label title='Character Variant 7 "Alternate German double-s")'><input type="checkbox" class="featopt" name="feat:cv07"><span>cv07 (German double-s)</span></label> - <label title='Character Variant 8 "Upper-case i with serif")'><input type="checkbox" class="featopt" name="feat:cv08"><span>cv08 (Upper-case i with serif)</span></label> - <label title='Character Variant 9 "Flat top three")'><input type="checkbox" class="featopt" name="feat:cv09"><span>cv09 (Flat top three)</span></label> - <label title='Character Variant 10 "Capital G with spur")'><input type="checkbox" class="featopt" name="feat:cv10"><span>cv10 (Capital G with spur)</span></label> - <label title='Character Variant 11 "Single-storey a")'><input type="checkbox" class="featopt" name="feat:cv11"><span>cv11 (Single-storey a)</span></label> </div> <div class="checkbox-group"> - <span>Default-on features:</span> - <label title="Standard ligatures"><input type="checkbox" class="featopt" name="feat:liga=0"> Disable liga (Standard ligatures)</label> - <label title="Contextual alternates"><input type="checkbox" class="featopt" name="feat:calt=0"> Disable calt (Contextual alternates)</label> - <label title="Glyph Composition/Decomposition"><input type="checkbox" class="featopt" name="feat:ccmp=0"> Disable ccmp</label> - <label title="Kerning"><input type="checkbox" class="featopt" name="feat:kern=0"> Disable kern (Kerning)</label> + <span>Stylistic sets:</span> + <!-- ss01 --><label title='Stylistic set 1 "Open Digits"'><input type="checkbox" class="featopt" name="feat:ss01"><span>ss01 (Open Digits)</span></label> + <!-- ss02 --><label title='Stylistic set 2 "Disambiguation (with zero)"'><input type="checkbox" class="featopt" name="feat:ss02"><span>ss02 (Disambiguation w/ zero)</span></label> + <!-- ss03 --><label title='Stylistic set 3 "Round quotes & commas"'><input type="checkbox" class="featopt" name="feat:ss03"><span>ss03 (Round quotes & commas)</span></label> + <!-- ss04 --><label title='Stylistic set 4 "Disambiguation without slashed zero"'><input type="checkbox" class="featopt" name="feat:ss04"><span>ss04 (Disambiguation w/o zero)</span></label> + <!-- ss05 --><label title='Stylistic set 5 "Circled characters"'><input type="checkbox" class="featopt" name="feat:ss05"><span>ss05 (Circled characters)</span></label> + <!-- ss06 --><label title='Stylistic set 6 "Squared characters"'><input type="checkbox" class="featopt" name="feat:ss06"><span>ss06 (Squared characters)</span></label> + <!-- ss07 --><label title='Stylistic set 7 "Square punctuation"'><input type="checkbox" class="featopt" name="feat:ss07"><span>ss07 (Square punctuation)</span></label> + <!-- ss08 --><label title='Stylistic set 8 "Square quotes"'><input type="checkbox" class="featopt" name="feat:ss08"><span>ss08 (Square quotes)</span></label> </div> - <div> - <a href="var.html">Variable test page</a> + <div class="checkbox-group"> + <span>Character variants:</span> + <!-- cv01 --><label title='Character Variant 1 "Alternate one"'><input type="checkbox" class="featopt" name="feat:cv01"><span>cv01 (Alternate one)</span></label> + <!-- cv02 --><label title='Character Variant 2 "Open four"'><input type="checkbox" class="featopt" name="feat:cv02"><span>cv02 (Open four)</span></label> + <!-- cv03 --><label title='Character Variant 3 "Open six"'><input type="checkbox" class="featopt" name="feat:cv03"><span>cv03 (Open six)</span></label> + <!-- cv04 --><label title='Character Variant 4 "Open nine"'><input type="checkbox" class="featopt" name="feat:cv04"><span>cv04 (Open nine)</span></label> + <!-- cv05 --><label title='Character Variant 5 "Lower case L with tail")'><input type="checkbox" class="featopt" name="feat:cv05"><span>cv05 (Lower case L with tail)</span></label> + <!-- cv06 --><label title='Character Variant 6 "Simplified u")'><input type="checkbox" class="featopt" name="feat:cv06"><span>cv06 (Simplified u)</span></label> + <!-- cv07 --><label title='Character Variant 7 "Alternate German double-s")'><input type="checkbox" class="featopt" name="feat:cv07"><span>cv07 (German double-s)</span></label> + <!-- cv08 --><label title='Character Variant 8 "Upper-case i with serif")'><input type="checkbox" class="featopt" name="feat:cv08"><span>cv08 (Upper-case i with serif)</span></label> + <!-- cv09 --><label title='Character Variant 9 "Flat top three")'><input type="checkbox" class="featopt" name="feat:cv09"><span>cv09 (Flat top three)</span></label> + <!-- cv10 --><label title='Character Variant 10 "Capital G with spur")'><input type="checkbox" class="featopt" name="feat:cv10"><span>cv10 (Capital G with spur)</span></label> + <!-- cv11 --><label title='Character Variant 11 "Single-storey a")'><input type="checkbox" class="featopt" name="feat:cv11"><span>cv11 (Single-storey a)</span></label> + <!-- cv12 --><label title='Character Variant 12 "Compact f")'><input type="checkbox" class="featopt" name="feat:cv12"><span>cv12 (Compact f)</span></label> + <!-- cv13 --><label title='Character Variant 13 "Compact t")'><input type="checkbox" class="featopt" name="feat:cv13"><span>cv13 (Compact t)</span></label> + </div> + + <div class="checkbox-group"> + <span>Partial or uncommon:</span> + <!-- cpsp --><label title='Capital spacing (adds 16 UPM to each sidebearing)'><input type="checkbox" class="featopt" name="feat:cpsp"><span>cpsp (Capital spacing)</span></label> + <!-- c2sc --><label title="Small Capitals From Capitals"><input type="checkbox" class="featopt" name="feat:c2sc"><span>c2sc (Small Caps; incomplete)</span></label> + <!-- salt --><label title='Stylistic Alternates'><input type="checkbox" class="featopt" name="feat:salt"><span>salt (Stylistic Alternates)</span></label> + <!-- aalt --><label title='Access All Alternates'><input type="checkbox" class="featopt" name="feat:aalt"><span>aalt (Access All Alternates)</span></label> + </div> + + <div class="checkbox-group"> + <span>Enabled by default:</span> + <!-- calt --><label title="Contextual alternates"><input type="checkbox" class="featopt" name="feat:calt=0"> Disable calt (Contextual alternates)</label> + <!-- ccmp --><label title="Glyph Composition/Decomposition"><input type="checkbox" class="featopt" name="feat:ccmp=0"> Disable ccmp</label> + <!-- locl --><label title='Localized Forms'><input type="checkbox" class="featopt" name="feat:locl=0"><span>Disable locl (Localized Forms)</span></label> + <!-- kern --><label title="Kerning"><input type="checkbox" class="featopt" name="feat:kern=0"> Disable kern (Kerning)</label> </div> </div> @@ -254,16 +255,7 @@ function InterDynamicTracking(fontSize, family /* :"text"|"display" */) { return a + b * Math.pow(Math.E, c * fontSize) } -// provide hinted=1 to use TTF hinted fonts. -// not exposed in UI as it only works when serving the site locally -// with fonts in the build/fonts directory. -const hinted = location.search.indexOf('hinted=1') != -1 -const familyName = hinted ? fontFamilyNameHinted : fontFamilyName; - -if (hinted) { - document.body.classList.add('hinted') -} -document.body.style.fontFamily = familyName +document.body.style.fontFamily = fontFamilyName function parseQueryString(qs) { @@ -838,19 +830,16 @@ function main() { let usingVarFont = false let usingFontFamily = "text" - var varWeightRange, varSlantRange, varOpszRange + var varWeightRange, varOpszRange var varWeightSettingValueImpl = false - var varSlantSettingValueImpl = false var varOpszSettingValueImpl = false function getFontFamily(overrideFamily) { return ( (overrideFamily || usingFontFamily) == "text" ? ( - usingVarFont ? (hinted ? fontFamilyNameVarHinted : fontFamilyNameVar) : - hinted ? fontFamilyNameHinted : fontFamilyName + usingVarFont ? fontFamilyNameVar : fontFamilyName ) : ( - usingVarFont ? (hinted ? fontFamilyNameDisplayVarHinted : fontFamilyNameDisplayVar) : - hinted ? fontFamilyNameDisplayHinted : fontFamilyNameDisplay + usingVarFont ? fontFamilyNameDisplayVar : fontFamilyNameDisplay ) ) } @@ -866,33 +855,18 @@ function main() { var italicVar = vars.bind('italic', (e, on) => { document.body.classList[on ? 'add' : 'remove']('italic') - if (usingVarFont && !varSlantSettingValueImpl) { - if (varSlantRange) { - varSlantRange.setValue(on ? 100 : 0) - } - updateVarFont() - } }) let varState = { weight: 400, // 400..900 - slant: 0, // 0..-10 opsz: 14, // 14..32 } function updateVarFont() { if (usingVarFont) { - varSlantSettingValueImpl = true - if (varState.slant <= 0.1) { - varState.slant = 0 - italicVar.setValue(false) - } else { - italicVar.setValue(true) - } - varSlantSettingValueImpl = false setCSSProp( "font-variation-settings", - `"wght" ${varState.weight}, "slnt" ${-varState.slant}, "opsz" ${varState.opsz}` + `"wght" ${varState.weight}, "opsz" ${varState.opsz}` ) } else { setCSSProp("font-variation-settings", null) @@ -910,10 +884,6 @@ function main() { varWeightRange.setValue(w) } } - // document.body.style.fontFamily = ( - // hinted ? fontFamilyNameVarHinted : - // fontFamilyNameVar - // ) } else { if (!isInitial && varWeightRange) { // copy value of var weight to static weight @@ -922,10 +892,6 @@ function main() { vars.setValue("weight", Math.round(w / 100) * 100) } } - // document.body.style.fontFamily = ( - // hinted ? fontFamilyNameHinted : - // fontFamilyName - // ); } document.body.style.fontFamily = getFontFamily() updateVarFont() @@ -936,11 +902,6 @@ function main() { vars.setValue("wght", v) }) - let varSlantNum = vars.bind('_slnt', '[name="varSlantNum"]', (e, v) => { - if (varSlantRange && !varSlantSettingValueImpl) - vars.setValue("slnt", v) - }) - let varOpszNum = vars.bind('_opsz', '[name="varOpszNum"]', (e, v) => { if (varOpszRange && !varOpszSettingValueImpl) vars.setValue("opsz", v) @@ -964,18 +925,6 @@ function main() { return snapValue(e.valueAsNumber, 100) }) - varSlantRange = vars.bind('slnt', '[name="varSlant"]', (e, v) => { - varState.slant = v - varSlantSettingValueImpl = true - varSlantNum.setValue(v) - varSlantSettingValueImpl = false - updateVarFont() - }, (e, prevValue, ev) => { - if (prevValue === undefined) - return 0 - return snapValue(e.valueAsNumber, 1) - }) - varOpszRange = vars.bind('opsz', '[name="varOpsz"]', (e, v) => { varState.opsz = v varOpszSettingValueImpl = true @@ -1003,12 +952,12 @@ function main() { e.classList.remove(secondarySampleClassNameAddition)) } if (className) { - let explicitFontFamily = null - if (className == "inter-other-font") { - let otherFamily = usingFontFamily == "text" ? "display" : "text" - explicitFontFamily = getFontFamily(otherFamily) - } - secondarySample.style.fontFamily = explicitFontFamily + // let explicitFontFamily = null + // if (className == "inter-other-font") { + // let otherFamily = usingFontFamily == "text" ? "display" : "text" + // explicitFontFamily = getFontFamily(otherFamily) + // } + // secondarySample.style.fontFamily = explicitFontFamily secondarySample.classList.add(className) secondaryFontElements.forEach(e => e.classList.add(className)) } @@ -1029,9 +978,8 @@ function main() { vars.bind('compare', (e, v) => { disableSecondarySample() switch (v) { - // case 'roboto': enableSecondarySample('robotoFont'); break case 'system': enableSecondarySample('systemFont'); break - case 'inter-other': enableSecondarySample('inter-other-font'); break + //case 'inter-other': enableSecondarySample('inter-other-font'); break default: return '-'; } }, e => (e.value && e.value != '-') ? e.value : null) diff --git a/docs/lab/lab.css b/docs/lab/lab.css index b60c688d4..f9c5bb311 100644 --- a/docs/lab/lab.css +++ b/docs/lab/lab.css @@ -134,9 +134,6 @@ body { transition: all 168ms cubic-bezier(0.17, 0.65, 0.48, 1); transition-property: color, background; } -.robotoFont { - font-family: "Roboto", serif; -} .systemFont { font-family: system-ui,-system,-system-ui,-apple-system,sans-serif; } |