@xiee/utils/css/book-litedown.css

Miscellaneous tools and utilities to manipulate HTML pages

/* CSS for https://yihui.org/litedown/ */

/* hide 4th-level TOC items when printing to PDF and 3rd-level in chapter TOC */
.pagesjs #TOC > ul > li > ul > li > ul > li > ul, .chapter-toc > ul > li > ul > li > ul {
  display: none;
}

.pagesjs {
  #tab\:assets tr > :nth-child(2) {
    display: none;
  }
}

.epigraph {
  position: relative;
  padding: 5px;
  margin-bottom: 4em;
  &, blockquote {
    border: 1px solid;
  }
  &::before, &::after, blockquote::before, blockquote::after {
    content: "•";
    position: absolute;
    border: 1px solid;
    display: inline-block;
    width: 1em;
    height: 1em;
    text-align: center;
    line-height: 1;
  }
  &::before {
    left: 5px;
  }
  &::after {
    content: "❀";
    color: rebeccapurple;
    font-size: 3em;
    text-align: right;
    border: none;
    opacity: .2;
    inset: 5px 5px auto auto;
  }
  blockquote {
    padding: 1em;
    &::before {
      inset: auto auto 5px 5px;
    }
    &::after {
      inset: auto 5px 5px auto;
    }
  }
  &.pagesjs-fragmented {
    &:not(.fragment-first), &:not(.fragment-last) blockquote {
      &::before, &::after {
        display: none;
      }
    }
    &:not(.fragment-first) {
      &, blockquote {
        padding-top: 1px;
      }
    }
    &:not(.fragment-last) {
      &, blockquote {
        padding-bottom: 1px;
      }
    }
  }
}

/* a tale of two buttons */
.new-road {
  p {
    display: flex;
    justify-content: center;
    gap: .5em;
  }
  button::before { font-size: 200%; }
  .old-knit, .new-fuse {
    &:hover::before { content: "❓ "; }
  }
  .old-knit {
    &::before { content: "🧶 "; }
    &:focus::before { content: "😡 "; }
  }
  .new-fuse::before { content: "↯ "; }
  .new-preview::before { content: "⏵ "; }
  .new-fuse:focus::before { content: "😇 "; }
}

/* arrange elements in columns */
.flex-col {
  gap: .5em;
  * {
    flex: 1 0 min-content;
  }
  pre:has(code[data-file]) {
    &, &::before {
      border: groove mintcream;
    }
    code {
      border: none;
      border-top: 1px dashed lightgray;
    }
    & {
      border-top: none;
    }
    &::before {
      border-left: none;
      border-bottom: none;
    }
  }
}

code[data-file]::before {
  content: attr(data-file);
  font-size: .9em;
  float: right;
  background: lightyellow;
  display: inline-block;
  padding: .5em;
  margin: -1em -1em 1em 1em;
}

pre:has(code[data-file]) {
  &::before {
    content: "Output";
    text-transform: uppercase;
    font-weight: bold;
    display: inline-block;
    padding: .5em 1em;
    border-bottom: none;
  }
  &:has(code[data-file$=".Rmd"])::before {
    content: "♧ Example";
  }
  &:has(code[data-source])::before {
    content: "♧ Source";
  }
  &.pagesjs-fragmented:first-child {
    &::before, code::before {
      content: unset;
    }
  }
  code, &::before {
    border: groove mintcream;
  }
  &::before {
    border-bottom: none;
  }
}

pre .ex-out::after {
  content: "⏵";
  position: absolute;
  inset: auto 5px 0 auto;
  text-decoration: none;
  font-size: 1.5em;
}

.no-ref-label {
  .cross-ref-sec:before {
    content: "";
  }
}

.larger { font-size: 1.5em; }