├── src ├── other_section │ └── index.md ├── index.md ├── syntax │ └── index.md └── style.css ├── dst ├── other_section │ └── index.html ├── index.html ├── style.css └── syntax │ └── index.html ├── README.md ├── LICENSE └── mowgli.py /src/other_section/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | pagetitle: Other Section 3 | --- 4 | 5 | ### Mowgli 6 | 7 | #### [Home](../index.html) | [Syntax](../syntax/index.html) | Other Section 8 | 9 | Other Section 10 | ============= 11 | 12 | # 🐍 👀 13 | -------------------------------------------------------------------------------- /dst/other_section/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Other Section 5 | 6 | 7 | 8 | 9 | 10 | 11 |

Mowgli

12 |

Home | Syntax | Other Section

13 |

Other Section

14 |

🐍 👀

15 | 16 | 17 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Mowgli 2 | Generate a static website from Markdown files with <150 lines of Python 3 | 4 | ## My Own Website Generator Light and Intuitive 5 | 6 | #### Idea 7 | 8 | - only one file with < 150 lines of Python 9 | - copy `src/` into `dst/` 10 | - convert `.md` into `.html` along the way 11 | 12 | #### Installation 13 | 14 | pip3 install markdown 15 | 16 | #### Usage 17 | 18 | python3 mowgli.py 19 | usage: mowgli.py [-h] [-c] [-m] 20 | 21 | optional arguments: 22 | -h, --help show this help message and exit 23 | -c, --clean clean web site 24 | -m, --make make web site 25 | 26 | #### File upload 27 | 28 | Mowgli plays well with [kaa.py](https://gist.github.com/nst/6703da0b26f796fd2429310c7dda13cf) for FTP upload. 29 | -------------------------------------------------------------------------------- /src/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | pagetitle: Mowgli 3 | ... 4 | 5 | ### Mowgli 6 | 7 | #### About | [Syntax](syntax/index.html) | [Other Section](other_section/index.html) 8 | 9 | ## My Own Website Generator Light and Intuitive 10 | 11 | #### Repository 12 | 13 | [https://github.com/nst/Mowgli](https://github.com/nst/Mowgli) 14 | 15 | #### Idea 16 | 17 | - only one file with < 150 lines of Python 18 | - copy src/ into dst/ 19 | - convert .md into .html along the way 20 | 21 | #### Installation 22 | 23 | pip3 install markdown 24 | 25 | #### Usage 26 | 27 | python3 mowgli.py 28 | usage: mowgli.py [-h] [-c] [-m] 29 | 30 | optional arguments: 31 | -h, --help show this help message and exit 32 | -c, --clean clean web site 33 | -m, --make make web site 34 | -------------------------------------------------------------------------------- /dst/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Mowgli 5 | 6 | 7 | 8 | 9 | 10 | 11 |

Mowgli

12 |

About | Syntax | Other Section

13 |

My Own Website Generator Light and Intuitive

14 |

Repository

15 |

https://github.com/nst/Mowgli

16 |

Idea

17 | 22 |

Installation

23 | 
pip3 install markdown
24 |
25 |

Usage

