Sharing common custom CSS

Theming
1

Would anyone be interested in compiling/sharing custom CSS they use regularly? I have a few alterations I make on most PDF exports.

I’ve been meaning to compile them for my own uses, but I thought possibly others have similar alterations, and we could use the opportunity to swap, share, etc. I’m imagining like an index-type resource with sample code that can be copied easily.

Here are some examples of common changes I make to the basic themes for PDF exports:

  • reducing padding on textbox headers to keep page count lower for heavy users of textboxes
  • allowing page breaks in tables that are very large, so as not to cause a blank page prior
  • spacing adjustments for equations generated from LaTeX
  • setting “float on the next page” rules for images

Sound fun? Or does this exist already and I’m just reinventing the wheel?

6 Likes
2

@allisonbrown allison these are useful … they are probably things we might consider (at some point in the future) including as options in the interface so you could just select them rather than dropping in CSS. So I’d say yes please, share the CSS.

Here’s mine (from the old days!), I include a float-top setting on images so that you don’t get blank pages. Would probably do same for textboxes/tables etc if using them. CSS is something like this, but it’s been a while!

.wp-caption {
  height: auto;
  max-width: 100%;
  margin: 1em 0;
  float: column-top;
  column-span: 2;
}
3 Likes
3

I’m interested! Here are mine (so far):

/* makes the text for the previous/next buttons in the webbook bigger */
.nav-reading__next a, .nav-reading__previous a {
    font-size: .99rem !important;
}

/* disables hyphenated words */
* {
  adobe-hyphenate: none !important;
  -webkit-hyphens: none !important;
  -moz-hyphens: none !important;
  -ms-hyphens: none !important;
  -epub-hyphens: none !important;
  hyphens: none !important;
}
4

Hello Allison,

This would be really helpful! We are using the Jacobs theme and are running into several formatting issues in the PDF.

  • We use many boxes, so reducing the header padding would definitely be helpful for us! Also, we have an icon in the textbox header, and including the icon messes up the alignment and spacing, so we had to disable it in the PDF version, although the online version has the icon.
  • We are also running into some issues with multi-level lists and spacing.

We are muddling our way through these, but not sure we are doing it the right way! Any code available for these would be super helpful. And as we develop that works as it should, would be happy to share!

Thank you.
Shuchi