diff options
-rw-r--r-- | docs/_data/feature_samples.yml | 126 | ||||
-rw-r--r-- | docs/_includes/ctxedit.html | 7 | ||||
-rw-r--r-- | docs/_includes/preload-font-files.html | 7 | ||||
-rw-r--r-- | docs/_layouts/default.html | 11 | ||||
-rwxr-xr-x | docs/dynmetrics/icons/letter-spacing.svg | 1 | ||||
-rwxr-xr-x | docs/dynmetrics/icons/line-height.svg | 1 | ||||
-rwxr-xr-x | docs/dynmetrics/icons/style.svg | 1 | ||||
-rw-r--r-- | docs/dynmetrics/index.html | 128 | ||||
-rw-r--r-- | docs/glyphs/index.html | 7 | ||||
-rw-r--r-- | docs/index.css | 15 | ||||
-rw-r--r-- | docs/index.html | 274 | ||||
-rw-r--r-- | docs/res/base.css | 227 | ||||
-rw-r--r-- | docs/res/base.js | 2 | ||||
-rw-r--r-- | docs/samples/index.html | 7 |
14 files changed, 505 insertions, 309 deletions
diff --git a/docs/_data/feature_samples.yml b/docs/_data/feature_samples.yml new file mode 100644 index 000000000..b92da1030 --- /dev/null +++ b/docs/_data/feature_samples.yml @@ -0,0 +1,126 @@ +- title: Contextual alternates + tag: calt + description: + This feature is enabled by default and causes certain characters to adjust + themselves or be replaced depending on the surrounding context. + footer: + There are many more contextual alternates. + samples: + - "12›:‹34, FE›—‹X" + - "4›.‹2" + - "›(‹SEMI›)‹PERMANENT" + - "SFO ›->‹ STO" + - "IIA ›—>‹ OGG" + - "ARN ›<-->‹ OGG" + - "M›@‹N m@n" + - "Smile ›:-)‹" + +- title: Tabular numbers + tag: tnum + description: + Fixed-width numbers are useful for tabular data, where comparing + columns across rows is desired. + samples: + - "1234567890" + - "1131711› ‹" + - "0040900› ‹" + - "11:31,711› ‹" + - "00:40.900› ‹" + - "0.45, 0.91, +0.08› ‹" + - "1.00, 9.44, −0.13› ‹" + - "0.00, 1.13, ~7.12› ‹" + +- title: Numerators + tag: numr + samples: + - "Hello ›0123‹" + +- title: Denominators + tag: dnom + samples: + - "Hello ›0123‹" + +- title: Superscript + tag: sups + samples: + - "X›0123 (+)-[=]‹" + - "X›abcdefghijklmnopqrstuvwxyz‹" + +- title: Subscript + tag: subs + samples: + - "H›0123 (+)-[=]‹" + - "X›abcdefghijklmnopqrstuvwxyz‹" + +- title: Fractions + tag: frac + description: + This feature is contextually sensitive and will convert "words" of + numbers separated by forward slash into proper fractions. + This feature is dynamic and allows for any fractions. + Note that the digits used for fractions are custom-made for their + small size, and are even made separately from the slightly larger + Superscript and Subscript numbers. + samples: + - "›1/3‹ ›3/4‹ ›1/5‹ ›1337/5910‹" + +- title: Case alternates + tag: case + description: + Switches out some glyphs to work better with capital letters and numbers. + samples: + - "›(‹Hello›)‹ ›[‹World›]‹ ›{‹9000›}‹" + - "SCHOOL ›@‹ RUN" + - "3 ›+‹ 9 ›=‹ 12 ›*‹ 1" + - "›*+÷±×=≠≈•~<>≤≥‹" + - "›→‹ ›←‹ ›⟶‹ ›⟵‹ ›−‹ ›-‹ ›–‹ ›—‹ ›:‹" + +- title: "Stylistic set 1: Alternate digits" + tag: ss01 + description: + An alternate style of digits. + Note that individual digit styles can be cherry-picked using the cvXX + features. + samples: + - "›1‹2›34‹5›6‹78›9‹0" + - "›13469‹" + +- title: "Stylistic set 2: Disambiguation" + tag: ss02 + description: + Alternate glyph set that increases visual difference between + similar-looking characters. + samples: + - "WP›0‹ACO9XS›I‹1›0‹12O9" + - "›Ill‹ega›l‹" + - "βeta ›ß‹eta Busine›ß‹" + +- title: Discretionary ligatures + tag: dlig + description: + Alternate glyph set that increases visual difference between + similar-looking characters. + samples: + - "›¡¿‹What›?!‹" + - "›¿¡‹What›!?‹" + +- title: Slashed zero + tag: zero + samples: + - "O›0‹123" + +- title: Character variants + tag: cvXX + description: "Allows cherry-picking alternate characters." + samples: + - {feat: cv01, alt: "Alternate one", sample: "1"} + - {feat: cv02, alt: "Open four", sample: "4"} + - {feat: cv03, alt: "Open six", sample: "6"} + - {feat: cv04, alt: "Open nine", sample: "9"} + - {feat: cv05, alt: "Lower case L with tail", sample: "l ł ƚ ɫ ɬ ŀ ĺ ļ ľ ḷ ḹ ḻ ḽ"} + - {feat: cv06, alt: "Lower case R with straight tail", sample: "r ɽ ɍ ɼ ŕ ŗ ř ȑ ȓ ṙ ṛ ṝ ṟ"} + - {feat: cv07, alt: "Alternate German double-s", sample: "ß"} + - {feat: cv08, alt: "Upper-case i with serif", sample: "I Ï Ḯ Ɨ Ḭ Ì Í Î Ĩ Ī Ĭ Į İ Ǐ Ȉ Ȋ Ỉ Ị Ι Ί Ϊ Ἰ Ἱ Ἲ"} + - {feat: cv09, alt: "Flat top three", sample: "3"} + - {feat: cv10, alt: "Capital G with spur", sample: "G Ǥ Ɠ Ĝ Ğ Ġ Ģ Ǧ Ǵ Ḡ"} + diff --git a/docs/_includes/ctxedit.html b/docs/_includes/ctxedit.html index 64dea24e6..791a0739c 100644 --- a/docs/_includes/ctxedit.html +++ b/docs/_includes/ctxedit.html @@ -1,9 +1,8 @@ {% -capture url_root - %}{% if site.safe == false %}/{% else %}/inter/{% endif -%}{% -endcapture %}{% +if site.safe == false %}{% +assign url_root = "/" %}{% else %}{% +assign url_root = "/inter/" %}{% endif %}{% for file in site.static_files %}{% assign _path = file.path | remove_first: "/inter" %}{% diff --git a/docs/_includes/preload-font-files.html b/docs/_includes/preload-font-files.html index f744690f6..f6bf15651 100644 --- a/docs/_includes/preload-font-files.html +++ b/docs/_includes/preload-font-files.html @@ -1,9 +1,8 @@ {% -capture url_root - %}{% if site.safe == false %}/{% else %}/inter/{% endif -%}{% -endcapture %}{% +if site.safe == false %}{% +assign url_root = "/" %}{% else %}{% +assign url_root = "/inter/" %}{% endif %}{% for file in site.static_files %}{% assign _path = file.path | remove_first: "/inter" %}{% diff --git a/docs/_layouts/default.html b/docs/_layouts/default.html index abcb16aa5..c1300b70e 100644 --- a/docs/_layouts/default.html +++ b/docs/_layouts/default.html @@ -2,14 +2,11 @@ assign build_version = site.time | date: "%Y%m%d%H%M%S" %}{% assign description = "Inter is a typeface optimized for computer-user interfaces" %}{% -capture url_root - %}{% if site.safe == false %}/{% else %}/inter/{% endif -%}{% -endcapture %}{% +if site.safe == false %}{% +assign url_root = "/" %}{% else %}{% +assign url_root = "/inter/" %}{% endif %}{% -capture release_version - %}{{ site.data.fontinfo[0].version }}{% -endcapture %}{% +assign release_version = site.data.fontinfo[0].version %}{% capture download_url %}https://github.com/rsms/inter/releases/download/v{{ release_version }}/Inter-{{ release_version }}.zip{% diff --git a/docs/dynmetrics/icons/letter-spacing.svg b/docs/dynmetrics/icons/letter-spacing.svg new file mode 100755 index 000000000..267c0ac62 --- /dev/null +++ b/docs/dynmetrics/icons/letter-spacing.svg @@ -0,0 +1 @@ +<svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.415 12l.822-2.335h3.64L10.698 12h1.108L8.602 3.273h-1.09L4.306 12h1.108zm2.59-7.347h.103l1.436 4.074H6.57l1.436-4.074z" fill="#000"/><path fill-rule="evenodd" clip-rule="evenodd" d="M0 14V2h1v12H0zm15 0V2h1v12h-1z" fill="#000"/></svg>
\ No newline at end of file diff --git a/docs/dynmetrics/icons/line-height.svg b/docs/dynmetrics/icons/line-height.svg new file mode 100755 index 000000000..04c1e66a9 --- /dev/null +++ b/docs/dynmetrics/icons/line-height.svg @@ -0,0 +1 @@ +<svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.297 12l.762-2.14h3.32L10.14 12h1.015L8.22 4h-1l-2.94 8h1.016zm1.066-3l1.324-3.734h.063L9.074 9h-2.71z" fill="#000"/><path fill-rule="evenodd" clip-rule="evenodd" d="M15 2H1V1h14v1zm0 13H1v-1h14v1z" fill="#000"/></svg>
\ No newline at end of file diff --git a/docs/dynmetrics/icons/style.svg b/docs/dynmetrics/icons/style.svg new file mode 100755 index 000000000..0dd668a3d --- /dev/null +++ b/docs/dynmetrics/icons/style.svg @@ -0,0 +1 @@ +<svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M0 13V3h1v10H0zm3 0V3h2v10H3zm4 0V3h3v10H7zm5 0V3h4v10h-4z" fill="#000"/></svg>
\ No newline at end of file diff --git a/docs/dynmetrics/index.html b/docs/dynmetrics/index.html index e43be7c9c..d6cbbc49a 100644 --- a/docs/dynmetrics/index.html +++ b/docs/dynmetrics/index.html @@ -4,10 +4,9 @@ title: Dynamic Metrics --- {% -capture url_root - %}{% if site.safe == false %}/{% else %}/inter/{% endif -%}{% -endcapture %}{% +if site.safe == false %}{% +assign url_root = "/" %}{% else %}{% +assign url_root = "/inter/" %}{% endif %}{% for file in site.static_files %}{% assign _path = file.path | remove_first: "/inter" %}{% @@ -41,13 +40,13 @@ endfor <const>a</const> + <const>b</const> × <const title="Base of natural logarithm; ≈2.718">e</const><sup>(<const>c</const> × <const>z</const>)</sup> </formula> - <formula> + <!--formula> line height = <num data-binding="var-l">1.4</num> × <const>z</const> - </formula> + </formula--> <formula title="Values for Inter"> - <g><const title="Constant a">a</const> = <num data-binding="var-a">-0.02</num></g> - <g><const title="Constant b">b</const> = <num data-binding="var-b">0.205</num></g> - <g><const title="Constant c">c</const> = <num data-binding="var-c">-0.175</num></g> + <g><const title="Constant a">a</const> = <num data-binding="var-a">-0.038</num></g> + <g><const title="Constant b">b</const> = <num data-binding="var-b">0.161</num></g> + <g><const title="Constant c">c</const> = <num data-binding="var-c">-0.12</num></g> <g><const>z</const> = font size</g> </formula> </p> @@ -76,14 +75,9 @@ endfor </div> <div class="sidebar controls"> + <div class="control"> - <label title="Number of ideal matches">ni</label> - <input title="Number of ideal matches" type="number" readonly data-binding="ideal-count"> - <label title="Distance from ideal">di</label> - <input title="Distance from ideal" type="number" class="wide" readonly data-binding="ideal-distance"> - </div> - <div class="control"> - <img title="Style" class="icon" src="../samples/icons/style.svg"> + <img title="Style" class="icon" src="icons/style.svg"> <select data-binding="style"> <option value="thin">Thin (BETA)</option> <option value="thin-italic">Thin Italic (BETA)</option> @@ -107,11 +101,18 @@ endfor </select> </div> <div class="control"> - <img title="Base tracking" class="icon" src="../samples/icons/letter-spacing.svg"> + <img title="Base tracking" class="icon" src="icons/letter-spacing.svg"> <input type="range" min="-0.05" max="0.06" step="0.001" data-binding="base-tracking"> <input type="number" min="-0.15" max="1" step="0.001" data-binding="base-tracking"> </div> + <div class="control"> + <img title="Line height" class="icon" src="icons/line-height.svg"> + <input type="range" min="1" max="2" step="0.01" data-binding="var-l"> + <input type="number" min="1" max="2" step="0.01" data-binding="var-l"> + </div> + <hr> + <div class="control"> <label title="Constant a">a</label> <input type="range" min="-0.05" max="0" step="0.001" data-binding="var-a"> @@ -127,15 +128,20 @@ endfor <input type="range" min="-1" max="0" step="0.01" data-binding="var-c"> <input type="number" min="-1" max="0" step="0.001" data-binding="var-c"> </div> + <hr> + <div class="control"> - <label title="Constant l controls line height">l</label> - <input type="range" min="1" max="2" step="0.1" data-binding="var-l"> - <input type="number" min="1" max="2" step="0.1" data-binding="var-l"> + <label title="Number of ideal matches">ni</label> + <input title="Number of ideal matches" type="number" readonly data-binding="ideal-count"> + <label title="Distance from ideal">di</label> + <input title="Distance from ideal" type="number" class="wide" readonly data-binding="ideal-distance"> </div> + <hr class="without-bottom-margin"> + <canvas class="graphplot">Canvas not Supported</canvas> - + <hr class="when-selection without-top-margin"> <h3 class="when-selection">CSS</h3> <textarea class="when-selection" readonly id="code-output"></textarea> @@ -194,24 +200,65 @@ function parseValues(s) { } setIdealValues({ - 6: 0.021, - 7: 0.017, - 8: 0.013, - 9: 0.01, - 10: 0.007, - 11: 0.005, - 12: 0.002, - 13: 0, - 14: -0.002, - 15: -0.004, - 16: -0.005, - 17: -0.007, - 18: -0.008, - 20: -0.01, - 24: -0.013, - 30: -0.016, - 40: -0.02, - 80: -0.02, + // // 2018 + // 6: 0.021, + // 7: 0.017, + // 8: 0.013, + // 9: 0.01, + // 10: 0.007, + // 11: 0.005, + // 12: 0.002, + // 13: 0, + // 14: -0.002, + // 15: -0.004, + // 16: -0.005, + // 17: -0.007, + // 18: -0.008, + // 20: -0.01, + // 24: -0.013, + // 30: -0.016, + // 40: -0.02, + // 80: -0.02, + + // 2019-02-02 + // 6: 0.066, + // 7: 0.05, + // 8: 0.036, + // 9: 0.025, + // 10: 0.015, + // 11: 0.007, + // 12: 0, + // 13: -0.005, + // 14: -0.01, + // 15: -0.014, + // 16: -0.017, + // 17: -0.02, + // 18: -0.022, + // 20: -0.026, + // 24: -0.03, + // 30: -0.033, + // 40: -0.034, + // 80: -0.034, + + // 2019-02-06 + 6: 0.04, + 7: 0.032, + 8: 0.024, + 9: 0.017, + 10: 0.01, + 11: 0.005, + 12: 0, + 13: -0.004, + 14: -0.008, + 15: -0.011, + 16: -0.014, + 17: -0.017, + 18: -0.019, + 20: -0.023, + 24: -0.029, + 30: -0.034, + 40: -0.037, + 80: -0.038, }) @@ -223,7 +270,8 @@ setIdealValues({ // var a = -0.0149, b = 0.298, c = -0.23; // di=0.000484 on set-2018-02-19 // var a = -0.018, b = 0.21, c = -0.18; // di=0.000532 on set-2018-02-20 // var a = -0.017, b = 0.202, c = -0.175; // 2018-09-28 -var a = -0.02, b = 0.0755, c = -0.102 // 2019-02-02 +// var a = -0.02, b = 0.0755, c = -0.102 // 2019-02-02 +var a = -0.038, b = 0.161, c = -0.12 // 2019-02-06 var l = 1.4 diff --git a/docs/glyphs/index.html b/docs/glyphs/index.html index 7d9fb09eb..438118da1 100644 --- a/docs/glyphs/index.html +++ b/docs/glyphs/index.html @@ -4,10 +4,9 @@ title: Glyphs --- {% -capture url_root - %}{% if site.safe == false %}/{% else %}/inter/{% endif -%}{% -endcapture %}{% +if site.safe == false %}{% +assign url_root = "/" %}{% else %}{% +assign url_root = "/inter/" %}{% endif %}{% for file in site.static_files %}{% assign _path = file.path | remove_first: "/inter" %}{% diff --git a/docs/index.css b/docs/index.css index 274884322..261643d88 100644 --- a/docs/index.css +++ b/docs/index.css @@ -101,9 +101,7 @@ tablex in, tablex to, tablex out { white-space: pre; padding-bottom:0.5em; } -/*tablex to { - width:0; -}*/ + tablex to::after { -moz-font-feature-settings: 'calt' 1, 'case' 1; -ms-font-feature-settings: 'calt' 1, 'case' 1; @@ -297,3 +295,14 @@ tablex out.cv10 { boxes.features box h3 + p { margin-top:0.5em; } + +boxes.features grid .sample { + word-break: break-word; + word-wrap: break-word; +} + +boxes.features grid .sample em { + font-style: inherit; + background: #e4fdef; + color: black; +} diff --git a/docs/index.html b/docs/index.html index fb6e376a7..bd559d96d 100644 --- a/docs/index.html +++ b/docs/index.html @@ -3,11 +3,6 @@ layout: default --- {% -capture url_root - %}{% if site.safe == false %}/{% else %}/inter/{% endif -%}{% -endcapture %}{% - for file in site.static_files %}{% assign _path = file.path | remove_first: "/inter" %}{% if _path == "/index.css" %}{% @@ -69,10 +64,10 @@ html { font-family: 'Inter', sans-serif; } <p> </p> - <h2 id="dynamic-metrics"><a href="{{url_root}}dynmetrics/">Dynamic Metrics</a></h2> + <h2 id="dynamic-metrics"><a href="dynmetrics/">Dynamic Metrics</a></h2> <p class="dynmet-calc"> Size - <input id="dynmet-font-size" type="number" value="12" + <input id="dynmet-font-size" type="number" value="16" ><span title='Display points — "px" in CSS, "pt" on iOS, "sp" on Android, and "pt" (1/72 of an inch) in print'>dp</span> <span class="arrow">=</span> <span title='letter-spacing in CSS; also called "tracking" in some software.'>spacing @@ -83,7 +78,7 @@ html { font-family: 'Inter', sans-serif; } There's of course no absolute right or wrong when it comes to expressing yourself with typography, but Inter <em>Dynamic Metrics</em> provides guidelines for good typography. You simply provide the optical font size, and the tracking and leading is calculated for you to produce the best results. </p> <p> - <a href="{{url_root}}dynmetrics/">Learn more…</a> + <a href="dynmetrics/">Learn more…</a> </p> <p> </p> @@ -175,7 +170,7 @@ html { font-family: 'Inter', sans-serif; } -<div class="row"><div> +<div class="row features"><div> <h2><a id="features" href="#features">Features</a></h2> <p> Inter comes with many OpenType features that can be used to @@ -184,211 +179,82 @@ html { font-family: 'Inter', sans-serif; } alternative variations. </p> <boxes class="features"> + {% for f in site.data.feature_samples %} <box> - <h3>Contextual alternates <q title='OpenType feature ID'>calt</q></h3> - <p> - This feature is enabled by default and causes certain characters to - adjust themselves or be replaced depending on the surrounding context. - </p> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r><in>12<em>:</em>34, FE<em>—</em>X</in><to></to><out>12:34, FE—X</out></r> - <r><in>4<em>.</em>2</in><to></to><out>4.2</out></r> - <r><in><em>(</em>SEMI<em>)</em>PERMANENT</in><to></to><out>(SEMI)PERMANENT</out></r> - <r><in>SFO <em>-></em> STO</in><to></to><out>SFO -> STO</out></r> - <r><in>IIA <em>—></em> OGG</in><to></to><out>IIA —> OGG</out></r> - <r><in>ARN <em><--></em> OGG</in><to></to><out>ARN <--> OGG</out></r> - <r><in>M<em>@</em>N m@n</in><to></to><out>M@N m@n</out></r> - <r><in>Smile <em>:-)</em></in><to></to><out>Smile :-)</out></r> - </t></tablex> - <p> - There are many more contextual alternates. - </p> - </box> - - <box> - <h3>Tabular numbers <q title='OpenType feature ID'>tnum</q></h3> - <p> - Fixed-width numbers are useful for tabular data, where comparing - columns across rows is desired. - </p> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r><in>1234567890</in><to></to><out class="tnum">1234567890</out></r> - <r><in>1131711<em> </em></in><to></to><out class="tnum">1131711<em> </em></out></r> - <r><in>0040900<em> </em></in><to></to><out class="tnum">0040900<em> </em></out></r> - <r><in>11:31,711<em> </em></in><to></to><out class="tnum">11:31,711<em> </em></out></r> - <r><in>00:40.900<em> </em></in><to></to><out class="tnum">00:40.900<em> </em></out></r> - <r><in>0.45, 0.91, +0.08<em> </em></in><to></to><out class="tnum">0.45, 0.91, +0.08<em> </em></out></r> - <r><in>1.00, 9.44, −0.13<em> </em></in><to></to><out class="tnum">1.00, 9.44, −0.13<em> </em></out></r> - <r><in>0.00, 1.13, ~7.12<em> </em></in><to></to><out class="tnum">0.00, 1.13, ~7.12<em> </em></out></r> - </t></tablex> - </box> - - <box> - <h3>Numerators <q title='OpenType feature ID'>numr</q></h3> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r><in>Hello <em>0123</em></in><to></to><out class="numr">Hello 0123</out></r> - </t></tablex> - </box> - - <box> - <h3>Denominators <q title='OpenType feature ID'>dnom</q></h3> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r><in>Hello <em>0123</em></in><to></to><out class="dnom">Hello 0123</out></r> - </t></tablex> - </box> - - <box> - <h3>Superscript <q title='OpenType feature ID'>sups</q></h3> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r><in>H<em>ello 0123</em></in><to></to><out class="sups">Hello 0123</out></r> - <r><in><em>abcdefghijklm</em></in><to></to><out class="sups">abcdefghijklm</out></r> - <r><in><em>nopqrstuvwxyz</em></in><to></to><out class="sups">nopqrstuvwxyz</out></r> - </t></tablex> - </box> - - <box> - <h3>Subscript <q title='OpenType feature ID'>subs</q></h3> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r><in>H<em>ello 0123</em></in><to></to><out class="subs">Hello 0123</out></r> - <r><in><em>abcdefghijklm</em></in><to></to><out class="subs">abcdefghijklm</out></r> - <r><in><em>nopqrstuvwxyz</em></in><to></to><out class="subs">nopqrstuvwxyz</out></r> - </t></tablex> - </box> - - <box> - <h3>Fractions <q title='OpenType feature ID'>frac</q></h3> - <p> - This feature is contextually sensitive and will convert "words" of - numbers separated by forward slash into proper fractions. - This feature is dynamic and allows for any fractions. - Note that the digits used for fractions are custom-made for their - small size, and are even made separately from the slightly larger - Superscript and Subscript numbers. - </p> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r> - <in><em>1/3</em> <em>3/4</em> <em>1/5</em> <em>1337/5910</em></in> - <to></to><out class="frac">1/3 3/4 1/5 1337/5910</out> - </r> - </t></tablex> - </box> - - <box> - <h3>Case alternates <q title='OpenType feature ID'>case</q></h3> - <p> - Switches out some glyphs to work better with capital letters and numbers. - </p> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r> - <in><em>(</em>Hello<em>)</em> <em>[</em>World<em>]</em> <em>{</em>9000<em>}</em></in> - <to></to><out class="case">(Hello) [World] {9000}</out> - </r> - <r><in>SCHOOL <em>@</em> RUN</in><to></to><out class="case">SCHOOL @ RUN</out></r> - <r><in>3 <em>+</em> 9 <em>=</em> 12 <em>*</em> 1</in><to></to><out class="case">3 + 9 = 12 * 1</out></r> - <r><in><em>*+÷±×=≠≈•~<>≤≥</em></in><to></to><out class="case">*+÷±×=≠≈•~<>≤≥</out></r> - <r><in><em>→</em> <em>←</em> <em>⟶</em> <em>⟵</em> <em>−</em> <em>-</em> <em>–</em> <em>—</em> <em>:</em></in><to></to><out class="case">→ ← ⟶ ⟵ − - – — :</out></r> - </t></tablex> - </box> - - <box> - <h3>Stylistic set 1: Alternate digits <q title='OpenType feature ID'>ss01</q></h3> - <p> - An alternate style of digits. - Note that individual digit styles can be cherry-picked using the cvXX - features. - </p> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r> - <in><em>1</em>2<em>34</em>5<em>6</em>78<em>9</em>0</in> - <to></to><out class="ss01">1234567890</out> - </r> - <r><in><em>13469</em></in><to></to><out class="ss01">13469</out></r> - </t></tablex> - </box> - - <box> - <h3>Stylistic set 2: Disambiguation <q title='OpenType feature ID'>ss02</q></h3> - <p> - Alternate glyph set that increases visual difference between similar-looking characters. - </p> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r><in>WP<em>0</em>AC2A9XS<em>I</em>1<em>0</em>12O9</in><to></to><out class="ss02">WP0AC2A9XSI1012O9</out></r> - <r><in><em>Ill</em>ega<em>l</em></in><to></to><out class="ss02">Illegal</out></r> - <r><in>βeta <em>ß</em>eta Busine<em>ß</em></in><to></to><out class="ss02">βeta ßeta Busineß</out></r> - </t></tablex> - </box> - - <box> - <h3>Discretionary ligatures <q title='OpenType feature ID'>dlig</q></h3> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r><in><em>¡¿</em>What<em>?!</em></in><to></to><out class="dlig">¡¿What?!</out></r> - <r><in><em>¿¡</em>What<em>!?</em></in><to></to><out class="dlig">¿¡What!?</out></r> - </t></tablex> - </box> - - <box> - <h3>Slashed zero <q title='OpenType feature ID'>zero</q></h3> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r><in><em>0</em>123</in><to></to><out class="zero">0123</out></r> - </t></tablex> - </box> - - <box> - <h3>Character variants <q title='OpenType feature ID'>cvXX</q></h3> - <p> - Allows cherry-picking alternate characters. + <h3>{{f.title}} <q title='OpenType feature ID'>{{f.tag}}</q></h3> + {% + + if f.description %} + <p>{{f.description}}</p> + {% endif %}{% + + assign feat_tag = f.tag %}{% + assign has_feature_col = false %}{% + for s in f.samples %}{% + if s.feat %}{% + assign has_feature_col = true %}{% + break %}{% + endif %}{% + endfor + + %} + {% if has_feature_col %} + <grid class="c8"> + <c span="1" class="low-contrast ">Feature</c> + <c span="3" class="low-contrast">Disabled</c> + <c span="1" class="low-contrast center-text">→</c> + <c span="3" class="low-contrast">Enabled</c> + {% else %} + <grid class="c9"> + <c span="4" class="low-contrast">Disabled</c> + <c span="1" class="low-contrast center-text">→</c> + <c span="4" class="low-contrast">Enabled</c> + {% endif %} + {% for s in f.samples %} + {% + + if has_feature_col %}{% + assign sample = s.sample %}{% + assign feat_tag = s.feat %}{% + else %}{% + assign sample = s %}{% + endif %}{% + + assign sample_in = sample | replace: "›", "<em>" | replace: "‹", "</em>" %}{% + assign sample_out = sample | remove: "›" | remove: "‹" + + %} {% if has_feature_col %} + <c span="1" class="">{{feat_tag}}</c> + <c span="3" class="sample ff-none">{{sample_in}}</c> + <c span="1" class="low-contrast center-text">→</c> + <c span="3" class="sample ff-{{feat_tag}}">{{sample_out}}</c> + {% else %} + <c span="4" class="sample ff-none">{{sample_in}}</c> + <c span="1" class="low-contrast center-text">→</c> + <c span="4" class="sample ff-{{feat_tag}}">{{sample_out}}</c> + {% endif %} + {% endfor %} + </grid> + <p class="example" title="CSS code"> + <tt>font-feature-settings: '{{feat_tag}}' 1</tt> </p> - <tablex><t> - <h><name>Feature </name><in>Disabled</in><to></to><out>Enabled</out></h> - <r title="Alternate one"><name>cv01</name><in>1</in><to></to><out class="cv01">1</out></r> - <r title="Open four"><name>cv02</name><in>4</in><to></to><out class="cv02">4</out></r> - <r title="Open six"><name>cv03</name><in>6</in><to></to><out class="cv03">6</out></r> - <r title="Open nine"><name>cv04</name><in>9</in><to></to><out class="cv04">9</out></r> - <r title="Lower case L with tail"><name>cv05</name><in>l ł ƚ ɫ ɬ ŀ ĺ ļ ľ ḷ ḹ ḻ ḽ</in><to></to><out class="cv05">l ł ƚ ɫ ɬ ŀ ĺ ļ ľ ḷ ḹ ḻ ḽ</out></r> - <r title="Lower case R with straight tail"><name>cv06</name><in>r ɽ ɍ ɼ ŕ ŗ ř ȑ ȓ ṙ ṛ ṝ ṟ</in><to></to><out class="cv06">r ɽ ɍ ɼ ŕ ŗ ř ȑ ȓ ṙ ṛ ṝ ṟ</out></r> - <r title="Alternate German double-s"><name>cv07</name><in>ß</in><to></to><out class="cv07">ß</out></r> - <r title="Upper-case i with serif"><name>cv08</name><in>I Ï Ḯ Ɨ Ḭ Ì Í Î Ĩ Ī Ĭ<br>Į İ Ǐ Ȉ Ȋ Ỉ Ị Ι Ί Ϊ Ἰ Ἱ Ἲ<br>Ἳ Ἴ Ἵ Ἶ Ἷ Ῐ Ῑ Ὶ Ί І Ї</in><to></to><out class="cv08">I Ï Ḯ Ɨ Ḭ Ì Í Î Ĩ Ī Ĭ<br>Į İ Ǐ Ȉ Ȋ Ỉ Ị Ι Ί Ϊ Ἰ Ἱ Ἲ<br>Ἳ Ἴ Ἵ Ἶ Ἷ Ῐ Ῑ Ὶ Ί І Ї</out></r> - <r title="Flat top three"><name>cv09</name><in>3</in><to></to><out class="cv09">3</out></r> - <r title="Capital G with spur"><name>cv10</name><in>G Ǥ Ɠ Ĝ Ğ Ġ Ģ Ǧ Ǵ Ḡ</in><to></to><out class="cv09">G Ǥ Ɠ Ĝ Ğ Ġ Ģ Ǧ Ǵ Ḡ</out></r> - </t></tablex> + {% if f.footer %} + <p>{{f.footer}}</p> + {% endif %} </box> - - <box> - <h3>Capital Spacing <q title='OpenType feature ID'>cpsp</q></h3> - <p> - Slightly increases letter spacing for increased legibility of - capital letters. Note: It's usually better to set letter-spacing - (aka tracking) manually instead of using this feature. It's here - mainly for completeness. - </p> - <tablex><t> - <h><in>Disabled</in><to></to><out>Enabled</out></h> - <r><in>FOREVER IMMATERIAL</in><to></to><out class="cpsp">FOREVER IMMATERIAL</out></r> - <r><in>TORSCHLUẞPANIK</in><to></to><out class="cpsp">TORSCHLUẞPANIK</out></r> - </t></tablex> - </box> - + {% endfor %} </boxes> <p> Additional features, not highlighted above: <q title='OpenType feature ID'>locl</q>, + <q title='OpenType feature ID'>salt</q>, <q title='OpenType feature ID'>aalt</q>, <q title='OpenType feature ID'>ccmp</q>, - <q title='OpenType feature ID'>ordn</q> and - <q title='OpenType feature ID'>salt</q>, + <q title='OpenType feature ID'>cpsp</q> and + <q title='OpenType feature ID'>ordn</q>. + <br> + You can explore features in the <a href="lab/">interactive lab</a>. </p> <p> </p> diff --git a/docs/res/base.css b/docs/res/base.css index bee1d0dd6..b4254200d 100644 --- a/docs/res/base.css +++ b/docs/res/base.css @@ -7,7 +7,7 @@ body { font-size: 15px; line-height: 1.5; - letter-spacing: -0.002em; + letter-spacing: -0.004em; font-weight: 400; padding-bottom: 30px; @@ -24,11 +24,11 @@ body { -moz-font-kerning: normal; -o-font-kerning: normal; - font-variant-ligatures: contextual common-ligatures discretionary-ligatures; - -webkit-font-variant-ligatures: contextual common-ligatures discretionary-ligatures; - -ms-font-variant-ligatures: contextual common-ligatures discretionary-ligatures; - -moz-font-variant-ligatures: contextual common-ligatures discretionary-ligatures; - -o-font-variant-ligatures: contextual common-ligatures discretionary-ligatures; + font-variant-ligatures: contextual common-ligatures; + -webkit-font-variant-ligatures: contextual common-ligatures; + -ms-font-variant-ligatures: contextual common-ligatures; + -moz-font-variant-ligatures: contextual common-ligatures; + -o-font-variant-ligatures: contextual common-ligatures; } /* Font style classifiers used by samples and dynmetrics */ @@ -157,7 +157,7 @@ h1, h2, h3 { h1 { color: #222; font-size: 55px; - letter-spacing: -0.03em; + letter-spacing: -0.038em; line-height: 1.1em; text-indent: -2px; margin-bottom: 30px; @@ -167,11 +167,15 @@ h1 { h2 { font-size: 30px; font-weight: 600; - letter-spacing: -0.015em; + letter-spacing: -0.025em; line-height: 30px; margin-bottom: 25px; margin-top: 10px; } +.row.dark h2, +.row.black h2 { + letter-spacing: -0.014em; +} h2.back { color:rgba(0,0,0,0.2); font-size: inherit; @@ -207,6 +211,11 @@ h2.banner { h3 { font-size: 20px; font-weight: 600; + letter-spacing: -0.02em; +} +.row.dark h3, +.row.black h3 { + letter-spacing: -0.012em; } h3 q { font-weight: 400; @@ -333,13 +342,18 @@ h1 > a, h2 > a, h3 > a { color: #3B414A; } -ul { - margin-left:1.1em; -} +/* --------------------------------------------------------------------- */ -a > img { - display: block; -} +ul { margin-left:1.1em; } +a > img { display: block; } + +/* --------------------------------------------------------------------- */ +/* generic helpers */ + +.low-contrast { opacity: 0.4; } +.center-text { text-align: center; } + +/* --------------------------------------------------------------------- */ #repertoire-image { display:block; @@ -358,6 +372,7 @@ a > img { width: 100%; } +/* --------------------------------------------------------------------- */ tablex { display: flex; @@ -380,6 +395,131 @@ tablex { display: table-row; } +/* --------------------------------------------------------------------- */ +/* +grid with 4 major columns subdivided twice + +| | | | | +| 1 | 2 | 3 | 4 | +| | | | | +| | | | | +| 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | +| | | | | | | | | +| | | | | | | | | +| 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | +| | | | | | | | | | | | | | | | | +| | | | | | | | | | | | | | | | | + + +*/ + +.row.features { display:none; } +@supports (display: grid) { + .row.features { display:flex; } +} +.row.features p.example { margin-top:2rem; opacity:0.4; } + +grid { + display: grid; + grid-template-columns: repeat(4, 1fr); + grid-column-gap: 1rem; + grid-row-gap: 1rem; +} +grid.c4 { grid-template-columns: repeat(4, 1fr); } +grid.c8 { grid-template-columns: repeat(8, 1fr); } +grid.c9 { grid-template-columns: repeat(9, 1fr); } +grid.c16 { grid-template-columns: repeat(16, 1fr); } +/*grid, grid4 { + grid-template-columns: repeat(4, 1fr); +}*/ +c { + display: block; + grid-column-end: span 1; +} +c[start="1"] { grid-column-start: 1; } +c[start="2"] { grid-column-start: 2; } +c[start="3"] { grid-column-start: 3; } +c[start="4"] { grid-column-start: 4; } +c[start="5"] { grid-column-start: 5; } +c[start="6"] { grid-column-start: 6; } +c[start="7"] { grid-column-start: 7; } +c[start="8"] { grid-column-start: 8; } +c[start="9"] { grid-column-start: 9; } + +c[span="1"] { grid-column-end: span 1; } +c[span="2"] { grid-column-end: span 2; } +c[span="3"] { grid-column-end: span 3; } +c[span="4"] { grid-column-end: span 4; } +c[span="5"] { grid-column-end: span 5; } +c[span="6"] { grid-column-end: span 6; } +c[span="7"] { grid-column-end: span 7; } +c[span="8"] { grid-column-end: span 8; } +c[span="9"] { grid-column-end: span 9; } + +c[span="1-1"] { grid-column: 1 / 1; } +c[span="2-5"] { grid-column: 2 / 5; } +c[span="2-4"] { grid-column: 2 / 4; } + +grid.c4 c[span="2..."], c[span="2.."] { grid-column: 2 / 5; } +grid.c8 c[span="2..."], c[span="2.."] { grid-column: 2 / 9; } + +/* .debug can be added to a grid to visualize its effective cells. + .debug-color applies alternating colors. */ +grid.debug > *, grid.debug-color > * { + --color: rgba(250, 230, 0, 0.2); + background-image: linear-gradient(to bottom, var(--color) 0%, var(--color) 100%); +} +grid.debug > :nth-child(4n+2) { --color: rgba(250, 0, 0, 0.1); } +grid.debug > :nth-child(4n+3) { --color: rgba(40, 120, 255, 0.1); } +grid.debug > :nth-child(4n+4) { --color: rgba(0, 230, 80, 0.17); } + +.col-all { grid-column: 1 / span 16; } + +.col-1 { grid-column: 1 / span 2; } +.col-1-2 { grid-column: 1 / span 4; } +.col-1-3 { grid-column: 1 / span 6; } +.col-1-4 { grid-column: 1 / span 8; } +.col-1-5 { grid-column: 1 / span 10; } +.col-1-6 { grid-column: 1 / span 12; } +.col-1-7 { grid-column: 1 / span 14; } +.col-1-8 { grid-column: 1 / span 16; } + +.col-2 { grid-column: 2 / span 2; } +.col-2-2 { grid-column: 2 / span 4; } +.col-2-3 { grid-column: 2 / span 6; } +.col-2-4 { grid-column: 2 / span 8; } +.col-2-5 { grid-column: 2 / span 10; } +.col-2-6 { grid-column: 2 / span 12; } +.col-2-7 { grid-column: 2 / span 14; } + +.col-3 { grid-column: 3 / span 2; } +.col-3-2 { grid-column: 3 / span 4; } +.col-3-3 { grid-column: 3 / span 6; } +.col-3-4 { grid-column: 3 / span 8; } +.col-3-5 { grid-column: 3 / span 10; } +.col-3-6 { grid-column: 3 / span 12; } + +.col-4 { grid-column: 4 / span 2; } +.col-4-2 { grid-column: 4 / span 4; } +.col-4-3 { grid-column: 4 / span 6; } +.col-4-4 { grid-column: 4 / span 8; } +.col-4-5 { grid-column: 4 / span 10; } + +.col-5 { grid-column: 5 / span 2; } +.col-5-2 { grid-column: 5 / span 4; } +.col-5-3 { grid-column: 5 / span 6; } +.col-5-4 { grid-column: 5 / span 8; } + +.col-6 { grid-column: 6 / span 2; } +.col-6-2 { grid-column: 6 / span 4; } +.col-6-3 { grid-column: 6 / span 6; } + +.col-7 { grid-column: 7 / span 2; } +.col-7-2 { grid-column: 7 / span 4; } + +.col-8 { grid-column: 8 / span 2; } + +/* --------------------------------------------------------------------- */ boxes { display: flex; @@ -411,6 +551,16 @@ box h3 { margin-bottom:0.8em; } +box.large tablex r { + line-height: 1.5; +} +box.large tablex r in, +box.large tablex r to, +box.large tablex r out { + font-size: 2rem; + padding-bottom: 0; +} + #hud-notification { position: fixed; bottom: 20px; @@ -536,30 +686,31 @@ instead. */ -.ff-dlig { font-feature-settings: 'dlig' 1; } -.ff-numr { font-feature-settings: 'numr' 1; } -.ff-dnom { font-feature-settings: 'dnom' 1; } -.ff-tnum { font-feature-settings: 'tnum' 1; } -.ff-case { font-feature-settings: 'case' 1; } -.ff-zero { font-feature-settings: 'zero' 1; } -.ff-frac { font-feature-settings: 'frac' 1; } -.ff-sups { font-feature-settings: 'sups' 1; } -.ff-subs { font-feature-settings: 'subs' 1; } -.ff-cpsp { font-feature-settings: 'cpsp' 1; } -.ff-salt { font-feature-settings: 'salt' 1; } +.ff-none { font-feature-settings: 'calt' 0, 'liga' 0; -webkit-font-feature-settings: 'calt' 0, 'liga' 0; -ms-font-feature-settings: 'calt' 0, 'liga' 0; -moz-font-feature-settings: 'calt' 0, 'liga' 0; } + +.ff-dlig { font-feature-settings: 'dlig' 1; -webkit-font-feature-settings: 'dlig' 1; -ms-font-feature-settings: 'dlig' 1; -moz-font-feature-settings: 'dlig' 1; } +.ff-numr { font-feature-settings: 'numr' 1; -webkit-font-feature-settings: 'numr' 1; -ms-font-feature-settings: 'numr' 1; -moz-font-feature-settings: 'numr' 1; } +.ff-dnom { font-feature-settings: 'dnom' 1; -webkit-font-feature-settings: 'dnom' 1; -ms-font-feature-settings: 'dnom' 1; -moz-font-feature-settings: 'dnom' 1; } +.ff-tnum { font-feature-settings: 'tnum' 1; -webkit-font-feature-settings: 'tnum' 1; -ms-font-feature-settings: 'tnum' 1; -moz-font-feature-settings: 'tnum' 1; } +.ff-case { font-feature-settings: 'case' 1; -webkit-font-feature-settings: 'case' 1; -ms-font-feature-settings: 'case' 1; -moz-font-feature-settings: 'case' 1; } +.ff-zero { font-feature-settings: 'zero' 1; -webkit-font-feature-settings: 'zero' 1; -ms-font-feature-settings: 'zero' 1; -moz-font-feature-settings: 'zero' 1; } +.ff-frac { font-feature-settings: 'frac' 1; -webkit-font-feature-settings: 'frac' 1; -ms-font-feature-settings: 'frac' 1; -moz-font-feature-settings: 'frac' 1; } +.ff-sups { font-feature-settings: 'sups' 1; -webkit-font-feature-settings: 'sups' 1; -ms-font-feature-settings: 'sups' 1; -moz-font-feature-settings: 'sups' 1; } +.ff-subs { font-feature-settings: 'subs' 1; -webkit-font-feature-settings: 'subs' 1; -ms-font-feature-settings: 'subs' 1; -moz-font-feature-settings: 'subs' 1; } +.ff-cpsp { font-feature-settings: 'cpsp' 1; -webkit-font-feature-settings: 'cpsp' 1; -ms-font-feature-settings: 'cpsp' 1; -moz-font-feature-settings: 'cpsp' 1; } +.ff-salt { font-feature-settings: 'salt' 1; -webkit-font-feature-settings: 'salt' 1; -ms-font-feature-settings: 'salt' 1; -moz-font-feature-settings: 'salt' 1; } .ff-salt-zero { font-feature-settings: 'salt' 1, 'zero' 1; } .ff-cv07-salt-zero { font-feature-settings: 'cv07' 1, 'salt' 1, 'zero' 1; } -.ff-ss01 { font-feature-settings: 'ss01' 1; } -.ff-ss02 { font-feature-settings: 'ss02' 1; } - -.ff-cv01 { font-feature-settings: 'cv01' 1; } -.ff-cv02 { font-feature-settings: 'cv02' 1; } -.ff-cv03 { font-feature-settings: 'cv03' 1; } -.ff-cv04 { font-feature-settings: 'cv04' 1; } -.ff-cv05 { font-feature-settings: 'cv05' 1; } -.ff-cv06 { font-feature-settings: 'cv06' 1; } -.ff-cv07 { font-feature-settings: 'cv07' 1; } -.ff-cv08 { font-feature-settings: 'cv08' 1; } -.ff-cv09 { font-feature-settings: 'cv09' 1; } -.ff-cv10 { font-feature-settings: 'cv10' 1; } +.ff-ss01 { font-feature-settings: 'ss01' 1; -webkit-font-feature-settings: 'ss01' 1; -ms-font-feature-settings: 'ss01' 1; -moz-font-feature-settings: 'ss01' 1; } +.ff-ss02 { font-feature-settings: 'ss02' 1; -webkit-font-feature-settings: 'ss02' 1; -ms-font-feature-settings: 'ss02' 1; -moz-font-feature-settings: 'ss02' 1; } +.ff-cv01 { font-feature-settings: 'cv01' 1; -webkit-font-feature-settings: 'cv01' 1; -ms-font-feature-settings: 'cv01' 1; -moz-font-feature-settings: 'cv01' 1; } +.ff-cv02 { font-feature-settings: 'cv02' 1; -webkit-font-feature-settings: 'cv02' 1; -ms-font-feature-settings: 'cv02' 1; -moz-font-feature-settings: 'cv02' 1; } +.ff-cv03 { font-feature-settings: 'cv03' 1; -webkit-font-feature-settings: 'cv03' 1; -ms-font-feature-settings: 'cv03' 1; -moz-font-feature-settings: 'cv03' 1; } +.ff-cv04 { font-feature-settings: 'cv04' 1; -webkit-font-feature-settings: 'cv04' 1; -ms-font-feature-settings: 'cv04' 1; -moz-font-feature-settings: 'cv04' 1; } +.ff-cv05 { font-feature-settings: 'cv05' 1; -webkit-font-feature-settings: 'cv05' 1; -ms-font-feature-settings: 'cv05' 1; -moz-font-feature-settings: 'cv05' 1; } +.ff-cv06 { font-feature-settings: 'cv06' 1; -webkit-font-feature-settings: 'cv06' 1; -ms-font-feature-settings: 'cv06' 1; -moz-font-feature-settings: 'cv06' 1; } +.ff-cv07 { font-feature-settings: 'cv07' 1; -webkit-font-feature-settings: 'cv07' 1; -ms-font-feature-settings: 'cv07' 1; -moz-font-feature-settings: 'cv07' 1; } +.ff-cv08 { font-feature-settings: 'cv08' 1; -webkit-font-feature-settings: 'cv08' 1; -ms-font-feature-settings: 'cv08' 1; -moz-font-feature-settings: 'cv08' 1; } +.ff-cv09 { font-feature-settings: 'cv09' 1; -webkit-font-feature-settings: 'cv09' 1; -ms-font-feature-settings: 'cv09' 1; -moz-font-feature-settings: 'cv09' 1; } +.ff-cv10 { font-feature-settings: 'cv10' 1; -webkit-font-feature-settings: 'cv10' 1; -ms-font-feature-settings: 'cv10' 1; -moz-font-feature-settings: 'cv10' 1; } diff --git a/docs/res/base.js b/docs/res/base.js index 40188360e..05e98a7ff 100644 --- a/docs/res/base.js +++ b/docs/res/base.js @@ -81,7 +81,7 @@ var HUDNotification = { // the compensating tracking in EM. // function InterDynamicTracking(fontSize) { - var a = -0.02, b = 0.0755, c = -0.102; + var a = -0.038, b = 0.161, c = -0.12; // tracking = a + b * e ^ (c * fontSize) return a + b * Math.pow(Math.E, c * fontSize) } diff --git a/docs/samples/index.html b/docs/samples/index.html index 3143df37e..b3763ebab 100644 --- a/docs/samples/index.html +++ b/docs/samples/index.html @@ -4,10 +4,9 @@ title: Samples --- {% -capture url_root - %}{% if site.safe == false %}/{% else %}/inter/{% endif -%}{% -endcapture %}{% +if site.safe == false %}{% +assign url_root = "/" %}{% else %}{% +assign url_root = "/inter/" %}{% endif %}{% for file in site.static_files %}{% assign _path = file.path | remove_first: "/inter" %}{% |