26 | 
python3 mowgli.py 
27 | usage: mowgli.py [-h] [-c] [-m]
28 | 
29 | optional arguments:
30 |   -h, --help   show this help message and exit
31 |   -c, --clean  clean web site
32 |   -m, --make   make web site
33 |
34 | 35 | 36 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 Nicolas Seriot 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /mowgli.py: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env python3 2 | 3 | # Nicolas Seriot 4 | # 2021-09-17 5 | # https://github.com/nst/Mowgli 6 | # My Own Website Generator Light and Intuitive 7 | 8 | # Copy src/ into dst/ 9 | # Convert .md into .html along the way 10 | 11 | import os 12 | import sys 13 | import shutil 14 | import argparse 15 | import markdown 16 | from string import Template 17 | from datetime import datetime 18 | 19 | template = """ 20 | 21 | 22 | $pagetitle 23 | 24 | $extraheader 25 | 26 | 27 | 28 | 29 | $body 30 | 31 | 32 | """ 33 | 34 | def clean(): 35 | 36 | print("clean dst") 37 | 38 | s = datetime.now().strftime("%Y%m%d%H%M%S") 39 | dst_dir = os.path.expanduser("~/.Trash/%s" % s) 40 | os.mkdir(dst_dir) 41 | 42 | for file_name in os.listdir("dst"): 43 | shutil.move(os.path.join("dst", file_name), dst_dir) 44 | 45 | def make(): 46 | 47 | if not os.path.isdir("src"): 48 | os.mkdir("src") 49 | 50 | if not os.path.isdir("dst"): 51 | os.mkdir("dst") 52 | 53 | md = markdown.Markdown(extensions=["tables", "meta"]) 54 | 55 | for root, dirnames, filenames in os.walk('src'): 56 | 57 | print("\nroot:", root, "\ndirnames:", dirnames, "\nfilenames", filenames) 58 | 59 | short_root = os.path.relpath(root, 'src') 60 | 61 | dst_root = os.path.join("dst", short_root) 62 | 63 | levels_count = root.count("/") 64 | file_path = "../" * levels_count 65 | 66 | if not os.path.isdir(dst_root): 67 | os.mkdir(dst_root) 68 | print("** create", dst_root) 69 | 70 | for f in filenames: 71 | 72 | if f.startswith('.'): 73 | print(f"-- skip {f}") 74 | continue 75 | 76 | _, ext = os.path.splitext(f) 77 | 78 | is_md = ext == ".md" 79 | 80 | src = os.path.join(root, f) 81 | dst = None 82 | 83 | if is_md: 84 | html_file_name = os.path.splitext(f)[0]+'.html' 85 | dst = os.path.sep.join(["dst", short_root, html_file_name]) 86 | else: 87 | dst = os.path.join("dst", short_root, f) 88 | 89 | if os.path.exists(dst): 90 | 91 | ts_src = os.path.getmtime(src) 92 | ts_dst = os.path.getmtime(dst) 93 | 94 | if ts_dst >= ts_src: 95 | print(" skip", dst) 96 | continue # file is up to date 97 | 98 | if is_md: 99 | 100 | print(f"-- convert {src} -> {dst}") 101 | 102 | with open(src) as f: 103 | s = f.read() 104 | 105 | css = file_path + "style.css" 106 | body = md.convert(s) 107 | 108 | print(md.Meta) 109 | if "pagetitle" not in md.Meta: 110 | print(f"-- Error: page '{src}' lacks 'pagetitle' metadata") 111 | sys.exit(1) 112 | 113 | pagetitle = md.Meta["pagetitle"].pop() 114 | extraheader = md.Meta.get("extraheader", None) 115 | 116 | h = extraheader.pop() if extraheader else "" 117 | 118 | t = Template(template) 119 | html_doc = t.substitute(pagetitle=pagetitle, 120 | css=css, 121 | extraheader=h, 122 | body=body) 123 | 124 | with open(dst, "w") as f: 125 | f.write(html_doc) 126 | 127 | else: 128 | print(f"-- copy {f}") 129 | shutil.copy2(src, dst) 130 | 131 | if __name__ == "__main__": 132 | 133 | parser = argparse.ArgumentParser() 134 | parser.add_argument("-c", "--clean", action='store_true', help="clean web site") 135 | parser.add_argument("-m", "--make", action='store_true', help="make web site") 136 | 137 | args = parser.parse_args() 138 | 139 | if len(sys.argv) == 1: 140 | parser.print_help(sys.stderr) 141 | sys.exit(1) 142 | 143 | if args.clean: 144 | clean() 145 | 146 | if args.make: 147 | make() 148 | -------------------------------------------------------------------------------- /src/syntax/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | pagetitle: Syntax 3 | --- 4 | 5 | ### Mowgli 6 | 7 | #### [Home](../index.html) | Syntax | [Section 2](../other_section/index.html) 8 | 9 | Synatax 10 | ======= 11 | 12 | # h1 Heading 8-) 13 | ## h2 Heading 14 | ### h3 Heading 15 | #### h4 Heading 16 | ##### h5 Heading 17 | ###### h6 Heading 18 | 19 | 20 | ## Horizontal Rules 21 | 22 | ___ 23 | 24 | --- 25 | 26 | *** 27 | 28 | 29 | ## Typographic replacements 30 | 31 | Enable typographer option to see result. 32 | 33 | (c) (C) (r) (R) (tm) (TM) (p) (P) +- 34 | 35 | test.. test... test..... test?..... test!.... 36 | 37 | !!!!!! ???? ,, -- --- 38 | 39 | "Smartypants, double quotes" and 'single quotes' 40 | 41 | 42 | ## Emphasis 43 | 44 | **This is bold text** 45 | 46 | __This is bold text__ 47 | 48 | *This is italic text* 49 | 50 | _This is italic text_ 51 | 52 | ~~Strikethrough~~ 53 | 54 | 55 | ## Blockquotes 56 | 57 | 58 | > Blockquotes can also be nested... 59 | >> ...by using additional greater-than signs right next to each other... 60 | > > > ...or with spaces between arrows. 61 | 62 | 63 | ## Lists 64 | 65 | Unordered 66 | 67 | + Create a list by starting a line with `+`, `-`, or `*` 68 | + Sub-lists are made by indenting 2 spaces: 69 | - Marker character change forces new list start: 70 | * Ac tristique libero volutpat at 71 | + Facilisis in pretium nisl aliquet 72 | - Nulla volutpat aliquam velit 73 | + Very easy! 74 | 75 | Ordered 76 | 77 | 1. Lorem ipsum dolor sit amet 78 | 2. Consectetur adipiscing elit 79 | 3. Integer molestie lorem at massa 80 | 81 | 82 | 1. You can use sequential numbers... 83 | 1. ...or keep all the numbers as `1.` 84 | 85 | Start numbering with offset: 86 | 87 | 57. foo 88 | 1. bar 89 | 90 | 91 | ## Code 92 | 93 | Inline `code` 94 | 95 | Indented code 96 | 97 | // Some comments 98 | line 1 of code 99 | line 2 of code 100 | line 3 of code 101 | 102 | 103 | Block code "fences" 104 | 105 | ``` 106 | Sample text here... 107 | ``` 108 | 109 | Syntax highlighting 110 | 111 | ``` js 112 | var foo = function (bar) { 113 | return bar++; 114 | }; 115 | 116 | console.log(foo(5)); 117 | ``` 118 | 119 | ## Tables 120 | 121 | | Option | Description | 122 | | ------ | ----------- | 123 | | data | path to data files to supply the data that will be passed into templates. | 124 | | engine | engine to be used for processing templates. Handlebars is the default. | 125 | | ext | extension to be used for dest files. | 126 | 127 | Right aligned columns 128 | 129 | | Option | Description | 130 | | ------:| -----------:| 131 | | data | path to data files to supply the data that will be passed into templates. | 132 | | engine | engine to be used for processing templates. Handlebars is the default. | 133 | | ext | extension to be used for dest files. | 134 | 135 | 136 | ## Links 137 | 138 | [link text](http://dev.nodeca.com) 139 | 140 | [link with title](http://nodeca.github.io/pica/demo/ "title text!") 141 | 142 | Autoconverted link https://github.com/nodeca/pica (enable linkify to see) 143 | 144 | 145 | ## Images 146 | 147 | ![Minion](https://octodex.github.com/images/minion.png) 148 | ![Stormtroopocat](https://octodex.github.com/images/stormtroopocat.jpg "The Stormtroopocat") 149 | 150 | Like links, Images also have a footnote style syntax 151 | 152 | ![Alt text][id] 153 | 154 | With a reference later in the document defining the URL location: 155 | 156 | [id]: https://octodex.github.com/images/dojocat.jpg "The Dojocat" 157 | 158 | 159 | ## Plugins 160 | 161 | The killer feature of `markdown-it` is very effective support of 162 | [syntax plugins](https://www.npmjs.org/browse/keyword/markdown-it-plugin). 163 | 164 | 165 | ### [Emojies](https://github.com/markdown-it/markdown-it-emoji) 166 | 167 | > Classic markup: :wink: :crush: :cry: :tear: :laughing: :yum: 168 | > 169 | > Shortcuts (emoticons): :-) :-( 8-) ;) 170 | 171 | see [how to change output](https://github.com/markdown-it/markdown-it-emoji#change-output) with twemoji. 172 | 173 | 174 | ### [Subscript](https://github.com/markdown-it/markdown-it-sub) / [Superscript](https://github.com/markdown-it/markdown-it-sup) 175 | 176 | - 19^th^ 177 | - H~2~O 178 | 179 | 180 | ### [\](https://github.com/markdown-it/markdown-it-ins) 181 | 182 | ++Inserted text++ 183 | 184 | 185 | ### [\](https://github.com/markdown-it/markdown-it-mark) 186 | 187 | ==Marked text== 188 | 189 | 190 | ### [Footnotes](https://github.com/markdown-it/markdown-it-footnote) 191 | 192 | Footnote 1 link[^first]. 193 | 194 | Footnote 2 link[^second]. 195 | 196 | Inline footnote^[Text of inline footnote] definition. 197 | 198 | Duplicated footnote reference[^second]. 199 | 200 | [^first]: Footnote **can have markup** 201 | 202 | and multiple paragraphs. 203 | 204 | [^second]: Footnote text. 205 | 206 | 207 | ### [Definition lists](https://github.com/markdown-it/markdown-it-deflist) 208 | 209 | Term 1 210 | 211 | : Definition 1 212 | with lazy continuation. 213 | 214 | Term 2 with *inline markup* 215 | 216 | : Definition 2 217 | 218 | { some code, part of Definition 2 } 219 | 220 | Third paragraph of definition 2. 221 | 222 | _Compact style:_ 223 | 224 | Term 1 225 | ~ Definition 1 226 | 227 | Term 2 228 | ~ Definition 2a 229 | ~ Definition 2b 230 | 231 | 232 | ### [Abbreviations](https://github.com/markdown-it/markdown-it-abbr) 233 | 234 | This is HTML abbreviation example. 235 | 236 | It converts "HTML", but keep intact partial entries like "xxxHTMLyyy" and so on. 237 | 238 | *[HTML]: Hyper Text Markup Language 239 | 240 | ### [Custom containers](https://github.com/markdown-it/markdown-it-container) 241 | 242 | ::: warning 243 | *here be dragons* 244 | ::: 245 | -------------------------------------------------------------------------------- /dst/style.css: -------------------------------------------------------------------------------- 1 | /* seriot.ch */ 2 | 3 | html { 4 | font-size: 100%; 5 | overflow-y: scroll; 6 | -ms-text-size-adjust: 100%; 7 | } 8 | 9 | body { 10 | color: #222; 11 | font-family: Verdana, serif; 12 | font-size: 14px; 13 | line-height: 1.2; 14 | padding: 1em; 15 | margin: auto; 16 | max-width: 48em; 17 | background: #fefefe; 18 | } 19 | 20 | /* https://www.color-hex.com/color-palette/113383 */ 21 | 22 | a { 23 | color: #5646ff; 24 | text-decoration: none; 25 | } 26 | 27 | a:visited { 28 | color: #3a10a3; 29 | } 30 | 31 | a:hover { 32 | color: #5646ff; 33 | text-decoration: underline; 34 | } 35 | 36 | a:active { 37 | color: #fdbf00; 38 | text-decoration: underline; 39 | } 40 | 41 | a:focus { 42 | outline: thin dotted; 43 | } 44 | 45 | *::-moz-selection { 46 | background: rgba(255, 255, 0, 0.3); 47 | color: #000; 48 | } 49 | 50 | *::selection { 51 | background: rgba(255, 255, 0, 0.3); 52 | color: #000; 53 | } 54 | 55 | a::-moz-selection { 56 | background: rgba(255, 255, 0, 0.3); 57 | color: #0645ad; 58 | } 59 | 60 | a::selection { 61 | background: rgba(255, 255, 0, 0.3); 62 | color: #0645ad; 63 | } 64 | 65 | p { 66 | margin: 1em 0; 67 | } 68 | 69 | img { 70 | max-width: 100%; 71 | } 72 | 73 | h1, h2, h3, h4, h5, h6 { 74 | font-family: Georgia, Palatino, 'Palatino Linotype', Times, 'Times New Roman', serif; 75 | color: #111; 76 | line-height: 125%; 77 | /* margin-top: 2em; */ 78 | font-weight: normal; 79 | } 80 | 81 | h4, h5, h6 { 82 | font-weight: bold; 83 | } 84 | 85 | h1 { 86 | font-size: 2.5em; 87 | } 88 | 89 | h2 { 90 | font-size: 2em; 91 | } 92 | 93 | h3 { 94 | font-size: 1.5em; 95 | } 96 | 97 | h4 { 98 | font-size: 1.2em; 99 | } 100 | 101 | h5 { 102 | font-size: 1em; 103 | } 104 | 105 | h6 { 106 | font-size: 0.9em; 107 | } 108 | 109 | blockquote { 110 | color: #666666; 111 | margin: 0; 112 | padding-left: 3em; 113 | border-left: 0.5em #EEE solid; 114 | } 115 | 116 | hr { 117 | display: block; 118 | height: 2px; 119 | border: 0; 120 | border-top: 1px solid #aaa; 121 | border-bottom: 1px solid #eee; 122 | margin: 1em 0; 123 | padding: 0; 124 | } 125 | 126 | pre, code, kbd, samp { 127 | color: #000; 128 | background-color: #eee; 129 | border-radius: 3px; 130 | font-family: monospace, monospace; 131 | _font-family: 'courier new', monospace; 132 | font-size: 0.98em; 133 | } 134 | 135 | pre { 136 | white-space: pre; 137 | white-space: pre-wrap; 138 | word-wrap: break-word; 139 | } 140 | 141 | b, strong { 142 | font-weight: bold; 143 | } 144 | 145 | dfn { 146 | font-style: italic; 147 | } 148 | 149 | ins { 150 | background: #ff9; 151 | color: #000; 152 | text-decoration: none; 153 | } 154 | 155 | mark { 156 | background: #ff0; 157 | color: #000; 158 | font-style: italic; 159 | font-weight: bold; 160 | } 161 | 162 | sub, sup { 163 | font-size: 75%; 164 | line-height: 0; 165 | position: relative; 166 | vertical-align: baseline; 167 | } 168 | 169 | sup { 170 | top: -0.5em; 171 | } 172 | 173 | sub { 174 | bottom: -0.25em; 175 | } 176 | 177 | ul, ol { 178 | margin: 1em 0; 179 | padding: 0 0 0 2em; 180 | } 181 | 182 | li p:last-child { 183 | margin-bottom: 0; 184 | } 185 | 186 | ul ul, ol ol { 187 | margin: .3em 0; 188 | } 189 | 190 | dl { 191 | margin-bottom: 1em; 192 | } 193 | 194 | dt { 195 | font-weight: bold; 196 | margin-bottom: .8em; 197 | } 198 | 199 | dd { 200 | margin: 0 0 .8em 2em; 201 | } 202 | 203 | dd:last-child { 204 | margin-bottom: 0; 205 | } 206 | 207 | img { 208 | border: 0; 209 | -ms-interpolation-mode: bicubic; 210 | vertical-align: middle; 211 | } 212 | 213 | figure { 214 | display: block; 215 | text-align: center; 216 | margin: 1em 0; 217 | } 218 | 219 | figure img { 220 | border: none; 221 | margin: 0 auto; 222 | } 223 | 224 | figcaption { 225 | font-size: 0.8em; 226 | font-style: italic; 227 | margin: 0 0 .8em; 228 | } 229 | 230 | table { 231 | margin-bottom: 1em; 232 | border-bottom: 1px solid #ddd; 233 | border-right: 1px solid #ddd; 234 | border-spacing: 0; 235 | border-collapse: collapse; 236 | } 237 | 238 | table th { 239 | padding: .2em 1em; 240 | background-color: #eee; 241 | border-top: 1px solid #ddd; 242 | border-left: 1px solid #ddd; 243 | } 244 | 245 | table td { 246 | padding: .1em 1em; 247 | border-top: 1px solid #ddd; 248 | border-left: 1px solid #ddd; 249 | vertical-align: top; 250 | } 251 | 252 | .author { 253 | font-size: 1.2em; 254 | text-align: center; 255 | } 256 | /* 257 | @media only screen and (min-width: 480px) { 258 | body { 259 | font-size: 14px; 260 | } 261 | } 262 | 263 | @media only screen and (min-width: 768px) { 264 | body { 265 | font-size: 16px; 266 | } 267 | } 268 | */ 269 | @media print { 270 | * { 271 | background: transparent !important; 272 | color: black !important; 273 | filter: none !important; 274 | -ms-filter: none !important; 275 | } 276 | 277 | body { 278 | font-size: 11pt; 279 | max-width: 100%; 280 | } 281 | 282 | a, a:visited { 283 | text-decoration: underline; 284 | } 285 | 286 | hr { 287 | height: 1px; 288 | border: 0; 289 | border-bottom: 1px solid black; 290 | } 291 | 292 | a[href]:after { 293 | content: " (" attr(href) ")"; 294 | } 295 | 296 | abbr[title]:after { 297 | content: " (" attr(title) ")"; 298 | } 299 | 300 | .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { 301 | content: ""; 302 | } 303 | 304 | pre, blockquote { 305 | border: 1px solid #999; 306 | padding-right: 1em; 307 | page-break-inside: avoid; 308 | } 309 | 310 | tr, img { 311 | page-break-inside: avoid; 312 | } 313 | 314 | img { 315 | max-width: 100% !important; 316 | } 317 | 318 | @page :left { 319 | margin: 15mm 20mm 15mm 10mm; 320 | } 321 | 322 | @page :right { 323 | margin: 15mm 10mm 15mm 20mm; 324 | } 325 | 326 | p, h2, h3 { 327 | orphans: 3; 328 | widows: 3; 329 | } 330 | 331 | h2, h3 { 332 | page-break-after: avoid; 333 | } 334 | } 335 | -------------------------------------------------------------------------------- /src/style.css: -------------------------------------------------------------------------------- 1 | /* seriot.ch */ 2 | 3 | html { 4 | font-size: 100%; 5 | overflow-y: scroll; 6 | -ms-text-size-adjust: 100%; 7 | } 8 | 9 | body { 10 | color: #222; 11 | font-family: Verdana, serif; 12 | font-size: 14px; 13 | line-height: 1.2; 14 | padding: 1em; 15 | margin: auto; 16 | max-width: 48em; 17 | background: #fefefe; 18 | } 19 | 20 | /* https://www.color-hex.com/color-palette/113383 */ 21 | 22 | a { 23 | color: #5646ff; 24 | text-decoration: none; 25 | } 26 | 27 | a:visited { 28 | color: #3a10a3; 29 | } 30 | 31 | a:hover { 32 | color: #5646ff; 33 | text-decoration: underline; 34 | } 35 | 36 | a:active { 37 | color: #fdbf00; 38 | text-decoration: underline; 39 | } 40 | 41 | a:focus { 42 | outline: thin dotted; 43 | } 44 | 45 | *::-moz-selection { 46 | background: rgba(255, 255, 0, 0.3); 47 | color: #000; 48 | } 49 | 50 | *::selection { 51 | background: rgba(255, 255, 0, 0.3); 52 | color: #000; 53 | } 54 | 55 | a::-moz-selection { 56 | background: rgba(255, 255, 0, 0.3); 57 | color: #0645ad; 58 | } 59 | 60 | a::selection { 61 | background: rgba(255, 255, 0, 0.3); 62 | color: #0645ad; 63 | } 64 | 65 | p { 66 | margin: 1em 0; 67 | } 68 | 69 | img { 70 | max-width: 100%; 71 | } 72 | 73 | h1, h2, h3, h4, h5, h6 { 74 | font-family: Georgia, Palatino, 'Palatino Linotype', Times, 'Times New Roman', serif; 75 | color: #111; 76 | line-height: 125%; 77 | /* margin-top: 2em; */ 78 | font-weight: normal; 79 | } 80 | 81 | h4, h5, h6 { 82 | font-weight: bold; 83 | } 84 | 85 | h1 { 86 | font-size: 2.5em; 87 | } 88 | 89 | h2 { 90 | font-size: 2em; 91 | } 92 | 93 | h3 { 94 | font-size: 1.5em; 95 | } 96 | 97 | h4 { 98 | font-size: 1.2em; 99 | } 100 | 101 | h5 { 102 | font-size: 1em; 103 | } 104 | 105 | h6 { 106 | font-size: 0.9em; 107 | } 108 | 109 | blockquote { 110 | color: #666666; 111 | margin: 0; 112 | padding-left: 3em; 113 | border-left: 0.5em #EEE solid; 114 | } 115 | 116 | hr { 117 | display: block; 118 | height: 2px; 119 | border: 0; 120 | border-top: 1px solid #aaa; 121 | border-bottom: 1px solid #eee; 122 | margin: 1em 0; 123 | padding: 0; 124 | } 125 | 126 | pre, code, kbd, samp { 127 | color: #000; 128 | background-color: #eee; 129 | border-radius: 3px; 130 | font-family: monospace, monospace; 131 | _font-family: 'courier new', monospace; 132 | font-size: 0.98em; 133 | } 134 | 135 | pre { 136 | white-space: pre; 137 | white-space: pre-wrap; 138 | word-wrap: break-word; 139 | } 140 | 141 | b, strong { 142 | font-weight: bold; 143 | } 144 | 145 | dfn { 146 | font-style: italic; 147 | } 148 | 149 | ins { 150 | background: #ff9; 151 | color: #000; 152 | text-decoration: none; 153 | } 154 | 155 | mark { 156 | background: #ff0; 157 | color: #000; 158 | font-style: italic; 159 | font-weight: bold; 160 | } 161 | 162 | sub, sup { 163 | font-size: 75%; 164 | line-height: 0; 165 | position: relative; 166 | vertical-align: baseline; 167 | } 168 | 169 | sup { 170 | top: -0.5em; 171 | } 172 | 173 | sub { 174 | bottom: -0.25em; 175 | } 176 | 177 | ul, ol { 178 | margin: 1em 0; 179 | padding: 0 0 0 2em; 180 | } 181 | 182 | li p:last-child { 183 | margin-bottom: 0; 184 | } 185 | 186 | ul ul, ol ol { 187 | margin: .3em 0; 188 | } 189 | 190 | dl { 191 | margin-bottom: 1em; 192 | } 193 | 194 | dt { 195 | font-weight: bold; 196 | margin-bottom: .8em; 197 | } 198 | 199 | dd { 200 | margin: 0 0 .8em 2em; 201 | } 202 | 203 | dd:last-child { 204 | margin-bottom: 0; 205 | } 206 | 207 | img { 208 | border: 0; 209 | -ms-interpolation-mode: bicubic; 210 | vertical-align: middle; 211 | } 212 | 213 | figure { 214 | display: block; 215 | text-align: center; 216 | margin: 1em 0; 217 | } 218 | 219 | figure img { 220 | border: none; 221 | margin: 0 auto; 222 | } 223 | 224 | figcaption { 225 | font-size: 0.8em; 226 | font-style: italic; 227 | margin: 0 0 .8em; 228 | } 229 | 230 | table { 231 | margin-bottom: 1em; 232 | border-bottom: 1px solid #ddd; 233 | border-right: 1px solid #ddd; 234 | border-spacing: 0; 235 | border-collapse: collapse; 236 | } 237 | 238 | table th { 239 | padding: .2em 1em; 240 | background-color: #eee; 241 | border-top: 1px solid #ddd; 242 | border-left: 1px solid #ddd; 243 | } 244 | 245 | table td { 246 | padding: .1em 1em; 247 | border-top: 1px solid #ddd; 248 | border-left: 1px solid #ddd; 249 | vertical-align: top; 250 | } 251 | 252 | .author { 253 | font-size: 1.2em; 254 | text-align: center; 255 | } 256 | /* 257 | @media only screen and (min-width: 480px) { 258 | body { 259 | font-size: 14px; 260 | } 261 | } 262 | 263 | @media only screen and (min-width: 768px) { 264 | body { 265 | font-size: 16px; 266 | } 267 | } 268 | */ 269 | @media print { 270 | * { 271 | background: transparent !important; 272 | color: black !important; 273 | filter: none !important; 274 | -ms-filter: none !important; 275 | } 276 | 277 | body { 278 | font-size: 11pt; 279 | max-width: 100%; 280 | } 281 | 282 | a, a:visited { 283 | text-decoration: underline; 284 | } 285 | 286 | hr { 287 | height: 1px; 288 | border: 0; 289 | border-bottom: 1px solid black; 290 | } 291 | 292 | a[href]:after { 293 | content: " (" attr(href) ")"; 294 | } 295 | 296 | abbr[title]:after { 297 | content: " (" attr(title) ")"; 298 | } 299 | 300 | .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { 301 | content: ""; 302 | } 303 | 304 | pre, blockquote { 305 | border: 1px solid #999; 306 | padding-right: 1em; 307 | page-break-inside: avoid; 308 | } 309 | 310 | tr, img { 311 | page-break-inside: avoid; 312 | } 313 | 314 | img { 315 | max-width: 100% !important; 316 | } 317 | 318 | @page :left { 319 | margin: 15mm 20mm 15mm 10mm; 320 | } 321 | 322 | @page :right { 323 | margin: 15mm 10mm 15mm 20mm; 324 | } 325 | 326 | p, h2, h3 { 327 | orphans: 3; 328 | widows: 3; 329 | } 330 | 331 | h2, h3 { 332 | page-break-after: avoid; 333 | } 334 | } 335 | -------------------------------------------------------------------------------- /dst/syntax/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Syntax 5 | 6 | 7 | 8 | 9 | 10 | 11 |

