PDF export stylesheet for obsidian

print.css

/* Obsidian snippet to style output of pdf exports
 */

@media print {

  /* set your preferred fonts here.
   */

  :root {
    --body-font-family: "Newsreader Text", TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;
    --header-font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
    --code-font-family: MonoLisa, Menlo, SFMono-Regular, Consolas, "Roboto Mono", monospace;
  }

  body {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none;
  }

  /* If you find your font settings ae not being used for an element,
   * Add it below. You can fund the element by inspecting the document
   * in "Reading" mode in the console.
   */
  body, p, li, div.callout {
    line-height: 1.4;
    word-spacing: 1.1pt;
    letter-spacing: 0.2pt;
    font-family: var(--body-font-family);
    font-size: 12pt
  }

  /* */

  h1, h2, h3, h4, h5, h6 {
    font-family: var(--header-font-family);
    font-weight: normal !important
  }

  h1 {
    font-size: 19pt !important
  }

  h2 {
    font-size: 17pt !important
  }

  h3 {
    font-size: 15pt !important
  }

  h4, h5, h6 {
    font-size: 12pt !important
  }

  code, code[class*="language-"],
  pre, pre[class*="language-"] {
    font-size: 10pt;
    font-family: var(--code-font-family);
    color: black !important;
    background: none !important;
  }

  pre,
  code span,
  code {
    color: black !important
  }

  code {
    border: 1px solid darkgray !important;
    padding: 0 0.2em !important;
    line-height: initial !important;
    border-radius: 4px !important
  }

  pre {
    border: 1px solid darkgray !important;
    margin: 1em 0px !important;
    padding: 0.5em !important;
    border-radius: 4px !important
  }

  pre > code {
    font-size: 12px !important;
    border: none !important;
    border-radius: 0 !important;
    border-radius: 4px !important
  }

  blockquote {
    margin: 1.3em;
    padding: 1em;
    font-size: 10pt;
    color: darkslategray !important
  }

  hr {
    background-color: #ccc
  }

  img {
    display:block;
    margin: 1em 0
  }

  a img {
    border: none
  }

  table {
    margin: 1px;
    text-align: left
  }

  th {
    border-bottom: 1px aolis #333
  }

  td {
    border-bottom: 1px solid #333
  }

  th,td, tr {
    padding: 4px 10px 4px 0;
    color: black !important;
    background: none !important
  }

  tfoot {
    font-style: italic
  }

  caption {
    background: #fff;
    margin-bottom: 2em;
    text-align: left
  }

  thead {
    display: table-header-group
  }

  tr {
    page-break-inside: avoid
  }

  a {
    text-decoration: none;
    color: black !important
  }


  a[aria-label]::after {
    display: inline !important;
    content: " (" attr(aria-label) ")" !important;
    color: slategray !important;
    font-size: 70% !important;
  }

  a[class="tag"] {
    font-weight: bold;
    font-family: var(--font-monospace);
    background: none
  }

  .callout {
    background: none;
    border-width: 1px;
    border-color: rgba(var(--callout-color), 0.75)
  }

  /* -=-=-=-=-=-=-
   * Specific to custom checkboxes in @kepano's minimal theme
   */
  li[data-task="/"]>input:checked::after,
  input[type=checkbox]:checked::after {
    background-color: black
  }

  input[type=checkbox]:checked {
    background: none
  }

  ul>li.task-list-item[data-task="x"] {
    color: black
  }

  li[data-task="!"]>input:checked::after,
  li[data-task="*"]>input:checked::after,
  li[data-task='"']>input:checked::after,
  li[data-task="l"]>input:checked::after,
  li[data-task="b"]>input:checked::after,
  li[data-task="i"]>input:checked::after,
  li[data-task="S"]>input:checked::after,
  li[data-task="I"]>input:checked::after,
  li[data-task="p"]>input:checked::after,
  li[data-task="c"]>input:checked::after,
  li[data-task="f"]>input:checked::after,
  li[data-task="k"]>input:checked::after,
  li[data-task="w"]>input:checked::after,
  li[data-task="u"]>input:checked::after,
  li[data-task="d"]>input:checked::after,
  li[data-task="?"]>input:checked::after {
    background: none !important;
    -webkit-mask-image: none !important
  }
  /* -=-=-=-=-=-=- */

}

@ScottKillen

Well darn! I'm actually not using a theme right now, unless that's the problem? I downloaded and tried 'Things' and it still didn't work.
Very bizarre that it works for you when it doesn't on my end... Is it even working when exported as a PDF?

@InvaderHawk

I use the minimal theme. Maybe that is it? I know printing support is sketchy for a lot of platforms.

@ScottKillen

I've tried it with that theme too, but to no avail! Well, it's alright, I can work with it. Thank you so much for trying to help me figure it out!

@InvaderHawk 👍

how do you have Obsidian print 1" standard margins?

@yosun Something like this might work:

@page {
    margin: 0.5in; /* set margin on each page */
    size: 8.5in 11in; /* set page size */
  }

See Printing With Style: Using CSS for Printer Optimization

i ended up using this though it is perhaps a bit overkill simply to generate standard 1in" margins for print https://github.com/yosun/Obsidian-academic-export

You can use this snippet for margins:

/* Page structure. */
@page { 
 margin-top: 60px !important;
 margin-left: 60px !important;
 margin-right: 60px !important;
 margin-bottom: 60px !important;
}

You can use this snippet for margins:

Thanks, @Pri5m4

@InvaderHawk @ScottKillen on the off chance that this is still an ongoing issue (and for anyone coming here in the future), the solution for the weird margin spacing is to add !important after it. I was having the exact same issue, and that was the end solution I found.

    p {
        text-indent: 2em;
        margin: 0 !important;
        padding: 0 !important;
      }

Thanks for the export CSS, this was super helpful!

Thank you! @lindsaykwardell