If it’s worth doing once, it’s worth doing twice, and after the second time, worth extracting. So after writing my first cheat sheet for assert_select, I extracted the stylesheet and created a couple more.
The stylesheet includes formatting for viewing in the browser, and for dead-tree delivery. Tested with FireFox and Acrobat. Can’t guarantee it will print well in other browsers. In fact, I’m pretty sure it won’t (read below for why).
Here’s what I learned from this experiment:
- There’s no easy way to create page templates, so I just repeat the header on every page. All but the first use the class
printedto hide when viewed in the browser. - Margins and page breaks don’t work together in FireFox. The spec says, but obviously the spec is wrong. So all but the first header use a white border to create a fake top margin.
- I like
dllists, so I use them for both method signature/description and two-column lists. In the second case, the styling is picked from the classcompact. - Printed media doesn’t do
em, printed media doescm. So all margins and sizings are duplicated as well. - The layout looks good in FireFox Print Preview, though the text can get wonky when you mix proportional and monospace fonts. But it prints correctly if you skip the preview step.
- If you thought repeating the headers and sizing information is painful, try printing to ps, converting to pdf, previewing in Acrobat and repeating 100x to get the exact top border height, which happens to be slightly smaller than the top margin it attempts to replace.
- Oy vey.
Don’t have the time and energy? Here’s the stylesheet I use:
body {
background: white;
font-family: Verdana, "Lucida Grande", Arial, Helvetica, sans-serif;
text-align: left;
margin: 2em;
}
h1 {
background: #b90b0a;
color: white;
padding: 0 0.5em 0.3em 0.5em;
font-size: 2em;
margin: 0 0 0.5em 0;
}
h1.separator {
display: none;
}
h2 {
color: #aba9a8;
}
p, dl, dl dt {
margin: 0 0 0.5em 0;
}
dl dt {
font-weight: bold;
}
dl dd {
margin: 0 0 0.5em 2em;
}
dl.compact dt {
float: left;
clear: both;
display: inline;
width: 15em;
margin: 0;
font-weight: normal;
font-family: "Courier New";
}
dl.compact dd {
margin: 0 0 0.3em 15em;
}
code, pre {
font-family: "Courier New";
}
pre {
font-weight: bold;
}
@media print {
@page {
size: 8in 8in;
margin: 1cm;
}
body {
font-size: 11pt;
}
h1 {
padding: 0.3cm;
font-size: 200%;
margin: 0 0 0.6cm 0;
}
h1.separator {
border-top: 0.77cm solid white;
display: block;
page-break-before: always;
}
p, dl, dl dt {
margin: 0 0 0.3cm 0;
}
dl dd {
margin: 0 0 0.3cm 0.6cm;
}
dl.compact dt {
width: 6cm;
margin: 0;
}
dl.compact dd {
margin: 0 0 0.15cm 6cm;
}
}
Labnotes » Rounded Corners