Print ready rulebook

So I’ve come across print specific styles in CSS in the past, but this is the first time I have had a proper usecase for them.

I defaulted to A4 pages, as at least here in Australia, it is by far the most common paper size.

The concept is pretty simple - hide all of the irrelevant things, make a few extra things show, then make it look good. In practice it’s…honestly not too bad.

The CSS command is ‘@media print’ and whenever anyone hits print, these custom styles apply.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
    .print-hide, .site-meta, .site-avatar, .site-name, .site-description, .back-to, 
    .sidebar, .left-sidebar, #toggle-menu, .svg-object, .comments, .article-time--reading, .icon-tabler-clock, 
    summary::marker, .article-header::before, .site-theme-by, .site-enhancers-by {
        display: none!important;
    }

    .print-reveal {
        display: block !important;
        break-before: page;
    }
    

  body::before, body::after, html::before, html::after {
        content: none !important;
        display: none !important;
    }

Then we add some simple margins and page numbers:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
@media print {
    @page {
      size: A4;
      margin: 1cm;
      @bottom-center { 
          content: counter(page);
          color: #000;
          background-color: #fff;
          font-size: 9pt;
      }
    }
}

Next are a bunch of styles being removed so it’s a very clean print - I’ll probably add in more later, but at this stage it’s easier to work from a clean slate.

Then we can use the ‘break-after’, ‘orphans’ and ‘widows’ to make some powerful

1
2
3
      break-after: avoid;
      orphans: 3; 
      widows: 3; 

In typography, a widow is the last line of a paragraph that appears alone at the top of a page. (The paragraph is continued from a prior page.) - https://developer.mozilla.org/en-US/docs/Web/CSS/widows

In typography, an orphan is the first line of a paragraph that appears alone at the bottom of a page. (The paragraph continues on a following page.) - https://developer.mozilla.org/en-US/docs/Web/CSS/orphans

Rulebook order change

I’ve moved Volcanic Powers to the very end, they’re essentially a glossary of all the powers. Though I do wonder if scoring at the end would make the most sense. Might have to get people to vote on it.

Caldera/Appeasement has also been added, mechanically it makes the most sense after Buy a Tile or even as part of Buy a Tile. Thematically it fits well towards the end with sacrifices and lava movement.

I’ll play around with this no doubt.