font-family: "Times New Roman", Times, serif;
line-height: 1.6;
letter-spacing: 0.02em;
- column-count: auto;
- column-width: 15em;
}
-header, p:first-of-type, pre:first-of-type { column-span: all }
+@media only screen and (min-width: 500px) {
+ body {
+ overflow-x: auto;
+ }
-h1, h2, h3 { font-weight: normal }
+ .columned {
+ height: calc(100vh - 180px);
+ width: max-content;
+ }
-h2 { break-before: column }
+ .columned .h2 {
+ float: left;
+ margin: 0 40px;
+ height: calc(100vh - 180px);
+ }
-p { break-inside: avoid }
+ .columned h2 {
+ width: 14.6em;
+ }
+ .columned .h3, .columned p {
+ width: 22em;
+ break-inside: prevent;
+ }
+
+ .columned pre { width: 25em }
+}
+
+blockquote, p { max-width: 45em }
+pre { max-width: 55em }
+blockquote {
+ border-left: 4px solid #ccc;
+ padding-left: 10px;
+}
+
+h1, h2, h3 { font-weight: normal }
+br { display: none }
pre {
font-family: Monaco, monospace;
font-size: 14px;
background-color: #eee;
+ overflow-x: auto;
}
canvas {