.config/Typora/themes/pixyll.css

   1 @include-when-export url(https://fonts.loli.net/css?family=Merriweather:900,900italic,300,300italic&subset=latin-ext);
   2 @include-when-export url(https://fonts.loli.net/css?family=Lato:900,300&subset=latin-ext);
   3
   4 :root {
   5         --control-text-color: #777;
   6 }
   7
   8 /**
   9  * forked from pixyll.com
  10  * MIT license
  11  */
  12
  13 @font-face {
  14         font-family: 'Merriweather';
  15         font-style: normal;
  16         font-weight: normal;
  17         src: local('Merriweather Light'), local('Merriweather-Light'), url('./pixyll/merriweather-v19-latin-300.woff') format('woff');
  18 }
  19 @font-face {
  20         font-family: 'Merriweather';
  21         font-style: normal;
  22         font-weight: bold;
  23         src: local('Merriweather Heavy'), local('Merriweather-Heavy'), url('./pixyll/merriweather-v19-latin-700.woff') format('woff');
  24 }
  25 @font-face {
  26         font-family: 'Merriweather';
  27         font-style: italic;
  28         font-weight: normal;
  29         src: local('Merriweather Light Italic'), local('Merriweather-LightItalic'), url('./pixyll/merriweather-v19-latin-300italic.woff') format('woff');
  30 }
  31 @font-face {
  32         font-family: 'Merriweather';
  33         font-style: italic;
  34         font-weight: bold;
  35         src: local('Merriweather Heavy Italic'), local('Merriweather-HeavyItalic'), url('./pixyll/merriweather-v19-latin-700italic.woff') format('woff');
  36 }
  37
  38 @font-face {
  39         font-family: 'Lato';
  40         font-style: normal;
  41         font-weight: normal;
  42         src: local('Lato Light'), local('Lato-Light'), url('./pixyll/lato-v14-latin-300.woff') format('woff');
  43 }
  44 @font-face {
  45         font-family: 'Lato';
  46         font-style: normal;
  47         font-weight: bold;
  48         src: local('Lato Black'), local('Lato-Blcak'), url('./pixyll/lato-v14-latin-900.woff') format('woff');
  49 }
  50 @font-face {
  51         font-family: 'Lato';
  52         font-style: italic;
  53         font-weight: normal;
  54         src: local('Lato LightItalic'), local('Lato-LightItalic'), url('./pixyll/lato-v14-latin-300italic.woff') format('woff');
  55 }
  56 @font-face {
  57         font-family: 'Lato';
  58         font-style: italic;
  59         font-weight: bold;
  60         src: local('Lato BlackItalic'), local('Lato-BlackItalic'), url('./pixyll/lato-v14-latin-900italic.woff') format('woff');
  61 }
  62
  63 h1,
  64 .h1,
  65 .f1 {
  66         font-size: 2rem;
  67         line-height: 2.5rem;
  68 }
  69 h2,
  70 .h2,
  71 .f2 {
  72         font-size: 1.5rem;
  73         line-height: 2rem;
  74 }
  75 h3,
  76 .h3,
  77 .f3 {
  78         font-size: 1.25rem;
  79         line-height: 1.5rem;
  80 }
  81 p,
  82 .p,
  83 .f4,
  84 h4,
  85 h5,
  86 h6,
  87 dl,
  88 ol,
  89 ul,
  90 pre[cid],
  91 div[cid],
  92 #typora-source {
  93         font-size: 1.125rem;
  94         line-height: 1.5rem;
  95 }
  96
  97 h4 {
  98         font-size: 1.13rem;
  99 }
 100 /*
 101  Pixyll
 102  A simple, beautiful theme for Jekyll that emphasizes content rather than aesthetic fluff.
 103  Best served with BASSCSS (http://jxnblk.github.io/basscss)
 104  Crafted with <3 by John Otander (@4lpine) - ©2015 John Otander MIT License http://opensource.org/licenses/MIT
 105
 106 */
 107
 108 body {
 109         font-family: "Merriweather", "PT Serif", Georgia, "Times New Roman", "STSong", Serif;
 110         line-height: 1.5rem;
 111         font-weight: 400;
 112 }
 113
 114 #write {
 115         max-width: 914px;
 116         color: #333;
 117 }
 118
 119 @media only screen and (min-width: 1400px) {
 120         #write {
 121                 max-width: 1100px;
 122         }
 123 }
 124
 125 @media only screen and (min-width: 1700px) {
 126         #write {
 127                 max-width: 1200px;
 128         }
 129 }
 130
 131 img {
 132         width: auto;
 133         max-width: 100%;
 134 }
 135 body {
 136         font-size: 1.5rem;
 137         box-sizing: border-box;
 138         -moz-box-sizing: border-box;
 139         -webkit-box-sizing: border-box;
 140 }
 141
 142 .ty-table-edit {
 143         background: #ededed;
 144 }
 145
 146 table {
 147         width: 100%;
 148         font-size: 1.125rem;
 149 }
 150 table > thead > tr > th,
 151 table > thead > tr > td,
 152 table > tbody > tr > th,
 153 table > tbody > tr > td,
 154 table > tfoot > tr > th,
 155 table > tfoot > tr > td {
 156         padding: 12px;
 157         line-height: 1.2;
 158         vertical-align: top;
 159         border-top: 1px solid #333;
 160 }
 161 table > thead > tr > th {
 162         vertical-align: bottom;
 163         border-bottom: 2px solid #333;
 164 }
 165 table > caption + thead > tr:first-child > th,
 166 table > caption + thead > tr:first-child > td,
 167 table > colgroup + thead > tr:first-child > th,
 168 table > colgroup + thead > tr:first-child > td,
 169 table > thead:first-child > tr:first-child > th,
 170 table > thead:first-child > tr:first-child > td {
 171         border-top: 0;
 172 }
 173 table > tbody + tbody {
 174         border-top: 2px solid #333;
 175 }
 176 p {
 177         font-weight: 300;
 178         line-height: 1.5;
 179 }
 180 abbr {
 181         border-bottom: 1px black dotted;
 182         cursor: help;
 183 }
 184 pre,
 185 code {
 186         font-family: Menlo, Monaco, "Courier New", monospace;
 187 }
 188
 189 code,
 190 .md-fences  {
 191         color: #7a7a7a;
 192 }
 193
 194 .md-fences {
 195         padding: 1.125em;
 196         margin-bottom: 0.88em;
 197         font-size: 1rem;
 198         border: 1px solid #7a7a7a;
 199         padding-bottom: 0.5rem;
 200         padding-top: 0.5rem;
 201 }
 202
 203 blockquote {
 204         padding: 1.33em;
 205         font-style: italic;
 206         border-left: 5px solid #7a7a7a;
 207         color: #555;
 208 }
 209 blockquote em {
 210         color: #000;
 211 }
 212 blockquote footer {
 213         font-size: .85rem;
 214         font-style: normal;
 215         background-color: #fff;
 216         color: #7a7a7a;
 217         border-color: transparent;
 218 }
 219 h1,
 220 .h1,
 221 h2,
 222 .h2,
 223 h3,
 224 .h3,
 225 h4,
 226 .h4,
 227 h5,
 228 .h5,
 229 h6,
 230 .h6 {
 231         font-family: "Lato", 'Helvetica Neue', Helvetica, sans-serif;
 232         font-weight: bold;
 233         line-height: 1.2;
 234         margin: 1em 0 0.5em;
 235 }
 236 @media screen and (min-width: 48em) {
 237         .h1,
 238         h1 {
 239                 font-size: 3.250rem;
 240         }
 241         .h2,
 242         h2 {
 243                 font-size: 2.298rem;
 244         }
 245         .h3,
 246         h3 {
 247                 font-size: 1.625rem;
 248         }
 249         .h4,
 250         h4 {
 251                 font-size: 1.3rem;
 252         }
 253         #write>h4.md-focus:before,
 254         #write>h5.md-focus:before,
 255         #write>h6.md-focus:before{
 256                 top: 1px;
 257         }
 258         .p,
 259         p,
 260         li {
 261                 font-size: 1.25rem;
 262                 line-height: 1.8;
 263         }
 264         table {
 265                 font-size: 1.25rem;
 266         }
 267 }
 268 @media (max-width: 48em) {
 269         blockquote {
 270                 margin-left: 1rem;
 271                 margin-right: 0;
 272                 padding: 0.5em;
 273         }
 274         .h1,
 275         h1 {
 276                 font-size: 2.827rem;
 277         }
 278         .h2,
 279         h2 {
 280                 font-size: 1.999rem;
 281         }
 282         .h3,
 283         h3 {
 284                 font-size: 1.413rem;
 285         }
 286         .h4,
 287         h4 {
 288                 font-size: 1.3rem;
 289         }
 290 }
 291 @media screen and (min-width: 64em) {
 292         .h1,
 293         h1 {
 294                 font-size: 4.498rem;
 295         }
 296         .h2,
 297         h2 {
 298                 font-size: 2.29rem;
 299         }
 300         .h3,
 301         h3 {
 302                 font-size: 1.9rem;
 303         }
 304         .h4,
 305         h4 {
 306                 font-size: 1.591rem;
 307         }
 308         #write>h4.md-focus:before{
 309                 top:4px;
 310         }
 311 }
 312 a {
 313         color: #463F5C;
 314         text-decoration: underline;
 315 }
 316
 317 #write {
 318         padding-top: 2rem;
 319 }
 320
 321 #write pre.md-meta-block {
 322         min-height: 35px;
 323         padding: 0.5em 1em;
 324         white-space: pre;
 325         border: 0px;
 326
 327         border-left: 30px #f8f8f8 solid;
 328         border-right: 30px #f8f8f8 solid;
 329         width: 100vw;
 330         max-width: calc(100% + 60px);
 331
 332         margin-left: -30px;
 333         margin-bottom: 2em;
 334         margin-top: -2010px;
 335         padding-top: 2000px;
 336         padding-bottom: 10px;
 337         line-height: 1.5em;
 338         color: #7a7a7a;
 339         background-color: #fafafa;
 340         font-family: 'Lato', 'Helvetica Neue', Helvetica, sans-serif;
 341         font-weight: 300;
 342         clear: both;
 343         padding-left: 0;
 344         font-size:1.125rem;
 345 }
 346 .md-image>.md-meta {
 347         color: #463F5C
 348 }
 349 .footnotes {
 350         font-size:1.1rem;
 351 }
 352 .md-tag {
 353         font-family: 'Lato', 'Helvetica Neue', Helvetica, sans-serif;
 354 }
 355 .code-tooltip {
 356         background: white;
 357 }
 358 .code-tooltip-content {
 359         font-size: 1.1rem;
 360 }
 361
 362 .task-list{
 363         padding-left: 0;
 364 }
 365
 366 .md-task-list-item {
 367         padding-left:34px;
 368 }
 369
 370 .md-task-list-item > input{
 371         width: 1.25rem;
 372         height: 1.25rem;
 373         display: block;
 374         -webkit-appearance: initial;
 375         top: -0.2rem;
 376         margin-left: -1.6em;
 377         margin-top: calc(1rem - 7px);
 378         border: none;
 379 }
 380
 381 .md-task-list-item > input:focus{
 382         outline: none;
 383         box-shadow: none;
 384 }
 385
 386 .md-task-list-item > input:before{
 387         border: 1px solid #555;
 388         border-radius: 1.5rem;
 389         width: 1.5rem;
 390         height: 1.5rem;
 391         background: #fff;
 392         content: ' ';
 393         transition: background-color 200ms ease-in-out;
 394         display: block;
 395 }
 396
 397 .md-task-list-item > input:checked:before,
 398 .md-task-list-item > input[checked]:before{
 399         background: #333;
 400         border-width: 2px;
 401         display:inline-block;
 402         transition: background-color 200ms ease-in-out;
 403 }
 404
 405 .md-task-list-item > input:checked:after,
 406 .md-task-list-item > input[checked]:after {
 407         opacity: 1;
 408 }
 409
 410 .md-task-list-item > input:after {
 411         opacity: 1;
 412         -webkit-transition: opacity 0.05s ease-in-out;
 413         -moz-transition: opacity 0.05s ease-in-out;
 414         transition: opacity 0.05s ease-in-out;
 415         -webkit-transform: rotate(-45deg);
 416         -moz-transform: rotate(-45deg);
 417         transform: rotate(-45deg);
 418         position: absolute;
 419         top: 0.4375rem;
 420         left: 0.28125rem;
 421         width: 0.9375rem;
 422         height: 0.5rem;
 423         border: 3px solid #fff;
 424         border-top: 0;
 425         border-right: 0;
 426         content: ' ';
 427         opacity: 0;
 428 }
 429
 430 .md-tag {
 431         color:inherit;
 432 }
 433
 434 .md-toc:focus .md-toc-content{
 435         margin-top: 19px;
 436 }
 437
 438 #typora-sidebar {
 439         font-size:1rem !important;
 440 }
 441
 442 .html-for-mac #typora-sidebar {
 443         background-color:white;
 444 }
 445
 446 .outline-content li, .outline-content ul {
 447         font-size:1rem !important;
 448 }
 449
 450 .outline-title {
 451         line-height: inherit;
 452         margin-top: 10px;
 453 }
 454
 455 .outline-expander {
 456         width: 18px;
 457 }
 458
 459 .outline-expander:before {
 460         content: "+";
 461         font-family: inherit;
 462         color: rgb(108, 108, 108);
 463         font-size: 1.5rem;
 464         top: 0.1rem;
 465 }
 466
 467 .outline-expander:hover:before {
 468         content: "+";
 469 }
 470
 471 .outline-item-open>.outline-item>.outline-expander:before{
 472         content: "-";
 473 }
 474
 475 /** source code mode */
 476 #typora-source {
 477         font-family: Courier, monospace;
 478     color: #6A6A6A;
 479 }
 480
 481 .os-windows #typora-source {
 482         font-family: inherit;
 483 }
 484
 485 .cm-s-typora-default .cm-header,
 486 .cm-s-typora-default .cm-property,
 487 .CodeMirror.cm-s-typora-default div.CodeMirror-cursor {
 488         color: #428bca;
 489 }
 490
 491 .cm-s-typora-default .cm-atom, .cm-s-typora-default .cm-number {
 492         color: #777777;
 493 }
 494
 495 .md-diagram-panel {
 496         margin-top: 24px;
 497         margin-left: -1.2em;
 498 }
 499
 500 .md-mathjax-midline {
 501         background: #fafafa;
 502 }
 503
 504 .enable-diagrams pre.md-fences[lang="sequence"] .code-tooltip,
 505 .enable-diagrams pre.md-fences[lang="flow"] .code-tooltip,
 506 .enable-diagrams pre.md-fences[lang="mermaid"] .code-tooltip {
 507     bottom: -3.4em;
 508 }
 509
 510 .dropdown-menu .divider {
 511         border-color: #e5e5e5;
 512 }