I’m using the HP49 typefaces from hpcalc.org, specifically FONT8.TTF
, for a small webpage.
The issue is, I cannot get the dark triangle to show properly. In the HTML,
it is displayed as "†" (with a fallback font), and the actual character is not displayed at all.
@font-face {
font-family: 'F8';
src: url('./FONT8.TTF') format('truetype')
}
.SC {
font-family: 'F8';
background-color: #A8C0B0;
color: black;
}
<div class="column has-text-right">
<p id="text" class="SC">
<!--non-printable character here-->{{ text }}
</p>
</div>
<div class="column">
<input type="" class="SC" v-model="text">
</div>
In the image link below, the right input box is linked to the left paragraph using Vue.
Manually typing the character using Ctrl+Shift+u then "86" works fine, but again, it doesn’t work in the left paragraph, which is what I actually want. Also KFontView shows it properly.
In addition, doing vm.text += "u0086";
appends the character that I want in the input box but not in the paragraph.
Note: The xxd
of the .html
file shows the inserted character using Ctrl+Shift+u in vscode as c286
. Changing it as, e.g. 2086
doesn’t work either.