Mowgli

12 |

Home | Syntax | Section 2

13 |

Synatax

14 |

h1 Heading 8-)

15 |

h2 Heading

16 |

h3 Heading

17 |

h4 Heading

18 |
h5 Heading
19 |
h6 Heading
20 |

Horizontal Rules

21 |
22 |
23 |
24 |

Typographic replacements

25 |

Enable typographer option to see result.

26 |

(c) (C) (r) (R) (tm) (TM) (p) (P) +-

27 |

test.. test... test..... test?..... test!....

28 |

!!!!!! ???? ,, -- ---

29 |

"Smartypants, double quotes" and 'single quotes'

30 |

Emphasis

31 |

This is bold text

32 |

This is bold text

33 |

This is italic text

34 |

This is italic text

35 |

~~Strikethrough~~

36 |

Blockquotes

37 |
38 |

Blockquotes can also be nested...

39 |
40 |

...by using additional greater-than signs right next to each other...

41 |
42 |

...or with spaces between arrows.

43 |
44 |
45 |
46 |

Lists

47 |

Unordered

48 | 59 |

Ordered

60 |
    61 |
  1. Lorem ipsum dolor sit amet
    2. 62 |
  2. Consectetur adipiscing elit
    3. 63 |
  3. 64 |

    Integer molestie lorem at massa

    65 |
    4. 66 |
  4. 67 |

    You can use sequential numbers...

    68 |
    5. 69 |
  5. ...or keep all the numbers as 1.
    6. 70 |
