killercup/pandoc.css

Clean, perfect. Good Job

What's the license for this? May I use it on a public website?

Thanks for your interest! Gist doesn't send notifications for comments, if you want to get in touch with me, tweet/mail/IM me.

@durka, feel free to assume its public domain || CC0 || MIT || Apache 2.0 :) I'm not sure I came up with all of it myself (like that _font-face trick or the usage of content with attr), but what I did copy should be (commonly) known patterns.

@killercup this is awesome. Thank you for sharing!

Nice theme, thank you very much.

Love it! Thanks a bunch!

Thank you!

Bra-vo!

I have added css in below format , but its not working . Please help me on this.

args = ' --css pandoc.css inputfile.html -o outputfile.docx ';
Where the i/p file is html and output is an docx file.

and calling the pandoc as
src = ' ';
callback = function(err, result) {
if (err) console.error('Oh Nos: ', err);
else {
// Without the -o arg, the converted value will be returned.
return console.log(result), result;
}
};

// // Call pandoc

pandoc(src, args, callback);

Thank you. Amazing css.

From the command line you now need to use --css=pandoc.css or -c pandoc.css not --css pandoc.css

Hello everyone. I stuck at one place while converting html to word file. I want to add stylesheet_green.css to html but it is displaying only data not css in word file. Please suggest me what mistake I am doing.
Code is:

import pypandoc
output = pypandoc.convert(source='demo.html', format='html', to='docx', outputfile='swar.docx', extra_args='--css=stylesheet_green.css'])
 

Just a note: When running from command line with the latest pandoc v2.2.1, it works only when passed the --standalone or -s flag:

pandoc -c pandoc.css -s in.md -o out.html

@swarnimaeverest pandoc doesn't interpret the css for docx, only for doc, see jgm/pandoc#4354

Hello everyone. I stuck at one place while converting html to word file. I want to add stylesheet_green.css to html but it is displaying only data not css in word file. Please suggest me what mistake I am doing.
Code is:

import pypandoc
output = pypandoc.convert(source='demo.html', format='html', to='docx', outputfile='swar.docx', extra_args='--css=stylesheet_green.css'])
 

Under what license did you release that css? Could you include a license notice?

I second typetetris. In the meantime, I will include your name in a comment, if that's not a problem.

Great stuff! Really makes a nice looking layout. However, wondering what is the point of this?

pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;  /* (this) */
}

As is, it breaks the format I put my code blocks in. For example, given

```java
boolean hasAnyAddressValue =
	location.hasLine1()
	|| location.hasLine2()
	|| location.hasCity()
	|| location.hasState()
	|| location.hasPostalCode();
```

Will generate,

However, when that line is commented out, I get the (more pleasing) output as below,

FWIW, I am compiling this using pandoc -t html5 --css pandoc.css file.md -o file.pdf.

For those interested in code readability, I added background-color: #ececec; in the block pre, code, kbd, samp {}
and added this block for code blocks :

pre.sourceCode, code.sourceCode {
    background-color: #ececec;
}

Here is a screenshot for the inline code :

From the command line you now need to use --css=pandoc.css or -c pandoc.css not --css pandoc.css

Thanks!

Just a note: When running from command line with the latest pandoc v2.2.1, it works only when passed the --standalone or -s flag:

pandoc -c pandoc.css -s in.md -o out.html

This saved me, thank you!

btw. pandoc >= version 2.11 comes with built-in CSS that's fairly similar... see https://pandoc.org/MANUAL.html#variables-for-html

This is wonderful. I am now able to charge two times more money when generating docs for customers 😇 (in my dreams...)

THANK YOU!

Just to make @mb21's comment a bit more tangible:

From version 2.11 onwards you can just do (and it will get you fairly close):

pandoc -s README.md -o index.html -M document-css==templates/styles.html

@athalhammer you don't even need to set the document-css variable... that should be the default...

Thanks, @mb21, makes sense!

I have no idea what I'm doing wrong, but I cannot get this to work with line breaks.

/* This defines styles and classes used in the book */
body { margin: 5%; text-align: justify; font-size: medium; }

pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
  }

pre, code, kbd, samp {
    color: #000;
    font-family: monospace, monospace;
    _font-family: 'courier new', monospace;
    font-size: 0.98em;
}

pre.sourceCode, code.sourceCode {
    background-color: #ececec;
}

/* code, pre {
    white-space: pre-wrap;
    font-family: monospace;
} */

h1 { text-align: left; }
h2 { text-align: left; }
h3 { text-align: left; }
h4 { text-align: left; }
h5 { text-align: left; }
h6 { text-align: left; }
h1.title { }
h2.author { }
h3.date { }
ol.toc { padding: 0; margin-left: 1em; }
ol.toc li { list-style-type: none; margin: 0; padding: 0; }
a.footnote-ref { vertical-align: super; }
em, em em em, em em em em em { font-style: italic;}
em em, em em em em { font-style: normal; }

epub:
	pandoc -s $(INPUT_FILES) --toc $(EPUB_METADATA_FILE) -c $(STYLE) --variable subparagraph -o $(EPUB_OUTPUT_FILENAME)

This is wonderful and going to be commonly used by me. Thanks SO much!

In case anyone wants to use this without having to save this file locally:

$ pandoc --css "https://rawgit.com/killercup/5917178/raw/40840de5352083adb2693dc742e9f75dbb18650f/pandoc.css" -so outfile.html infile.md

Credit to @iconoclast on StackOverflow.

Is there a way to add color to python code?

I see color in the html, but the it's printed in b&w...

I don't know if this css is still being mantained or if there are other standards right now.

Fun snippet that

• collects all .md files in dir matching ls globbing: $(ls [0-9][0-9]*.md)
• makes $date var available to document
• loads external css (latex.css)
• overrides external css (max-width change)

pandoc -V "date:$(date +"%Y-%m-%d %H:%M:%S")" \
    -s -o documentation.html $(ls [0-9][0-9]*.md) \
    --css "https://latex.vercel.app/style.css" \
    -H <(printf '<style>\n%s\n</style>' "$(printf 'body { max-width: 100ch !important; }\n')")\
    --metadata title="Documentation"