markdown-preview-enhanced icon indicating copy to clipboard operation
markdown-preview-enhanced copied to clipboard

Title and toc autonumbering

Open wakkko opened this issue 6 years ago • 6 comments

Is it possible to get an option for TOC and title auto numbering ? Something similar as in this exemple link in typora

wakkko avatar Dec 03 '18 16:12 wakkko

You can place those CSS rules in ~/.mume/styles.less, on Windows that would be "%USERPROFILE%\.mume\styles.less", and it should work the same.

houghtonap avatar Jan 24 '19 11:01 houghtonap

All CSS rules can be put in a .css file in the same dir or subdir of markdown one, using file imports as specified in https://shd101wyy.github.io/markdown-preview-enhanced/#/file-imports.

szacchino avatar Feb 21 '19 15:02 szacchino

As @szacchino indicates you can import the rules, but there is a difference between putting them in ~/.mume/styles.less and using an import. The rules in ~/.mume/styles.less are embedded in the resulting HTML as opposed to being an external resource via a script tag in the resulting HTML.

houghtonap avatar Feb 21 '19 20:02 houghtonap

Even by importing those css, it did not work. There was no auto numbering happening

parthi2929 avatar Jun 11 '19 16:06 parthi2929

I modified the typora auto numering css code to get the title numbering with this plugin, you can change the other title as follows.

.markdown-preview.markdown-preview {
    /* your settings */
    
    /* title numering */
    counter-reset: h1;

    h1 {
        counter-reset: h2
    }

    h2 {
        counter-reset: h3
    }

    h1:before {
        counter-increment: h1;
        content: counter(h1) ". "
    }

    h2:before {
        counter-increment: h2;
        content: counter(h1) "." counter(h2) ". "
    }
}

EthanDeng avatar Nov 09 '19 03:11 EthanDeng

.markdown-preview.markdown-preview {
  // modify your style here
    /* Heading numbering, inspired by Typora 
     https://support.typora.io/Auto-Numbering/
    */  
    counter-reset: h1;

    h1 {
      counter-reset: h2
    }

    h2 {
        counter-reset: h3
    }

    h3 {
        counter-reset: h4
    }

    h4 {
        counter-reset: h5
    }

    h5 {
        counter-reset: h6
    }

    h1:before {
        counter-increment: h1;
        content: counter(h1) ". "
    }

    h2:before {
        counter-increment: h2;
        content: counter(h1) "." counter(h2) ". "
    }
    h3:before{
        counter-increment: h3;
        content: counter(h1) "." counter(h2) "." counter(h3) ". "
    }

    h4:before{
        counter-increment: h4;
        content: counter(h1) "." counter(h2) "." counter(h3) "." counter(h4) ". "
    }

    h5:before{
        counter-increment: h5;
        content: counter(h1) "." counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) ". "
    }
   h6:before{
        counter-increment: h6;
        content: counter(h1) "." counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) "." counter(h6) ". "
    }
  }

just in case someone wanted @EthanDeng 's solution extended 6 heading-levels deep

EDIT: It seems to only apply to the in-editor preview, not the html or pdf files. It would be great to get an easy to toggle option for this across various outputs

awillats avatar Mar 15 '22 18:03 awillats