71 |

Start numbering with offset:

72 |
    73 |
  1. foo
    2. 74 |
  2. bar
    3. 75 |
76 |

Code

77 |

Inline code

78 |

Indented code

79 | 
// Some comments
 80 | line 1 of code
 81 | line 2 of code
 82 | line 3 of code
 83 |
84 |

Block code "fences"

85 |

Sample text here...

86 |

Syntax highlighting

87 |

``` js 88 | var foo = function (bar) { 89 | return bar++; 90 | };

91 |

console.log(foo(5)); 92 | ```

93 |

Tables

94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 |
OptionDescription
datapath to data files to supply the data that will be passed into templates.
engineengine to be used for processing templates. Handlebars is the default.
extextension to be used for dest files.
116 |

Right aligned columns

117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | 136 | 137 | 138 |
OptionDescription
datapath to data files to supply the data that will be passed into templates.
engineengine to be used for processing templates. Handlebars is the default.
extextension to be used for dest files.
139 |

Links

140 |

link text

141 |

link with title

142 |

Autoconverted link https://github.com/nodeca/pica (enable linkify to see)

143 |

Images

144 |

Minion 145 | Stormtroopocat

146 |

Like links, Images also have a footnote style syntax

147 |

Alt text

148 |

With a reference later in the document defining the URL location:

