eryn/erynwells.me
1
0
Fork 0
Code Issues 8 Pull requests 1 Projects Releases Packages Activity Actions

Create a monospace font family stack

Browse source
This commit is contained in:
Eryn Wells 2022-10-03 19:54:55 -07:00
parent d862251a8f
commit d0f1100682
3 changed files with 7 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

6
static/scripts/railroad.js
View file

@ -20,12 +20,12 @@ export default funcs;
export const Options = { export const Options = {
DEBUG: false, // if true, writes some debug information into attributes DEBUG: false, // if true, writes some debug information into attributes
VS: 8, // minimum vertical separation between things. For a 3px stroke, must be at least 4 VS: 11, // minimum vertical separation between things. For a 3px stroke, must be at least 4
AR: 10, // radius of arcs AR: 11, // radius of arcs
DIAGRAM_CLASS: 'railroad-diagram', // class to put on the root <svg> DIAGRAM_CLASS: 'railroad-diagram', // class to put on the root <svg>
STROKE_ODD_PIXEL_LENGTH: false, // is the stroke width an odd (1px, 3px, etc) pixel length? STROKE_ODD_PIXEL_LENGTH: false, // is the stroke width an odd (1px, 3px, etc) pixel length?
INTERNAL_ALIGNMENT: 'center', // how to align items when they have extra space. left/right/center INTERNAL_ALIGNMENT: 'center', // how to align items when they have extra space. left/right/center
CHAR_WIDTH: 8.5, // width of each monospace character. play until you find the right value for your font CHAR_WIDTH: 11, // width of each monospace character. play until you find the right value for your font
COMMENT_CHAR_WIDTH: 7, // comments are in smaller text by default COMMENT_CHAR_WIDTH: 7, // comments are in smaller text by default
}; };

6
static/styles/railroad.css
View file

@ -14,14 +14,14 @@ svg.railroad-diagram path {
} }
svg.railroad-diagram text { svg.railroad-diagram text {
font-family: var(--monospace-font-family); font-family: var(--font-family-monospace);
text-anchor: middle; text-anchor: middle;
white-space: pre; white-space: pre;
fill: var(--foreground-body-color); fill: var(--foreground-body-color);
} }
svg.railroad-diagram text.diagram-text { svg.railroad-diagram text.diagram-text {
font-size: 12px; font-size: 11px;
} }
svg.railroad-diagram text.diagram-arrow { svg.railroad-diagram text.diagram-arrow {
@ -33,7 +33,7 @@ svg.railroad-diagram text.label {
} }
svg.railroad-diagram text.comment { svg.railroad-diagram text.comment {
font: italic 12px monospace; font: italic 12px var(--font-family-monospace);
} }
svg.railroad-diagram g.non-terminal text { svg.railroad-diagram g.non-terminal text {

1
static/styles/root.css
View file

@ -24,6 +24,7 @@
--header-box-shadow-color: var(--box-shadow-color); --header-box-shadow-color: var(--box-shadow-color);
--font-family-body: Verdana, Helvetica, sans-serif; --font-family-body: Verdana, Helvetica, sans-serif;
--font-family-monospace: monospace;
--font-family-heading: Museo_Slab, Tahoma, sans-serif; --font-family-heading: Museo_Slab, Tahoma, sans-serif;
--font-family-site-heading: /*Krungthep,*/ Museo_Slab, Tahoma, sans-serif; --font-family-site-heading: /*Krungthep,*/ Museo_Slab, Tahoma, sans-serif;
--font-size-min: 7px; --font-size-min: 7px;