├── CSS ├── Both.png ├── GitHub-ReadMe-Preview.png └── GitHub-ReadMe.css ├── ReadMe.md └── Themes ├── Sublime+.txt ├── Sublime-Preview.png └── Sublime.txt /CSS/Both.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hzlzh/MarkDown-Theme/a9e6b522fa4c5d9a64c6a2f06fe223b3d1142cae/CSS/Both.png -------------------------------------------------------------------------------- /CSS/GitHub-ReadMe-Preview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hzlzh/MarkDown-Theme/a9e6b522fa4c5d9a64c6a2f06fe223b3d1142cae/CSS/GitHub-ReadMe-Preview.png -------------------------------------------------------------------------------- /CSS/GitHub-ReadMe.css: -------------------------------------------------------------------------------- 1 | /* 2 | Name: Github ReadMe style for Mou app 3 | Version: v1.1 4 | Author: hzlzh(hzlzh.dev@gmail.com) 5 | URL: https://github.com/hzlzh/Mou-Theme 6 | */ 7 | @charset "UTF-8"; 8 | html { 9 | font-family: sans-serif; 10 | -ms-text-size-adjust: 100%; 11 | -webkit-text-size-adjust: 100% 12 | } 13 | 14 | body { 15 | margin: 0 16 | } 17 | 18 | article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary { 19 | display: block 20 | } 21 | 22 | audio,canvas,progress,video { 23 | display: inline-block; 24 | vertical-align: baseline 25 | } 26 | 27 | audio:not([controls]) { 28 | display: none; 29 | height: 0 30 | } 31 | 32 | [hidden],template { 33 | display: none 34 | } 35 | 36 | a { 37 | background: transparent 38 | } 39 | 40 | a:active,a:hover { 41 | outline: 0 42 | } 43 | 44 | abbr[title] { 45 | border-bottom: 1px dotted 46 | } 47 | 48 | b,strong { 49 | font-weight: bold 50 | } 51 | 52 | dfn { 53 | font-style: italic 54 | } 55 | 56 | h1 { 57 | font-size: 2em; 58 | margin: 0.67em 0 59 | } 60 | 61 | mark { 62 | background: #ff0; 63 | color: #000 64 | } 65 | 66 | small { 67 | font-size: 80% 68 | } 69 | 70 | sub,sup { 71 | font-size: 75%; 72 | line-height: 0; 73 | position: relative; 74 | vertical-align: baseline 75 | } 76 | 77 | sup { 78 | top: -0.5em 79 | } 80 | 81 | sub { 82 | bottom: -0.25em 83 | } 84 | 85 | img { 86 | border: 0 87 | } 88 | 89 | svg:not(:root) { 90 | overflow: hidden 91 | } 92 | 93 | figure { 94 | margin: 1em 40px 95 | } 96 | 97 | hr { 98 | -moz-box-sizing: content-box; 99 | box-sizing: content-box; 100 | height: 0 101 | } 102 | 103 | pre { 104 | overflow: auto 105 | } 106 | 107 | code,kbd,pre,samp { 108 | font-family: monospace, monospace; 109 | font-size: 1em 110 | } 111 | 112 | button,input,optgroup,select,textarea { 113 | color: inherit; 114 | font: inherit; 115 | margin: 0 116 | } 117 | 118 | button { 119 | overflow: visible 120 | } 121 | 122 | button,select { 123 | text-transform: none 124 | } 125 | 126 | button,html input[type="button"],input[type="reset"],input[type="submit"] { 127 | -webkit-appearance: button; 128 | cursor: pointer 129 | } 130 | 131 | button[disabled],html input[disabled] { 132 | cursor: default 133 | } 134 | 135 | button::-moz-focus-inner,input::-moz-focus-inner { 136 | border: 0; 137 | padding: 0 138 | } 139 | 140 | input { 141 | line-height: normal 142 | } 143 | 144 | input[type="checkbox"],input[type="radio"] { 145 | box-sizing: border-box; 146 | padding: 0 147 | } 148 | 149 | input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button { 150 | height: auto 151 | } 152 | 153 | input[type="search"] { 154 | -webkit-appearance: textfield; 155 | -moz-box-sizing: content-box; 156 | -webkit-box-sizing: content-box; 157 | box-sizing: content-box 158 | } 159 | 160 | input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration { 161 | -webkit-appearance: none 162 | } 163 | 164 | fieldset { 165 | border: 1px solid #c0c0c0; 166 | margin: 0 2px; 167 | padding: 0.35em 0.625em 0.75em 168 | } 169 | 170 | legend { 171 | border: 0; 172 | padding: 0 173 | } 174 | 175 | textarea { 176 | overflow: auto 177 | } 178 | 179 | optgroup { 180 | font-weight: bold 181 | } 182 | 183 | table { 184 | border-collapse: collapse; 185 | border-spacing: 0 186 | } 187 | 188 | td,th { 189 | padding: 0 190 | } 191 | 192 | * { 193 | -moz-box-sizing: border-box; 194 | box-sizing: border-box 195 | } 196 | 197 | input,select,textarea,button { 198 | font: 13px/1.4 Helvetica, arial, freesans, clean, sans-serif, "Segoe UI Emoji", "Segoe UI Symbol" 199 | } 200 | 201 | body { 202 | padding: 30px; 203 | max-width: 858px; 204 | margin: 0 auto; 205 | font: 13px/1.4 Helvetica, arial, freesans, clean, sans-serif, "Segoe UI Emoji", "Segoe UI Symbol"; 206 | color: #333; 207 | background-color: #fff 208 | } 209 | 210 | a { 211 | color: #4183c4; 212 | text-decoration: none 213 | } 214 | 215 | a:hover,a:focus,a:active { 216 | text-decoration: underline 217 | } 218 | 219 | hr,.rule { 220 | height: 0; 221 | margin: 15px 0; 222 | overflow: hidden; 223 | background: transparent; 224 | border: 0; 225 | border-bottom: 1px solid #ddd 226 | } 227 | 228 | hr:before,.rule:before { 229 | display: table; 230 | content: "" 231 | } 232 | 233 | hr:after,.rule:after { 234 | display: table; 235 | clear: both; 236 | content: "" 237 | } 238 | 239 | fieldset { 240 | padding: 0; 241 | margin: 0; 242 | border: 0 243 | } 244 | 245 | label { 246 | font-size: 13px; 247 | font-weight: bold 248 | } 249 | 250 | input[type="text"],#adv_code_search .search-page-label,input[type="password"],input[type="email"],input[type="number"],input[type="tel"],input[type="url"],textarea { 251 | min-height: 34px; 252 | padding: 7px 8px; 253 | font-size: 13px; 254 | color: #333; 255 | vertical-align: middle; 256 | background-color: #fff; 257 | background-repeat: no-repeat; 258 | background-position: right center; 259 | border: 1px solid #ccc; 260 | border-radius: 3px; 261 | outline: none; 262 | box-shadow: inset 0 1px 2px rgba(0,0,0,0.075) 263 | } 264 | 265 | input[type="text"].focus,#adv_code_search .focus.search-page-label,input[type="text"]:focus,.focused .drag-and-drop,#adv_code_search .search-page-label:focus,input[type="password"].focus,input[type="password"]:focus,input[type="email"].focus,input[type="email"]:focus,input[type="number"].focus,input[type="number"]:focus,input[type="tel"].focus,input[type="tel"]:focus,input[type="url"].focus,input[type="url"]:focus,textarea.focus,textarea:focus { 266 | border-color: #51a7e8; 267 | box-shadow: inset 0 1px 2px rgba(0,0,0,0.075),0 0 5px rgba(81,167,232,0.5) 268 | } 269 | 270 | input.input-contrast,.input-contrast { 271 | background-color: #fafafa 272 | } 273 | 274 | input.input-contrast:focus,.input-contrast:focus { 275 | background-color: #fff 276 | } 277 | 278 | ::-webkit-input-placeholder,:-moz-placeholder { 279 | color: #aaa 280 | } 281 | 282 | ::-webkit-validation-bubble-message { 283 | font-size: 12px; 284 | color: #fff; 285 | background: #9c2400; 286 | border: 0; 287 | border-radius: 3px; 288 | -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.1) 289 | } 290 | 291 | input::-webkit-validation-bubble-icon { 292 | display: none 293 | } 294 | 295 | ::-webkit-validation-bubble-arrow { 296 | background-color: #9c2400; 297 | border: solid 1px #9c2400; 298 | -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.1) 299 | } 300 | 301 | body{ 302 | font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif; 303 | font-size: 16px; 304 | line-height: 1.6; 305 | word-wrap: break-word 306 | } 307 | 308 | body>*:first-child { 309 | margin-top: 0 !important 310 | } 311 | 312 | body>*:last-child { 313 | margin-bottom: 0 !important 314 | } 315 | 316 | .absent { 317 | color: #c00 318 | } 319 | 320 | .anchor { 321 | position: absolute; 322 | top: 0; 323 | bottom: 0; 324 | left: 0; 325 | display: block; 326 | padding-right: 6px; 327 | padding-left: 30px; 328 | margin-left: -30px 329 | } 330 | 331 | .anchor:focus { 332 | outline: none 333 | } 334 | 335 | h1,h2,h3,h4,h5,h6 { 336 | position: relative; 337 | margin-top: 1em; 338 | margin-bottom: 16px; 339 | font-weight: bold; 340 | line-height: 1.4 341 | } 342 | 343 | h1 .octicon-link,h2 .octicon-link,h3 .octicon-link,h4 .octicon-link,h5 .octicon-link,h6 .octicon-link { 344 | display: none; 345 | color: #000; 346 | vertical-align: middle 347 | } 348 | 349 | h1:hover .anchor,h2:hover .anchor,h3:hover .anchor,h4:hover .anchor,h5:hover .anchor,h6:hover .anchor { 350 | height: 1em; 351 | padding-left: 8px; 352 | margin-left: -30px; 353 | line-height: 1; 354 | text-decoration: none 355 | } 356 | 357 | h1:hover .anchor .octicon-link,h2:hover .anchor .octicon-link,h3:hover .anchor .octicon-link,h4:hover .anchor .octicon-link,h5:hover .anchor .octicon-link,h6:hover .anchor .octicon-link { 358 | display: inline-block 359 | } 360 | 361 | h1 tt,h1 code,h2 tt,h2 code,h3 tt,h3 code,h4 tt,h4 code,h5 tt,h5 code,h6 tt,h6 code { 362 | font-size: inherit 363 | } 364 | 365 | h1 { 366 | padding-bottom: 0.3em; 367 | font-size: 2.25em; 368 | line-height: 1.2; 369 | border-bottom: 1px solid #eee 370 | } 371 | 372 | h2 { 373 | padding-bottom: 0.3em; 374 | font-size: 1.75em; 375 | line-height: 1.225; 376 | border-bottom: 1px solid #eee 377 | } 378 | 379 | h3 { 380 | font-size: 1.5em; 381 | line-height: 1.43 382 | } 383 | 384 | h4 { 385 | font-size: 1.25em 386 | } 387 | 388 | h5 { 389 | font-size: 1em 390 | } 391 | 392 | h6 { 393 | font-size: 1em; 394 | color: #777 395 | } 396 | 397 | p,blockquote,ul,ol,dl,table,pre { 398 | margin-top: 0; 399 | margin-bottom: 16px 400 | } 401 | 402 | hr { 403 | height: 4px; 404 | padding: 0; 405 | margin: 16px 0; 406 | background-color: #e7e7e7; 407 | border: 0 none 408 | } 409 | 410 | ul,ol { 411 | padding-left: 2em 412 | } 413 | 414 | ul.no-list,ol.no-list { 415 | padding: 0; 416 | list-style-type: none 417 | } 418 | 419 | ul ul,ul ol,ol ol,ol ul { 420 | margin-top: 0; 421 | margin-bottom: 0 422 | } 423 | 424 | li>p { 425 | margin-top: 16px 426 | } 427 | 428 | dl { 429 | padding: 0 430 | } 431 | 432 | dl dt { 433 | padding: 0; 434 | margin-top: 16px; 435 | font-size: 1em; 436 | font-style: italic; 437 | font-weight: bold 438 | } 439 | 440 | dl dd { 441 | padding: 0 16px; 442 | margin-bottom: 16px 443 | } 444 | 445 | blockquote { 446 | padding: 0 15px; 447 | color: #777; 448 | border-left: 4px solid #ddd 449 | } 450 | 451 | blockquote>:first-child { 452 | margin-top: 0 453 | } 454 | 455 | blockquote>:last-child { 456 | margin-bottom: 0 457 | } 458 | 459 | table { 460 | display: block; 461 | width: 100%; 462 | overflow: auto; 463 | word-break: normal; 464 | word-break: keep-all 465 | } 466 | 467 | table th { 468 | font-weight: bold 469 | } 470 | 471 | table th,table td { 472 | padding: 6px 13px; 473 | border: 1px solid #ddd 474 | } 475 | 476 | table tr { 477 | background-color: #fff; 478 | border-top: 1px solid #ccc 479 | } 480 | 481 | table tr:nth-child(2n) { 482 | background-color: #f8f8f8 483 | } 484 | 485 | img { 486 | max-width: 100%; 487 | -moz-box-sizing: border-box; 488 | box-sizing: border-box 489 | } 490 | 491 | span.frame { 492 | display: block; 493 | overflow: hidden 494 | } 495 | 496 | span.frame>span { 497 | display: block; 498 | float: left; 499 | width: auto; 500 | padding: 7px; 501 | margin: 13px 0 0; 502 | overflow: hidden; 503 | border: 1px solid #ddd 504 | } 505 | 506 | span.frame span img { 507 | display: block; 508 | float: left 509 | } 510 | 511 | span.frame span span { 512 | display: block; 513 | padding: 5px 0 0; 514 | clear: both; 515 | color: #333 516 | } 517 | 518 | span.align-center { 519 | display: block; 520 | overflow: hidden; 521 | clear: both 522 | } 523 | 524 | span.align-center>span { 525 | display: block; 526 | margin: 13px auto 0; 527 | overflow: hidden; 528 | text-align: center 529 | } 530 | 531 | span.align-center span img { 532 | margin: 0 auto; 533 | text-align: center 534 | } 535 | 536 | span.align-right { 537 | display: block; 538 | overflow: hidden; 539 | clear: both 540 | } 541 | 542 | span.align-right>span { 543 | display: block; 544 | margin: 13px 0 0; 545 | overflow: hidden; 546 | text-align: right 547 | } 548 | 549 | span.align-right span img { 550 | margin: 0; 551 | text-align: right 552 | } 553 | 554 | span.float-left { 555 | display: block; 556 | float: left; 557 | margin-right: 13px; 558 | overflow: hidden 559 | } 560 | 561 | span.float-left span { 562 | margin: 13px 0 0 563 | } 564 | 565 | span.float-right { 566 | display: block; 567 | float: right; 568 | margin-left: 13px; 569 | overflow: hidden 570 | } 571 | 572 | span.float-right>span { 573 | display: block; 574 | margin: 13px auto 0; 575 | overflow: hidden; 576 | text-align: right 577 | } 578 | 579 | code,tt { 580 | padding: 0; 581 | padding-top: 0.2em; 582 | padding-bottom: 0.2em; 583 | margin: 0; 584 | font-size: 85%; 585 | background-color: rgba(0,0,0,0.04); 586 | border-radius: 3px 587 | } 588 | 589 | code:before,code:after,tt:before,tt:after { 590 | letter-spacing: -0.2em; 591 | content: "\00a0" 592 | } 593 | 594 | code br,tt br { 595 | display: none 596 | } 597 | 598 | del code { 599 | text-decoration: inherit; 600 | vertical-align: text-top 601 | } 602 | 603 | pre>code { 604 | padding: 0; 605 | margin: 0; 606 | font-size: 100%; 607 | word-break: normal; 608 | white-space: pre; 609 | background: transparent; 610 | border: 0 611 | } 612 | 613 | .highlight { 614 | margin-bottom: 16px 615 | } 616 | 617 | .highlight pre,pre { 618 | padding: 16px; 619 | overflow: auto; 620 | font-size: 85%; 621 | line-height: 1.45; 622 | background-color: #f7f7f7; 623 | border-radius: 3px 624 | } 625 | 626 | .highlight pre { 627 | margin-bottom: 0; 628 | word-break: normal 629 | } 630 | 631 | pre { 632 | word-wrap: normal 633 | } 634 | 635 | pre code,pre tt { 636 | display: inline; 637 | max-width: initial; 638 | padding: 0; 639 | margin: 0; 640 | overflow: initial; 641 | line-height: inherit; 642 | word-wrap: normal; 643 | background-color: transparent; 644 | border: 0 645 | } 646 | 647 | pre code:before,pre code:after,pre tt:before,pre tt:after { 648 | content: normal 649 | } 650 | 651 | -------------------------------------------------------------------------------- /ReadMe.md: -------------------------------------------------------------------------------- 1 | # Mou Theme 2 | [![Gitter](https://badges.gitter.im/Join Chat.svg)](https://gitter.im/hzlzh/Mou-Theme?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) 3 | 4 | Both `Themes` and `CSS` for [MacDown](http://macdown.uranusjr.com/) & [Mou.app] \(A nice MarkDown editor on Mac OS\) 5 | _Repo Path:_ 6 | 7 | --- 8 | |---- CSS/ CSS Style files 9 | |---- Themes/ Mou's `Code Mode` Theme 10 | 11 | ## Includes 12 | 13 | ### CSS: GitHub ReadMe Style v1.1 14 | 15 | [GitHub-ReadMe.css] is a CSS Style for Mou's `Code Mode`, it shows exactly what `ReadMe.md` will look on GitHub page, enjoy~ 16 | 17 | Screenshot: 18 | ![GitHub-ReadMe-Preview.png](https://github.com/hzlzh/Mou-Theme/raw/master/CSS/GitHub-ReadMe-Preview.png) 19 | 20 | ### Theme: Sublime v1.1 21 | 22 | [Sublime.txt] & [Sublime+.txt] are CSS Styles for Mou's `Live Preview Mode`, The `Color Scheme` is inspired by `.MD` file style under [Sublime Text 2.app] and Mou's Icon. 23 | 24 | Screenshot: 25 | ![Sublime-Preview.png](https://github.com/hzlzh/Mou-Theme/raw/master/Themes/Sublime-Preview.png) 26 | 27 | ### Preview 28 | 29 | _Both Code Mode & Live Preview Mode_ 30 | 31 | ![Both.png](https://github.com/hzlzh/Mou-Theme/raw/master/CSS/Both.png) 32 | 33 | ## Contributions 34 | 35 | `Star` or `Fork` to make this repo more and more wonderful~ 36 | 37 | ## Credits 38 | Created by @[hzlzh](https://twitter.com/hzlzh 'Contact me on Twitter') under [MIT] LICENSE 39 | 40 | 41 | [Mou.app]: http://25.io/mou/ 42 | [Sublime Text 2.app]: http://www.sublimetext.com/ 43 | [Sublime.txt]:https://github.com/hzlzh/Mou-Theme/raw/master/Themes/Sublime.txt 44 | [Sublime+.txt]:https://github.com/hzlzh/Mou-Theme/raw/master/Themes/Sublime+.txt 45 | [GitHub-ReadMe.css]: https://github.com/hzlzh/Mou-Theme/raw/master/CSS/GitHub-ReadMe.css 46 | [MIT]: http://rem.mit-license.org/ 47 | 48 | 49 | -------------------------------------------------------------------------------- /Themes/Sublime+.txt: -------------------------------------------------------------------------------- 1 | editor 2 | foreground: E0E2E4 3 | background: 293134 4 | caret: E0E2E4 5 | 6 | editor-selection 7 | foreground: E0E2E4 8 | background: 404E51 9 | 10 | H1 11 | foreground: 46dcb0 12 | font-style: bold 13 | font-size: 22px 14 | 15 | H2 16 | foreground: 46dcb0 17 | font-style: bold 18 | font-size: 19px 19 | 20 | H3 21 | foreground: 46dcb0 22 | font-size: 17px 23 | 24 | H4 25 | foreground: 46dcb0 26 | font-size: 15px 27 | 28 | H5 29 | foreground: 46dcb0 30 | font-size: 13px 31 | 32 | H6 33 | foreground: 46dcb0 34 | font-size: 11px 35 | 36 | EMPH 37 | foreground: ffab52 38 | font-style: italic 39 | 40 | STRONG 41 | foreground: ff7a52 42 | font-style: bold 43 | 44 | HRULE 45 | foreground: 586e75 46 | 47 | LIST_BULLET 48 | foreground: 75e349 49 | 50 | LIST_ENUMERATOR 51 | foreground: 75e349 52 | 53 | LINK 54 | foreground: 79b6e8 55 | 56 | AUTO_LINK_URL 57 | foreground: 79b6e8 58 | 59 | AUTO_LINK_EMAIL 60 | foreground: 79b6e8 61 | 62 | REFERENCE 63 | foreground: 888888 64 | 65 | IMAGE 66 | foreground: 85d065 67 | 68 | CODE 69 | foreground: e979d9 70 | 71 | VERBATIM 72 | foreground: e979d9 73 | 74 | HTML_ENTITY 75 | foreground: 6c71c4 76 | 77 | COMMENT 78 | foreground: 93a1a1 79 | 80 | BLOCKQUOTE 81 | foreground: ff0000 -------------------------------------------------------------------------------- /Themes/Sublime-Preview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hzlzh/MarkDown-Theme/a9e6b522fa4c5d9a64c6a2f06fe223b3d1142cae/Themes/Sublime-Preview.png -------------------------------------------------------------------------------- /Themes/Sublime.txt: -------------------------------------------------------------------------------- 1 | editor 2 | foreground: E0E2E4 3 | background: 293134 4 | caret: E0E2E4 5 | 6 | editor-selection 7 | foreground: E0E2E4 8 | background: 404E51 9 | 10 | H1 11 | foreground: 46dcb0 12 | font-style: bold 13 | 14 | H2 15 | foreground: 46dcb0 16 | font-style: bold 17 | 18 | H3 19 | foreground: 46dcb0 20 | 21 | H4 22 | foreground: 46dcb0 23 | 24 | H5 25 | foreground: 46dcb0 26 | 27 | H6 28 | foreground: 46dcb0 29 | 30 | EMPH 31 | foreground: ffab52 32 | font-style: italic 33 | 34 | STRONG 35 | foreground: ff7a52 36 | font-style: bold 37 | 38 | HRULE 39 | foreground: 586e75 40 | 41 | LIST_BULLET 42 | foreground: 75e349 43 | 44 | LIST_ENUMERATOR 45 | foreground: 75e349 46 | 47 | LINK 48 | foreground: 79b6e8 49 | 50 | AUTO_LINK_URL 51 | foreground: 79b6e8 52 | 53 | AUTO_LINK_EMAIL 54 | foreground: 79b6e8 55 | 56 | REFERENCE 57 | foreground: 888888 58 | 59 | IMAGE 60 | foreground: 85d065 61 | 62 | CODE 63 | foreground: e979d9 64 | 65 | VERBATIM 66 | foreground: e979d9 67 | 68 | HTML_ENTITY 69 | foreground: 6c71c4 70 | 71 | COMMENT 72 | foreground: 93a1a1 73 | 74 | BLOCKQUOTE 75 | foreground: ff0000 --------------------------------------------------------------------------------