149 |

Plugins

150 |

The killer feature of markdown-it is very effective support of 151 | syntax plugins.

152 |

Emojies

153 |
154 |

Classic markup: :wink: :crush: :cry: :tear: :laughing: :yum:

155 |

Shortcuts (emoticons): :-) :-( 8-) ;)

156 |
157 |

see how to change output with twemoji.

158 |

Subscript / Superscript

159 | 163 |

\

164 |

++Inserted text++

165 |

\

166 |

==Marked text==

167 |

Footnotes

168 |

Footnote 1 link[^first].

169 |

Footnote 2 link[^second].

170 |

Inline footnote^[Text of inline footnote] definition.

171 |

Duplicated footnote reference[^second].

172 |

[^first]: Footnote can have markup

173 | 
and multiple paragraphs.
174 |
175 |

[^second]: Footnote text.

176 |

Definition lists

177 |

Term 1

178 |

: Definition 1 179 | with lazy continuation.

180 |

Term 2 with inline markup

181 |

: Definition 2

182 | 
    { some code, part of Definition 2 }
183 | 
184 | Third paragraph of definition 2.
185 |
186 |

Compact style:

187 |

Term 1 188 | ~ Definition 1

189 |

Term 2 190 | ~ Definition 2a 191 | ~ Definition 2b

192 |

Abbreviations

193 |

This is HTML abbreviation example.

194 |

It converts "HTML", but keep intact partial entries like "xxxHTMLyyy" and so on.

195 |

*[HTML]: Hyper Text Markup Language

196 |

Custom containers

197 |

::: warning 198 | here be dragons 199 | :::

200 | 201 | 202 | --------------------------------------------------------------------------------