mirror of
https://github.com/eigilnikolajsen/commit-mono.git
synced 2024-09-11 18:37:12 +03:00
update fonts + small changes
This commit is contained in:
parent
3f39f3593a
commit
b3ec9cd839
7
404.html
7
404.html
@ -19,17 +19,17 @@
|
||||
<style>
|
||||
@font-face {
|
||||
font-family: "CommitMono";
|
||||
src: url("/src/fonts/CommitMonoV117-VF.woff2");
|
||||
src: url("/src/fonts/CommitMonoV118-VF.woff2");
|
||||
font-style: normal;
|
||||
font-weight: 450;
|
||||
font-display: swap;
|
||||
}
|
||||
body {
|
||||
background-color: #aaa;
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
display: grid;
|
||||
place-content: center;
|
||||
height: 96vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
p,
|
||||
a {
|
||||
@ -38,7 +38,6 @@
|
||||
color: #111;
|
||||
line-height: 1rem;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: fit-content;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
@ -1,21 +1,25 @@
|
||||
feature ss02 {
|
||||
# less_equal, exclam_equal substitution
|
||||
|
||||
# classes
|
||||
@equal = [equal equal.case];
|
||||
|
||||
# feature
|
||||
sub @space_actor @less' @equal @space_actor by less_equal.liga;
|
||||
sub @space_actor less_equal.liga @equal' @space_actor by space;
|
||||
sub @space_actor equal' equal @space_actor by equal_equal.liga;
|
||||
sub @space_actor equal_equal.liga equal' @space_actor by space;
|
||||
|
||||
sub @space_actor @greater' @equal @space_actor by greater_equal.liga;
|
||||
sub @space_actor greater_equal.liga @equal' @space_actor by space;
|
||||
sub @space_actor equal' equal equal @space_actor by equal_equal_equal.liga;
|
||||
sub @space_actor equal_equal_equal.liga equal' equal @space_actor by space;
|
||||
sub @space_actor equal_equal_equal.liga space equal' @space_actor by space;
|
||||
|
||||
sub @space_actor exclam' @equal @space_actor by exclam_equal.liga;
|
||||
sub @space_actor exclam_equal.liga @equal' @space_actor by space;
|
||||
sub @space_actor less' equal @space_actor by less_equal.liga;
|
||||
sub @space_actor less_equal.liga equal' @space_actor by space;
|
||||
|
||||
sub @space_actor exclam' @equal @equal @space_actor by exclam_equal_equal.liga;
|
||||
sub @space_actor exclam_equal_equal.liga @equal' @equal @space_actor by space;
|
||||
sub @space_actor exclam_equal_equal.liga space @equal' @space_actor by space;
|
||||
sub @space_actor greater' equal @space_actor by greater_equal.liga;
|
||||
sub @space_actor greater_equal.liga equal' @space_actor by space;
|
||||
|
||||
sub @space_actor exclam' equal @space_actor by exclam_equal.liga;
|
||||
sub @space_actor exclam_equal.liga equal' @space_actor by space;
|
||||
|
||||
sub @space_actor exclam' equal equal @space_actor by exclam_equal_equal.liga;
|
||||
sub @space_actor exclam_equal_equal.liga equal' equal @space_actor by space;
|
||||
sub @space_actor exclam_equal_equal.liga space equal' @space_actor by space;
|
||||
|
||||
} ss02;
|
||||
|
@ -1,18 +1,13 @@
|
||||
feature ss05 {
|
||||
# Coding Ligature 001—999
|
||||
# Smart kerning
|
||||
|
||||
# classes
|
||||
@width_narr = [f f.leftL f.leftM f.leftS f.rightL f.rightM f.rightS i i.leftL i.leftM i.leftS i.rightL i.rightM i.rightS j j.leftL j.leftM j.leftS j.rightL j.rightM j.rightS l l.leftL l.leftM l.leftS l.rightL l.rightM l.rightS r r.leftL r.leftM r.leftS r.rightL r.rightM r.rightS t t.leftL t.leftM t.leftS t.rightL t.rightM t.rightS i.square i.square.leftL i.square.leftM i.square.leftS i.square.rightL i.square.rightM i.square.rightS j.square j.square.leftL j.square.leftM j.square.leftS j.square.rightL j.square.rightM j.square.rightS];
|
||||
@width_regu = [A A.leftL A.leftM A.leftS A.rightL A.rightM A.rightS B B.leftL B.leftM B.leftS B.rightL B.rightM B.rightS C C.leftL C.leftM C.leftS C.rightL C.rightM C.rightS D D.leftL D.leftM D.leftS D.rightL D.rightM D.rightS E E.leftL E.leftM E.leftS E.rightL E.rightM E.rightS F F.leftL F.leftM F.leftS F.rightL F.rightM F.rightS G G.leftL G.leftM G.leftS G.rightL G.rightM G.rightS H H.leftL H.leftM H.leftS H.rightL H.rightM H.rightS I I.leftL I.leftM I.leftS I.rightL I.rightM I.rightS J J.leftL J.leftM J.leftS J.rightL J.rightM J.rightS K K.leftL K.leftM K.leftS K.rightL K.rightM K.rightS L L.leftL L.leftM L.leftS L.rightL L.rightM L.rightS O O.leftL O.leftM O.leftS O.rightL O.rightM O.rightS P P.leftL P.leftM P.leftS P.rightL P.rightM P.rightS Q Q.leftL Q.leftM Q.leftS Q.rightL Q.rightM Q.rightS R R.leftL R.leftM R.leftS R.rightL R.rightM R.rightS S S.leftL S.leftM S.leftS S.rightL S.rightM S.rightS T T.leftL T.leftM T.leftS T.rightL T.rightM T.rightS U U.leftL U.leftM U.leftS U.rightL U.rightM U.rightS V V.leftL V.leftM V.leftS V.rightL V.rightM V.rightS X X.leftL X.leftM X.leftS X.rightL X.rightM X.rightS Y Y.leftL Y.leftM Y.leftS Y.rightL Y.rightM Y.rightS Z Z.leftL Z.leftM Z.leftS Z.rightL Z.rightM Z.rightS a a.leftL a.leftM a.leftS a.rightL a.rightM a.rightS a.cv01 a.cv01.leftL a.cv01.leftM a.cv01.leftS a.cv01.rightL a.cv01.rightM a.cv01.rightS b b.leftL b.leftM b.leftS b.rightL b.rightM b.rightS c c.leftL c.leftM c.leftS c.rightL c.rightM c.rightS d d.leftL d.leftM d.leftS d.rightL d.rightM d.rightS e e.leftL e.leftM e.leftS e.rightL e.rightM e.rightS g g.leftL g.leftM g.leftS g.rightL g.rightM g.rightS g.cv02 g.cv02.leftL g.cv02.leftM g.cv02.leftS g.cv02.rightL g.cv02.rightM g.cv02.rightS h h.leftL h.leftM h.leftS h.rightL h.rightM h.rightS k k.leftL k.leftM k.leftS k.rightL k.rightM k.rightS n n.leftL n.leftM n.leftS n.rightL n.rightM n.rightS o o.leftL o.leftM o.leftS o.rightL o.rightM o.rightS p p.leftL p.leftM p.leftS p.rightL p.rightM p.rightS q q.leftL q.leftM q.leftS q.rightL q.rightM q.rightS s s.leftL s.leftM s.leftS s.rightL s.rightM s.rightS u u.leftL u.leftM u.leftS u.rightL u.rightM u.rightS v v.leftL v.leftM v.leftS v.rightL v.rightM v.rightS x x.leftL x.leftM x.leftS x.rightL x.rightM x.rightS y y.leftL y.leftM y.leftS y.rightL y.rightM y.rightS z z.leftL z.leftM z.leftS z.rightL z.rightM z.rightS];
|
||||
@width_wide = [M M.leftL M.leftM M.leftS M.rightL M.rightM M.rightS N N.leftL N.leftM N.leftS N.rightL N.rightM N.rightS W W.leftL W.leftM W.leftS W.rightL W.rightM W.rightS m m.leftL m.leftM m.leftS m.rightL m.rightM m.rightS w w.leftL w.leftM w.leftS w.rightL w.rightM w.rightS];
|
||||
|
||||
|
||||
# feature
|
||||
sub @width_narr @center' @width_wide by @leftL;
|
||||
sub @width_wide @center' @width_narr by @rightL;
|
||||
sub @width_regu @center' @width_wide by @leftM;
|
||||
sub @width_wide @center' @width_regu by @rightM;
|
||||
sub @width_narr @center' @width_regu by @leftS;
|
||||
sub @width_regu @center' @width_narr by @rightS;
|
||||
sub @w_narr @center' @w_wide by @leftL;
|
||||
sub @w_wide @center' @w_narr by @rightL;
|
||||
sub @w_regu @center' @w_wide by @leftM;
|
||||
sub @w_wide @center' @w_regu by @rightM;
|
||||
sub @w_narr @center' @w_regu by @leftS;
|
||||
sub @w_regu @center' @w_narr by @rightS;
|
||||
|
||||
} ss05;
|
||||
|
20
index.html
20
index.html
@ -57,8 +57,8 @@
|
||||
<div id="keyboard_container">
|
||||
<div class="key_group" id="tab">
|
||||
<div class="keys">
|
||||
<p data-key-code="Tab" data-key="Tab" class="key" data-noclick="true">Tab</p>
|
||||
<p data-key-code="ShiftTab" data-key="ShiftTab" class="key" data-noclick="true">⇧Tab</p>
|
||||
<p data-key-code="Tab" data-key="Tab" class="key" data-noclick="true">TAB</p>
|
||||
<p data-key-code="ShiftTab" data-key="ShiftTab" class="key" data-noclick="true">⇧TAB</p>
|
||||
</div>
|
||||
<p>Navigate ↓↑</p>
|
||||
</div>
|
||||
@ -95,8 +95,8 @@
|
||||
</div>
|
||||
<div class="key_group" id="escape_textfield">
|
||||
<div class="keys">
|
||||
<p data-key-code="KeyE" data-key="e" class="key">E</p>
|
||||
<p data-key-code="Escape" data-key="Escape" class="key">Esc</p>
|
||||
<p data-key-code="Enter" data-key="Enter" class="key">ENTER</p>
|
||||
<p data-key-code="Escape" data-key="Escape" class="key">ESC</p>
|
||||
</div>
|
||||
<p>Edit text</p>
|
||||
</div>
|
||||
@ -147,10 +147,10 @@
|
||||
<button id="focus_check" title="FocusCheckButton"></button>
|
||||
<ul id="tutorial" tabindex="0" data-edit="true">
|
||||
<li>
|
||||
<span class="span_key key_code_Tab tutorial_key">Tab</span> &
|
||||
<span class="span_key key_code_ShiftTab1 tutorial_key">Shift</span>+<span
|
||||
<span class="span_key key_code_Tab tutorial_key">TAB</span> &
|
||||
<span class="span_key key_code_ShiftTab1 tutorial_key">SHIFT</span>+<span
|
||||
class="span_key key_code_ShiftTab2 tutorial_key"
|
||||
>Tab</span
|
||||
>TAB</span
|
||||
>
|
||||
navigate up/down
|
||||
</li>
|
||||
@ -175,7 +175,7 @@
|
||||
</li>
|
||||
<!-- <li><span class="span_key key_code_KeyR tutorial_key">R</span> reset scroll & zoom</li> -->
|
||||
<li>
|
||||
<span class="span_key key_code_KeyE tutorial_key">E</span>
|
||||
<span class="span_key key_code_Enter tutorial_key">ENTER</span>
|
||||
<span class="span_key key_code_Escape tutorial_key">Esc</span> edit text and cancel
|
||||
edit
|
||||
</li>
|
||||
@ -461,8 +461,8 @@
|
||||
<legend><h2>Language</h2></legend>
|
||||
<fieldset></fieldset>
|
||||
</form>
|
||||
<br />
|
||||
<div id="examples_container">
|
||||
<br />
|
||||
<p tabindex="0" data-edit="true" id="code_example"></p>
|
||||
</div>
|
||||
<form id="weight_form" onchange="updateWeight(event, this)">
|
||||
@ -656,7 +656,7 @@
|
||||
<div tabindex="0" id="block_tab_end"></div>
|
||||
</div>
|
||||
<script>
|
||||
const versionOfCommitMono = "V117"
|
||||
const versionOfCommitMono = "V118"
|
||||
let fontsLoaded = false
|
||||
const commitMono = new FontFace("CommitMono", `url(/src/fonts/CommitMono${versionOfCommitMono}-VF.woff2)`, {
|
||||
style: "normal",
|
||||
|
@ -14,7 +14,7 @@ button {
|
||||
}
|
||||
|
||||
button:active {
|
||||
background: repeating-conic-gradient(transparent 0% 25%, var(--text) 0% 50%, var(--text) 0% 100%) 50% / 2px 2px;
|
||||
background: var(--bg75);
|
||||
}
|
||||
|
||||
#app_root.no_focus {
|
||||
@ -138,21 +138,13 @@ a:focus {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
input:checked + label::before {
|
||||
background: repeating-conic-gradient(var(--text) 0% 25%, transparent 0% 50%, transparent 0% 100%) 50% / 2px 2px;
|
||||
}
|
||||
|
||||
input:checked + label {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.span_key.pressed_key {
|
||||
position: relative;
|
||||
background: repeating-conic-gradient(var(--text) 0% 25%, transparent 0% 50%, transparent 0% 100%) 50% / 2px 2px;
|
||||
background: var(--bg25);
|
||||
}
|
||||
|
||||
ul:focus .span_key.pressed_key {
|
||||
background: repeating-conic-gradient(var(--bg) 0% 25%, transparent 0% 50%, transparent 0% 100%) 50% / 2px 2px;
|
||||
background: var(--bg25-i);
|
||||
}
|
||||
|
||||
.span_key.pressed_key::after {
|
||||
|
@ -42,15 +42,6 @@
|
||||
margin-top: 0.1rem;
|
||||
}
|
||||
|
||||
#select_element .key:nth-child(1) {
|
||||
width: 5rem;
|
||||
}
|
||||
|
||||
#escape_textfield .key:nth-child(2) {
|
||||
letter-spacing: -0.1rem;
|
||||
text-indent: -0.1rem;
|
||||
}
|
||||
|
||||
#safari p,
|
||||
#safari ul {
|
||||
background-color: var(--bg);
|
||||
|
@ -75,6 +75,5 @@ td > div > input + label {
|
||||
|
||||
#section_2 input:checked + label:hover::before {
|
||||
display: block;
|
||||
background: repeating-conic-gradient(transparent 0% 25%, var(--text) 0% 50%, transparent 0% 75%, var(--text) 0% 100%)
|
||||
50% / 2px 2px;
|
||||
background: var(--bg50);
|
||||
}
|
||||
|
@ -118,7 +118,7 @@
|
||||
}
|
||||
|
||||
#intelligent_form input:checked + label::before {
|
||||
background: repeating-conic-gradient(var(--text) 0% 25%, transparent 0% 50%, transparent 0% 100%) 50% / 2px 2px;
|
||||
background: var(--bg25);
|
||||
}
|
||||
|
||||
#intelligent_form input:checked + label {
|
||||
|
@ -62,7 +62,8 @@ form input:focus:checked + label {
|
||||
}
|
||||
|
||||
form input:checked + label::before {
|
||||
background: repeating-conic-gradient(var(--text) 0% 25%, transparent 0% 50%, transparent 0% 100%) 50% / 2px 2px;
|
||||
background: var(--bg25);
|
||||
background-position: 1px 0.5px;
|
||||
}
|
||||
|
||||
#canvas {
|
||||
|
@ -85,8 +85,7 @@
|
||||
color: var(--text);
|
||||
}
|
||||
.question_button:hover {
|
||||
background: repeating-conic-gradient(transparent 0% 25%, var(--text) 0% 50%, transparent 0% 75%, var(--text) 0% 100%)
|
||||
50% / 2px 2px;
|
||||
background: var(--bg50);
|
||||
color: var(--bg);
|
||||
}
|
||||
.question_button.right_button::before {
|
||||
@ -104,11 +103,11 @@
|
||||
}
|
||||
|
||||
.question_button.button_choice {
|
||||
background: repeating-conic-gradient(var(--text) 0% 25%, transparent 0% 50%, transparent 0% 100%) 50% / 2px 2px;
|
||||
background: var(--bg25);
|
||||
color: var(--text);
|
||||
}
|
||||
.question_button.button_choice:focus {
|
||||
background: repeating-conic-gradient(transparent 0% 25%, var(--text) 0% 50%, var(--text) 0% 100%) 50% / 2px 2px;
|
||||
background: var(--bg75);
|
||||
color: var(--bg);
|
||||
}
|
||||
|
||||
|
@ -59,8 +59,7 @@ button:focus a {
|
||||
position: relative;
|
||||
}
|
||||
.download_button:hover {
|
||||
background: repeating-conic-gradient(transparent 0% 25%, var(--text) 0% 50%, transparent 0% 75%, var(--text) 0% 100%)
|
||||
50% / 2px 2px;
|
||||
background: var(--bg50);
|
||||
color: var(--bg);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
@ -12,11 +12,13 @@
|
||||
|
||||
.active_feature {
|
||||
cursor: pointer;
|
||||
background: repeating-conic-gradient(var(--text) 0% 25%, transparent 0% 50%, transparent 0% 100%) 50% / 2px 2px;
|
||||
background: var(--bg25);
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
h2:focus .active_feature {
|
||||
background: repeating-conic-gradient(var(--bg) 0% 25%, transparent 0% 50%, transparent 0% 100%) 50% / 2px 2px;
|
||||
background: var(--bg25-i);
|
||||
}
|
||||
|
||||
#features_docu h2 {
|
||||
|
@ -1,3 +1,14 @@
|
||||
:root {
|
||||
--bg25: repeating-conic-gradient(var(--text) 0% 25%, transparent 0% 100%) 1px 0.5px / 2px 2px;
|
||||
--bg50: repeating-conic-gradient(var(--text) 0% 25%, transparent 0% 50%, var(--text) 0% 75%, transparent 0% 100%) 1px
|
||||
0.5px / 2px 2px;
|
||||
--bg75: repeating-conic-gradient(transparent 0% 25%, var(--text) 0% 100%) 1px 0.5px / 2px 2px;
|
||||
--bg25-i: repeating-conic-gradient(var(--bg) 0% 25%, transparent 0% 100%) 1px 0.5px / 2px 2px;
|
||||
--bg50-i: repeating-conic-gradient(var(--bg) 0% 25%, transparent 0% 50%, var(--bg) 0% 75%, transparent 0% 100%) 1px
|
||||
0.5px / 2px 2px;
|
||||
--bg75-i: repeating-conic-gradient(transparent 0% 25%, var(--bg) 0% 100%) 1px 0.5px / 2px 2px;
|
||||
}
|
||||
|
||||
::selection {
|
||||
color: var(--text);
|
||||
background-color: var(--middle);
|
||||
@ -160,12 +171,11 @@ form input:hover + label {
|
||||
}
|
||||
|
||||
form input:hover + label::before {
|
||||
background: repeating-conic-gradient(transparent 0% 25%, var(--text) 0% 50%, transparent 0% 75%, var(--text) 0% 100%)
|
||||
50% / 2px 2px;
|
||||
background: var(--bg50);
|
||||
}
|
||||
|
||||
form input:checked:hover + label::before {
|
||||
background: repeating-conic-gradient(transparent 0% 25%, var(--text) 0% 50%, var(--text) 0% 100%) 50% / 2px 2px;
|
||||
background: var(--bg75);
|
||||
}
|
||||
|
||||
ul li,
|
||||
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
src/fonts/CommitMonoV118-300Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-300Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-300Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-300Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-325Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-325Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-325Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-325Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-350Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-350Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-350Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-350Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-375Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-375Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-375Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-375Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-400Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-400Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-400Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-400Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-425Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-425Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-425Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-425Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-450Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-450Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-450Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-450Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-475Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-475Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-475Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-475Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-500Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-500Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-500Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-500Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-525Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-525Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-525Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-525Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-550Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-550Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-550Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-550Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-575Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-575Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-575Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-575Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-600Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-600Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-600Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-600Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-625Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-625Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-625Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-625Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-650Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-650Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-650Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-650Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-675Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-675Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-675Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-675Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-700Italic.otf
Normal file
BIN
src/fonts/CommitMonoV118-700Italic.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-700Regular.otf
Normal file
BIN
src/fonts/CommitMonoV118-700Regular.otf
Normal file
Binary file not shown.
BIN
src/fonts/CommitMonoV118-VF.woff2
Normal file
BIN
src/fonts/CommitMonoV118-VF.woff2
Normal file
Binary file not shown.
@ -155,7 +155,6 @@ function updateWeight(event, form) {
|
||||
if (event) event.preventDefault()
|
||||
}
|
||||
|
||||
let fontDownloadSettings = { weight: 450, italic: false, alternates: {}, features: {} }
|
||||
function updateExampleSettings(event, form) {
|
||||
console.log("updateExampleSettings")
|
||||
const data = new FormData(form)
|
||||
@ -175,7 +174,7 @@ function updateExampleSettings(event, form) {
|
||||
const label = document.querySelector(`#alt_${entry[0]}`)
|
||||
if (label) label.style.fontFeatureSettings = entry[1]
|
||||
}
|
||||
|
||||
console.log(fontDownloadSettings)
|
||||
const codeExample = document.querySelector("#code_example")
|
||||
codeExample.style.fontFeatureSettings = output.slice(0, -2)
|
||||
|
||||
|
@ -44,28 +44,6 @@ function updateNav(event, form) {
|
||||
}
|
||||
sectionNavigation(output.split("section_")[1] - 1)
|
||||
|
||||
// pageAnimation()
|
||||
|
||||
// websiteData.sections.forEach((section, index) => {
|
||||
// const sectionContainer = document.querySelector(`#section_${index + 1}`)
|
||||
// if (sectionContainer.id == output) {
|
||||
// sectionContainer.style.display = "block"
|
||||
// sectionNavigation(section.name, `Digit${index + 1}`)
|
||||
// } else {
|
||||
// sectionContainer.style.display = "none"
|
||||
// }
|
||||
// })
|
||||
// main.style.transform = `translate(0)`
|
||||
// navForm.style.transform = `translate(0)`
|
||||
// keySection.style.transform = `translate(0)`
|
||||
// websiteData.pushPage.coordinates.x = 0
|
||||
// websiteData.pushPage.coordinates.y = 0
|
||||
// websiteData.pushPage.scale = 1
|
||||
|
||||
// const sectionName = websiteData.sections[output.split("section_")[1] - 1]?.name
|
||||
// console.log("sectionNavigation from updateNav")
|
||||
// sectionNavigation(sectionName)
|
||||
|
||||
if (event) event.preventDefault()
|
||||
}
|
||||
|
||||
@ -125,9 +103,9 @@ let changeSettingTimeoutID
|
||||
let focusUsingTab = false
|
||||
function keyDown(e) {
|
||||
focusUsingTab = true
|
||||
if (e.code == "KeyE" && document.activeElement.dataset.edit == "true" && !insideTextField) enterTextField()
|
||||
if (e.code == "Enter" && document.activeElement.dataset.edit == "true" && !insideTextField) enterTextField()
|
||||
|
||||
if (!insideTextField || e.code == "KeyE") {
|
||||
if (!insideTextField || e.code == "Enter") {
|
||||
checkTutorialKeys(e)
|
||||
|
||||
const activeKey = !e.shiftKey
|
||||
@ -400,9 +378,9 @@ function checkTutorialKeys(e) {
|
||||
const keyNode = document.querySelector(`.key_code_${key}`)
|
||||
keyNode?.classList.add("pressed_key")
|
||||
}
|
||||
} else if (e.code == "KeyE") {
|
||||
} else if (e.code == "Enter") {
|
||||
if (document.activeElement.dataset.edit == "true") {
|
||||
document.querySelector(".key_code_KeyE")?.classList.add("pressed_key")
|
||||
document.querySelector(".key_code_Enter")?.classList.add("pressed_key")
|
||||
}
|
||||
} else if (e.code != "Escape") {
|
||||
const keyNode = document.querySelector(`.key_code_${key}`)
|
||||
@ -420,12 +398,8 @@ function checkTutorialKeys(e) {
|
||||
if (numnerOfTutorialKeys === numberOfPressedKeys) console.log("TUTORIAL FINISHED!!")
|
||||
}
|
||||
|
||||
function sectionNavigation(sectionIndex, fromPopstate) {
|
||||
// console.log(window.history)
|
||||
function sectionNavigation(sectionIndex) {
|
||||
const sectionName = websiteData.sections[sectionIndex]?.name
|
||||
// if (!fromPopstate) {
|
||||
// window.history.pushState({ name: sectionName }, `Go to section ${sectionName}`, `?s=${sectionName}`)
|
||||
// }
|
||||
|
||||
pageAnimation()
|
||||
|
||||
@ -451,21 +425,11 @@ function sectionNavigation(sectionIndex, fromPopstate) {
|
||||
websiteData.pushPage.scale = 1
|
||||
}
|
||||
|
||||
// function onPopState(e) {
|
||||
// if (e.state) {
|
||||
// websiteData.sections.forEach((section, index) => {
|
||||
// if (section.name === e.state.name) sectionNavigation(index, true)
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
// window.addEventListener("popstate", onPopState)
|
||||
|
||||
// when the user has scrolled manually using the keyboard the page is offset
|
||||
// so when you use your scroll wheen to scroll back up, you can't see the top
|
||||
// this little script combats that
|
||||
mainScale.addEventListener("scroll", onScroll)
|
||||
function onScroll(e) {
|
||||
console.log(e)
|
||||
const { x, y } = websiteData.pushPage.coordinates
|
||||
if (x != 0 || y != 0) {
|
||||
main.style.transform = `translate(0)`
|
||||
|
@ -9,6 +9,7 @@ const updateOptions = (event, form) => {
|
||||
}
|
||||
|
||||
let commitMonoFont
|
||||
let fontDownloadSettings = { weight: 450, italic: false, alternates: {}, features: {} }
|
||||
|
||||
async function updateCodeFont() {
|
||||
console.log("updateCodeFont")
|
||||
@ -59,18 +60,18 @@ async function downloadFont(button) {
|
||||
bolditalicDownloadSettigns.weight = 700
|
||||
bolditalicDownloadSettigns.italic = true
|
||||
|
||||
getFontBlob(regularDownloadSettigns, "Regular", button)
|
||||
getFontBlob(regularDownloadSettigns, "Regular")
|
||||
.then((resolve) => {
|
||||
fontFileBlobs.regular = resolve
|
||||
return getFontBlob(italicDownloadSettigns, "Italic", button)
|
||||
return getFontBlob(italicDownloadSettigns, "Italic")
|
||||
})
|
||||
.then((resolve) => {
|
||||
fontFileBlobs.italic = resolve
|
||||
return getFontBlob(boldDownloadSettigns, "Bold", button)
|
||||
return getFontBlob(boldDownloadSettigns, "Bold")
|
||||
})
|
||||
.then((resolve) => {
|
||||
fontFileBlobs.bold = resolve
|
||||
return getFontBlob(bolditalicDownloadSettigns, "Bold Italic", button)
|
||||
return getFontBlob(bolditalicDownloadSettigns, "Bold Italic")
|
||||
})
|
||||
.then((resolve) => {
|
||||
fontFileBlobs.bolditalic = resolve
|
||||
@ -97,7 +98,7 @@ const fontFileBlobs = {
|
||||
bold: null,
|
||||
bolditalic: null,
|
||||
}
|
||||
function getFontBlob(settings, style, button) {
|
||||
function getFontBlob(settings, style) {
|
||||
console.log("getFontBlob")
|
||||
|
||||
const fontFilePath = `/src/fonts/CommitMono${versionOfCommitMono}-${settings.weight}${
|
||||
|
@ -22,7 +22,7 @@ const websiteData = {
|
||||
"KeyD",
|
||||
"Minus",
|
||||
"Slash",
|
||||
"KeyE",
|
||||
"Enter",
|
||||
"Escape",
|
||||
],
|
||||
enableFeaturesInDocumentation: false,
|
||||
@ -35,8 +35,9 @@ const websiteData = {
|
||||
},
|
||||
{
|
||||
name: "concept",
|
||||
description:
|
||||
"The most effective font is the one you don’t notice. No super high x-height, no geometric construction, no eye-catching design and no confusing ligatures. Designed to be neutral and anonymous, Commit Mono is quietly useful.",
|
||||
description: `The most effective font is the one you don’t notice. No super high x-height, no geometric construction, no eye-catching design and no confusing ligatures. Designed to be neutral and anonymous, Commit Mono is quietly useful.
|
||||
|
||||
Tip: Press <span class="span_key">I</span> to switch between italic and regular.`,
|
||||
content: {},
|
||||
},
|
||||
{
|
||||
@ -381,6 +382,16 @@ Tip: Press <span class="span_key">R</span> to reset to default settings.`,
|
||||
description: "Slashed |OFF| or dotted |ON| zero.",
|
||||
documentationExample: "0",
|
||||
},
|
||||
{
|
||||
type: "alternate",
|
||||
name: "oblique",
|
||||
label: "oblique italic 'aefgy'",
|
||||
feature: "cv08",
|
||||
on: false,
|
||||
description:
|
||||
"Standard italic construction |OFF| or slanted version of uprights |ON| of 'aefgy'. See the difference in italic by pressing I.",
|
||||
documentationExample: "aefgy",
|
||||
},
|
||||
{
|
||||
type: "feature",
|
||||
name: "arrows",
|
||||
@ -834,10 +845,10 @@ end program capitalize
|
||||
},
|
||||
{
|
||||
languageName: "Code Font Test",
|
||||
codeExample: `Focus, then press e to edit
|
||||
codeExample: `Focus, then press ENTER to edit
|
||||
|
||||
Hello world: print("Hello, World!)
|
||||
Pangram: The quick brown fox jumps over a lazy dog
|
||||
Hello world print("Hello, World!")
|
||||
Pangram The quick brown fox jumps over a lazy dog
|
||||
Confusable chars ,. ;: |! Il1 2Z 5S 38B 0OQD
|
||||
Vertical alignment H=H x=x += -= <= >= ~= *= ^= |= %= &= ->
|
||||
ASCII !"#$%&'()*+,-./
|
||||
|
Loading…
Reference in New Issue
Block a user