Markup
(.) This project combines a format specification, markup syntax, JavaScript tool, and live playground site to produce Monotext. Monotext describes monospace plain text typeset in a specific style following the conventions of typesetting using a typewriter. (For details, see the Monotext Specification page) (%)Tool (.) The tool runs client-side and processes data on device. It receives the text in the Markup field, typesets it, and shows the result in the output areas. The view menu toggles the displayed areas. For easiest use of the tool, view this page in a large window. (%)Markup (.)This intro text provides an overview of the plain text syntax to marks up copy for typesetting. It covers the markup tags, what they do, and how to use each to set type. The main tags in Monotext begin new blocks within a document. They appear at the start of a new line, and tell the tool how to handle the next block of content. All blocks continue until the next block tag occurs. To try the tool, you can edit text in the markup field as you read. For some example use-cases afterwards, see the templates button. (%)Comments (.)A line starting with the "(/)" tag begins a comment block. Comment blocks get stripped from the Monotext output. They help keep related notes and content together in a document. (/) - [X] Tell reader about the comment block (/) Next comes an optional document 'settings' block. This block holds key value pairs. The pairs can instruct the tool and override its defaults. (?)// Any text after '// ' on a line forms a comment. w= 64// Set the characters width per line. (32-96) Default 64. g= 1// Sets how many empty lines separate blocks. (0-3). i= 2// Sets how many spaces equal one indent. (2-8) Default: 2. (%)Stamps (.) The stamps block holds key value pairs to use in a document. The tool reads the stamps block and omits it from the output. (=)// Any text after '// ' on a line forms a comment. name= Monotext start= 2024-08-06 version= 2025-08-05 (.)The header below uses a stamp by referencing its name. ('=C*)(name=@): An Overview (%)Parts (.) The part block structures and groups a document's content. The block tag without settings makes a top level part "(%)". The tag settings area accepts 0-9 to set the part's level. Each part can group blocks or subparts one level higher. A part will end when a new part has an equal or lesser level. Text after the block tag names the part: "(%) Part Name". (%)Headers (')Normal Header (')Long headers automatically wrap to new narrower lines to keep a centered appearance (')Header With Manual Line Breaks ('=-)Header on a line // add setting to tag. options =-_.* ('=r)Header right // Alignment via: l left, c center, r right ('=l*)Mix left + underlined ('=C)Uppercase Header // via an uppercase alignment character L C R (%)Text in a Line (*)Text in a line // default line "-", default alignment "C" (*=l)Aligned left // options [l,r,c,L,R,C] (*=r)Aligned right (*=R)Uppercase & right // tag uses uppercase R (*=*)Text in a custom line // custom character options [=,-,_,.,*] (*=_)Text in a custom line (*=.)Text in a custom line (*==)Text in a custom line (%)Divider Lines (*)// default style '-' (*)= (*)_ (*). (*)* (.)For spaced dividers, type a symbol twice and put spaces between. (*)- - (*)* * (%)Text (%=1)Paragraph Styles (%=2) Web Style (.)Touching lines of text within this tag block merge to one line. The line will then wrap to fit if it exceeds the page width. Any empty lines between text lines in the input split paragraphs. The output places one empty line between paragraphs. (%=2) Indented First Line Style (.=i) An 'i' in the paragraph block tag makes traditional paragraphs. The tool joins touching lines of text in the input. It then wraps any line exceeding the page width until it fits. Any empty lines between text lines in the input split paragraphs. The output starts each paragraph on a new indented line. (%=1)Paragraph Margins (.)Add a number to the paragraph block tag to set a side margin. Margins apply to both sides of all paragraphs in the block. Margins can span 0-9 indents, and default to 0 if unspecified. (.=0)Margin 0 + left aligned text // default (.=1)Margin 1 + left aligned text (.=2)Margin 2 + left aligned text (.=3)Margin 3 + left aligned text (.=r0)Margin 0 + right aligned text// default (.=r1)Margin 1 + right aligned text (.=r2)Margin 2 + right aligned text (.=r3)Margin 3 + right aligned text (.)The paragraphs block tag allows combining available options. The following block shows all options in use at once. (.=C3)A paragraph with margins and centrally aligned uppercase text. (%=1)Text Alignment and Case (.)The tag for a paragraphs block can set the case and text alignment for all paragraphs in the block. (.=l)Left (Default) (.=L)Left Upper Case (.=c)Central (.=C)Central Upper Case (.=r)Right (.=R)Right Upper Case (')Justified: (.=j)Flap jacks lemon meringue pie dark chocolate raspberry jam cake cupcake chocolate fudge cake. Chocolate sprinkles triple chocolate chip cookie lemon bonbon chocolate cake bun hazelnut chocolate spread sugar cubes caramel rock buns cardamon cake chocolate orange muffin custard tart cinnamon bun chocolate fudge brownie. (')Justified Upper Case: (.=J)Lemon drops rocky road chocolate sauce shortbread syrup apple cake ice cream chocolate bar birthday cake with icing caramel fudge ice cream double double chocolate cardamon cake. Melted chocolate flap jacks rock buns pecan pie cheesecake chocolate fudge cake. (')To sentence case (.=s)// s === to sentence case the text block has an optional 'sentence case' flag. when enabled, the tool targets the first letter of each sentence, and converts it to a capital where needed. the flag preserves any capitals already in the markup. (it works for new sentences within parentheses too). (%)Code (;) To preserve manual text formatting, use the code block. The code block preserves all line breaks and spaces from the first line with a visible character, until end of the last line with a visible character. It preserves leading spaces and mid line spaces The tool will wrap text lines in a code block if they exceed the page width of the output format. (%)Verbs (-) - Inline tokens wrap in parentheses: -- A range of text to target. --- Place an equals sign after its last visible character. -- One or more instructions for what to do with the text. - Verbs: -- (mark=!) -- (stress=$) -- (Link=www.example.com) -- (Note=Block notes appear at the end of a block. This keeps them nearer to the related text.) --- If a footnote contains commas, wrap it in quotes. -- Stamp: "(name=@)" (reference a variable) - Advanced -- (Mix=!,$,By comma separating each verb) -- (Mix and (nest=$) tokens=!,(Nested tokens=A footnote shouldn't have its own footnotes.) work (in both sides=$) of a token.) - Notes -- Tokens can appear mid word: ba(na=!)na -- Comment // Text following '// ' forms an end of line comment - Other -- When converting to HTML, the tool makes bare URLs clickable. --- www.example.com (%)Lists (-) - A line starting with '- ' begins a list item. -- Add another dash to indent a list item one level more. -- Long list item lines auto wrap to new lines, and each new line indents to align with the first line of the same list item. - Touching lines of text within this a list item merge to one line. The line then wraps to fit, if it exceeds the page width. - One or more empty lines between text lines in a list item makes a list item with paragraphs. The output places one empty line between paragraphs. (.) Slim markup, same output (-=0) // Add a '0' to the block tag settings to write lists this way. 0 This markup style omits dashes and indents. 0 Start a line with a digit and a space to make a new list item. 1 The digit sets the item's depth level in the list. 2 Top level list items start with '0 '. 1 The space after the digit ends the depth setting. 1 Any text after the space forms the item's value. 0 In the markup: 1 List items at all levels receive equal line width. 1 When an item's depth changes, the item stays still. 2 This can make file version comparisons easier. 0 After a list item, the level of the next may: 1 Increase by one, to form a child item. 1 Stay the same, to form a sibling item. 1 Have any lower value, to form a parent or ancestor item. 0 The markup also allows multi paragraph values. The tool separates paragraphs in list items with one blank line. (%)Pairs (.) The pairs block holds key value pairs. A pair looks like "key name= value". Each key starts on a new line. Keys can start with: A-Z a-z '_' or '$'. Keys over 2 characters long may contain spaces in the middle. Keys end with a visible character touching an equals sign. Using equals as a delimiter has two benefits over ": ": It requires no shift key to type, and it allows using ': ' freely within multi line values. To include '=' in a key, escape it with a backslash '\=' The value may starts after the equals on the same or next line. Values may span one or multiple lines or have no content at all. (%=1) Basic pairs (:) key1= value1 key2= value2 (:=rl) Character 1= Alignment and case for key Character 2= Alignment and case for value l= Align left. case preserved L= Align left. make upper case r= Align right. case preserved R= Align right. make upper case (:=Rl) Long values= A pair's value will fill the available width then wrap to a new line. Key= Values may contain line breaks and multi line data. The tool joins touching lines then wraps them. It preserves up to 1 blank line between content lines. (%=1)Dot pairs (.)Dot pairs align keys left and values right with dots between. This style works for single-line key value pairs. Include a '.' in the block tag settings for this block style. (:=lr.) L= Make left uppercase l= Preserve case of left R= Make right uppercase r= Preserve case of right (:=.) Use cases= Chapter= Page Number Person= Phone Number Character= Actor Post Title=YYYY-MM-DD YYYY-MM-DD= Post title (:=.) Blank values= For form fields= (.) Dot pairs rely on the key and value fitting on one line. If a block pair value includes a newline, the tool outputs a different format. (:=.) handle= a multi paragraph value key 2= value (%=1)Definition pairs (.)For term and definition pairs, add a "d" to the block tag. Add blank lines to a definition to split it into paragraphs. (:=d)// example 1 Term1=Definition1 Term2=Definition2 Term3=Definition3 (:=d)// example 2 First Name: www.example.com= // HTML output converts raw links Illustration and Design Tags: vector, raster First Last: www.example.com= Graphics and Typography Tags: print, publishing (%)Tables (.)(Under construction=$) This block takes records of key value pairs. See the pairs block for the basics markup for pairs. Separate each record in a table with '()'. (%=1)Record per row (+)// You can name the table before starting the first record: Optional Table Name Keys= The tool considers two keys the same if they match when converted to lower case. It treats 'KEY1', 'Key1' and 'key1' as the same key. Key Order= The tool sorts each record's keys to match the order they appear in the first record. Alignment(r)= Add "(l)" "(c)" or "(r)" to a key to manually align its value. Otherwise, The table auto-aligns numbers right, and strings left. Values= Cell values may include line breaks. The tool preserves up to one blank line between lines. ()// next record Keys(l)= The first time a key occurs in a table sets its display case. e.g. 'KEY1', 'Key1' or 'key1'. Alignment(l)= If the first record doesn't say how to align a key, the tool checks each next record for an instruction until it finds one or reaches the end. Values(c)= Each line in a cell's value wraps to fit the cell width. The tool hyphenates words too long to fit on a line. () Alignment(r)= The tool obeys the first alignment tag it finds per key and ignores later instructions. Keys= The tool handles when keys appear in some but not all records. Values=For a blank cell, enter no value. Omitting the key for a record has the same effect. (%=1)Record per columns (.)For comparing data side by side. Place an 'x' in the table block tag to transpose the table. (+=x) Flipped Table Record(r)= 1 // '(r)' aligns the values not the header. About(c)= Wrapping Note(l)= Long inputs wrap over the amount of lines needed. () About= Columns Record= 2 Note= Columns grow to at least the width of their longest word. Cells may contain line breaks. () About= Max width Record= 3 Note= None (%=1)Auto-align table cells (.) The tool inspects any table property without an alignment instruction. If every record holds a number-like value for the property, it aligns the property cells right. If not it keeps the cells aligned left. (+) Auto-Align text=red whole=1 decimals=3.14 commas=1,000 money=$9.99 () text=blue whole=2 decimals=1.3 commas=8,000.30 money=$20.20 () text=yellow whole=3 decimals=1.4142 commas=-1,000.20 money=-$30.30 (%=1)CSV Tables (Comma Separated Values) (+=,x)// <- Transposed Market(c),Net Qty,Period(c)// test Home Sales,100,Q4 Export Sales,200,Q4 Book Clubs,50,Q4 Total,350,Q4 (+=,) Optional Table Title ()// A line containing '()' must follow any table title in CSVs Market,Net Qty(),Period(r)// test Home Sales,100,Q4 Export Sales,200,Q4 (+=,) Cell values with commas () Number(r),Title(l) 0,Allows Commas in values: 1,"The Good, the Bad and the Ugly" 2,Allows Quotes in values: 3,"""The Lion, the Witch and the Wardrobe""" (%)Columns (.) Minimum: 2. Maximum: 3. '()' Starts next column. (%=1)Two Columns (&)Column 1()Column 2 (&) TO NAME Street, Town, City () From NAME Street, Town, City (.)Optionally instruct custom alignment for all columns (&=l)Column 1()Column 2 (&=c)Column 1()Column 2 (&=r)Column 1()Column 2 (.)Optionally instruct custom alignment per column. (&=rl)Column 1()Column 2 (%=1)Three Columns (&)3 Columns()On 1 Line()Default alignment (&=l)Align()all()left (&=c)Align()all()center (&=r)Align()all()right (&=rcl)Align()each()custom (.)Allow blank columns (&=l)()Column 2()Column 3 (&=l)Column 1()()Column 3 (&=l)Column 1()Column 2() (&=r)Allow()() (&) A column line will wrap if the content exceeds the column width. () You can also choose where to break lines. () The tool preserves blank lines. (%) More (%=1)Boxes (!)A simple untitled box (!)Box with Title()Box text (!) A long box title will wrap to new lines if it can't fit on one line() A box resizes based on its content. It shrinks with little, grows with lots, and wraps any lines exceeding the box's maximum width over multiple lines. A box preserves empty lines. (%=1)Gaps (.)Add one or more blank lines ( )// One blank line (.)Some: ( =5)// N blank lines
1 note
HTMLMonotext