diff options
Diffstat (limited to '')
| -rw-r--r-- | src/inc/unicode-range.htm | 32 |
1 files changed, 32 insertions, 0 deletions
diff --git a/src/inc/unicode-range.htm b/src/inc/unicode-range.htm new file mode 100644 index 0000000..778cb7c --- /dev/null +++ b/src/inc/unicode-range.htm @@ -0,0 +1,32 @@ +<!-- Generated file, you may edit and discard src/inc/unicode-range.md :) --> +<p>While working on my custom <a href="https://apps.ankiweb.net/" +target="_blank">Anki</a> cards for learning Japanese and Turkish, I +found that my font of choice for Japanese <a +href="https://ja.wikipedia.org/wiki/IPA%E3%83%95%E3%82%A9%E3%83%B3%E3%83%88" +target="_blank">IPAex</a> was not properly supporting glyphs used by +Turkish, like <a href="https://en.wikipedia.org/wiki/%C4%9E" +target="_blank">ğ</a>.</p> +<p>To fix this i am using a property of the <code>@font-face</code> rule +to limit custom fonts to source their glyphs from a subset of the +unicode range and force fallback to the next font in the set.</p> +<div class="sourceCode" id="cb1"><pre +class="sourceCode css"><code class="sourceCode css"><span id="cb1-1"><a href="#cb1-1" aria-hidden="true" tabindex="-1"></a><span class="im">@font-face</span> {</span> +<span id="cb1-2"><a href="#cb1-2" aria-hidden="true" tabindex="-1"></a> <span class="kw">font-family</span><span class="ch">:</span> <span class="st">"IPAexGothic"</span><span class="op">;</span></span> +<span id="cb1-3"><a href="#cb1-3" aria-hidden="true" tabindex="-1"></a> <span class="kw">src</span><span class="ch">:</span></span> +<span id="cb1-4"><a href="#cb1-4" aria-hidden="true" tabindex="-1"></a> <span class="fu">local(</span><span class="st">"IPAexGothic"</span><span class="fu">)</span><span class="op">,</span></span> +<span id="cb1-5"><a href="#cb1-5" aria-hidden="true" tabindex="-1"></a> <span class="fu">url(</span><span class="st">"_ipaexg.ttf"</span><span class="fu">)</span><span class="op">;</span></span> +<span id="cb1-6"><a href="#cb1-6" aria-hidden="true" tabindex="-1"></a> <span class="kw">unicode-range</span><span class="ch">:</span> </span> +<span id="cb1-7"><a href="#cb1-7" aria-hidden="true" tabindex="-1"></a> <span class="dv">U+0020-007F</span><span class="op">,</span></span> +<span id="cb1-8"><a href="#cb1-8" aria-hidden="true" tabindex="-1"></a> <span class="dv">U+3000-303f</span><span class="op">,</span></span> +<span id="cb1-9"><a href="#cb1-9" aria-hidden="true" tabindex="-1"></a> <span class="dv">U+3040-309f</span><span class="op">,</span></span> +<span id="cb1-10"><a href="#cb1-10" aria-hidden="true" tabindex="-1"></a> <span class="dv">U+30a0-30ff</span><span class="op">,</span></span> +<span id="cb1-11"><a href="#cb1-11" aria-hidden="true" tabindex="-1"></a> <span class="dv">U</span>+<span class="dv">ff00-ffef</span><span class="op">,</span></span> +<span id="cb1-12"><a href="#cb1-12" aria-hidden="true" tabindex="-1"></a> <span class="dv">U+4e00-9faf</span><span class="op">;</span></span> +<span id="cb1-13"><a href="#cb1-13" aria-hidden="true" tabindex="-1"></a>}</span> +<span id="cb1-14"><a href="#cb1-14" aria-hidden="true" tabindex="-1"></a></span> +<span id="cb1-15"><a href="#cb1-15" aria-hidden="true" tabindex="-1"></a><span class="fu">.card</span> {</span> +<span id="cb1-16"><a href="#cb1-16" aria-hidden="true" tabindex="-1"></a> <span class="kw">font-family</span><span class="ch">:</span></span> +<span id="cb1-17"><a href="#cb1-17" aria-hidden="true" tabindex="-1"></a> <span class="dv">IPAexGothic</span><span class="op">,</span></span> +<span id="cb1-18"><a href="#cb1-18" aria-hidden="true" tabindex="-1"></a> <span class="dv">Noto Sans</span><span class="op">,</span></span> +<span id="cb1-19"><a href="#cb1-19" aria-hidden="true" tabindex="-1"></a> <span class="dv">sans</span><span class="op">;</span></span> +<span id="cb1-20"><a href="#cb1-20" aria-hidden="true" tabindex="-1"></a>}</span></code></pre></div> |