From 7038e4ff89d53dcbf05cc151d7a8a91c4bf0f96e Mon Sep 17 00:00:00 2001 From: slashformotion Date: Sun, 25 Jul 2021 10:05:32 +0200 Subject: [PATCH] css update --- static/css/hugo-tufte.css | 58 ++-- static/css/syntax.css | 82 ++++++ static/css/tufte.css | 555 +++++++++++++++++++++++++------------- 3 files changed, 481 insertions(+), 214 deletions(-) create mode 100644 static/css/syntax.css diff --git a/static/css/hugo-tufte.css b/static/css/hugo-tufte.css index 25ac266..6d61172 100644 --- a/static/css/hugo-tufte.css +++ b/static/css/hugo-tufte.css @@ -4,6 +4,8 @@ /* accomodate a blog-like site. */ /* ------------------------------------------------------------------------ */ +@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@351&display=swap'); + /* When setting the primary font stack, apply it to the Pure grid units along */ /* with `html`, `button`, `input`, `select`, and `textarea`. Pure Grids use */ /* specific font stacks to ensure the greatest OS/browser compatibility. */ @@ -18,16 +20,27 @@ html, button, input, select, textarea, p, nav, section, article, header, footer, }*/ code { - font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; + font-family: "Fira Code", Consolas, "Liberation Mono", Menlo, Courier, monospace; font-size: 1.125rem; line-height: 1.6; } +div.highlight{ + /* width: 52.5%; */ +} +/* blockquote { + width: 52.5%; + +} */ +div.highlight::hover{ + width: 100%; +} + pre code { width: 52.5%; - font-size: 1.2rem; - padding-left: 2.5%; display: block; + font-size: 1rem; + padding-left: 2.5%; overflow-x: scroll; } @@ -187,7 +200,22 @@ h1.content-title a:focus { } table { + margin-top: 1em; font-size: 1.4rem; + width: auto; /* making booktabs style tables the unstyled default in case someone uses Markdown styling */ + /* margin: 0 auto; */ + /* border-spacing: 0px; */ + border-top: 2px solid #111; + border-bottom: 2px solid #111; +} + +th, td{ + font-size: 1.25rem; + line-height: 1.71428571; +} + +td { + padding-right: 0.75em; } /* Footer, but with a different name to avoid conflicts with tufte.css */ @@ -259,27 +287,3 @@ details summary.year { details[open] summary { } - - -/* ------------------------------------------------------------------------ */ -/* MathJax styling -/* ------------------------------------------------------------------------ */ -.MathJax { - font: inherit; - color: inherit; - font-size: 100%; - background: inherit; - border: inherit; -} - -.MathJax_Display { - font: inherit; - color: inherit; - font-size: 100%; - background: inherit; - border: inherit; - padding-bottom: 1rem; - /* max-width: 45rem; */ - overflow-x: auto; - overflow-y: auto; -} diff --git a/static/css/syntax.css b/static/css/syntax.css new file mode 100644 index 0000000..20458cb --- /dev/null +++ b/static/css/syntax.css @@ -0,0 +1,82 @@ +/* Background */ .chroma { background-color: #ffffff } +/* Other */ .chroma .x { } +/* Error */ .chroma .err { } +/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; } +/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; } +/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #ffffcc } +/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } +/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } +/* Keyword */ .chroma .k { font-weight: bold } +/* KeywordConstant */ .chroma .kc { font-weight: bold } +/* KeywordDeclaration */ .chroma .kd { font-weight: bold; font-style: italic } +/* KeywordNamespace */ .chroma .kn { font-weight: bold } +/* KeywordPseudo */ .chroma .kp { font-weight: bold } +/* KeywordReserved */ .chroma .kr { font-weight: bold } +/* KeywordType */ .chroma .kt { font-weight: bold } +/* Name */ .chroma .n { } +/* NameAttribute */ .chroma .na { } +/* NameBuiltin */ .chroma .nb { font-weight: bold; font-style: italic } +/* NameBuiltinPseudo */ .chroma .bp { font-weight: bold; font-style: italic } +/* NameClass */ .chroma .nc { color: #666666; font-weight: bold; font-style: italic } +/* NameConstant */ .chroma .no { color: #666666; font-weight: bold; font-style: italic } +/* NameDecorator */ .chroma .nd { } +/* NameEntity */ .chroma .ni { } +/* NameException */ .chroma .ne { } +/* NameFunction */ .chroma .nf { color: #666666; font-weight: bold; font-style: italic } +/* NameFunctionMagic */ .chroma .fm { } +/* NameLabel */ .chroma .nl { } +/* NameNamespace */ .chroma .nn { color: #666666; font-weight: bold; font-style: italic } +/* NameOther */ .chroma .nx { } +/* NameProperty */ .chroma .py { } +/* NameTag */ .chroma .nt { } +/* NameVariable */ .chroma .nv { color: #666666; font-weight: bold; font-style: italic } +/* NameVariableClass */ .chroma .vc { } +/* NameVariableGlobal */ .chroma .vg { } +/* NameVariableInstance */ .chroma .vi { } +/* NameVariableMagic */ .chroma .vm { } +/* Literal */ .chroma .l { } +/* LiteralDate */ .chroma .ld { } +/* LiteralString */ .chroma .s { color: #666666; font-style: italic } +/* LiteralStringAffix */ .chroma .sa { color: #666666; font-style: italic } +/* LiteralStringBacktick */ .chroma .sb { color: #666666; font-style: italic } +/* LiteralStringChar */ .chroma .sc { color: #666666; font-style: italic } +/* LiteralStringDelimiter */ .chroma .dl { color: #666666; font-style: italic } +/* LiteralStringDoc */ .chroma .sd { color: #666666; font-style: italic } +/* LiteralStringDouble */ .chroma .s2 { color: #666666; font-style: italic } +/* LiteralStringEscape */ .chroma .se { color: #666666; font-style: italic } +/* LiteralStringHeredoc */ .chroma .sh { color: #666666; font-style: italic } +/* LiteralStringInterpol */ .chroma .si { color: #666666; font-style: italic } +/* LiteralStringOther */ .chroma .sx { color: #666666; font-style: italic } +/* LiteralStringRegex */ .chroma .sr { color: #666666; font-style: italic } +/* LiteralStringSingle */ .chroma .s1 { color: #666666; font-style: italic } +/* LiteralStringSymbol */ .chroma .ss { color: #666666; font-style: italic } +/* LiteralNumber */ .chroma .m { } +/* LiteralNumberBin */ .chroma .mb { } +/* LiteralNumberFloat */ .chroma .mf { } +/* LiteralNumberHex */ .chroma .mh { } +/* LiteralNumberInteger */ .chroma .mi { } +/* LiteralNumberIntegerLong */ .chroma .il { } +/* LiteralNumberOct */ .chroma .mo { } +/* Operator */ .chroma .o { } +/* OperatorWord */ .chroma .ow { font-weight: bold } +/* Punctuation */ .chroma .p { } +/* Comment */ .chroma .c { color: #888888; font-style: italic } +/* CommentHashbang */ .chroma .ch { color: #888888; font-style: italic } +/* CommentMultiline */ .chroma .cm { color: #888888; font-style: italic } +/* CommentSingle */ .chroma .c1 { color: #888888; font-style: italic } +/* CommentSpecial */ .chroma .cs { color: #888888; font-weight: bold } +/* CommentPreproc */ .chroma .cp { color: #888888; font-weight: bold } +/* CommentPreprocFile */ .chroma .cpf { color: #888888; font-weight: bold } +/* Generic */ .chroma .g { } +/* GenericDeleted */ .chroma .gd { } +/* GenericEmph */ .chroma .ge { } +/* GenericError */ .chroma .gr { } +/* GenericHeading */ .chroma .gh { } +/* GenericInserted */ .chroma .gi { } +/* GenericOutput */ .chroma .go { } +/* GenericPrompt */ .chroma .gp { } +/* GenericStrong */ .chroma .gs { } +/* GenericSubheading */ .chroma .gu { } +/* GenericTraceback */ .chroma .gt { } +/* GenericUnderline */ .chroma .gl { } +/* TextWhitespace */ .chroma .w { } diff --git a/static/css/tufte.css b/static/css/tufte.css index a3f2932..cc27a92 100644 --- a/static/css/tufte.css +++ b/static/css/tufte.css @@ -6,269 +6,450 @@ @font-face { font-family: "et-book"; src: url("et-book/et-book-roman-line-figures/et-book-roman-line-figures.eot"); - src: url("et-book/et-book-roman-line-figures/et-book-roman-line-figures.eot?#iefix") format("embedded-opentype"), url("et-book/et-book-roman-line-figures/et-book-roman-line-figures.woff") format("woff"), url("et-book/et-book-roman-line-figures/et-book-roman-line-figures.ttf") format("truetype"), url("et-book/et-book-roman-line-figures/et-book-roman-line-figures.svg#etbookromanosf") format("svg"); + src: url("et-book/et-book-roman-line-figures/et-book-roman-line-figures.eot?#iefix") format("embedded-opentype"), + url("et-book/et-book-roman-line-figures/et-book-roman-line-figures.woff") format("woff"), + url("et-book/et-book-roman-line-figures/et-book-roman-line-figures.ttf") format("truetype"), + url("et-book/et-book-roman-line-figures/et-book-roman-line-figures.svg#etbookromanosf") format("svg"); font-weight: normal; - font-style: normal + font-style: normal; } @font-face { font-family: "et-book"; src: url("et-book/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.eot"); - src: url("et-book/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.eot?#iefix") format("embedded-opentype"), url("et-book/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.woff") format("woff"), url("et-book/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.ttf") format("truetype"), url("et-book/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.svg#etbookromanosf") format("svg"); + src: url("et-book/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.eot?#iefix") + format("embedded-opentype"), + url("et-book/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.woff") format("woff"), + url("et-book/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.ttf") + format("truetype"), + url("et-book/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.svg#etbookromanosf") + format("svg"); font-weight: normal; - font-style: italic + font-style: italic; } @font-face { font-family: "et-book"; src: url("et-book/et-book-bold-line-figures/et-book-bold-line-figures.eot"); - src: url("et-book/et-book-bold-line-figures/et-book-bold-line-figures.eot?#iefix") format("embedded-opentype"), url("et-book/et-book-bold-line-figures/et-book-bold-line-figures.woff") format("woff"), url("et-book/et-book-bold-line-figures/et-book-bold-line-figures.ttf") format("truetype"), url("et-book/et-book-bold-line-figures/et-book-bold-line-figures.svg#etbookromanosf") format("svg"); + src: url("et-book/et-book-bold-line-figures/et-book-bold-line-figures.eot?#iefix") format("embedded-opentype"), + url("et-book/et-book-bold-line-figures/et-book-bold-line-figures.woff") format("woff"), + url("et-book/et-book-bold-line-figures/et-book-bold-line-figures.ttf") format("truetype"), + url("et-book/et-book-bold-line-figures/et-book-bold-line-figures.svg#etbookromanosf") format("svg"); font-weight: bold; - font-style: normal + font-style: normal; } @font-face { font-family: "et-book-roman-old-style"; src: url("et-book/et-book-roman-old-style-figures/et-book-roman-old-style-figures.eot"); - src: url("et-book/et-book-roman-old-style-figures/et-book-roman-old-style-figures.eot?#iefix") format("embedded-opentype"), url("et-book/et-book-roman-old-style-figures/et-book-roman-old-style-figures.woff") format("woff"), url("et-book/et-book-roman-old-style-figures/et-book-roman-old-style-figures.ttf") format("truetype"), url("et-book/et-book-roman-old-style-figures/et-book-roman-old-style-figures.svg#etbookromanosf") format("svg"); + src: url("et-book/et-book-roman-old-style-figures/et-book-roman-old-style-figures.eot?#iefix") + format("embedded-opentype"), + url("et-book/et-book-roman-old-style-figures/et-book-roman-old-style-figures.woff") format("woff"), + url("et-book/et-book-roman-old-style-figures/et-book-roman-old-style-figures.ttf") format("truetype"), + url("et-book/et-book-roman-old-style-figures/et-book-roman-old-style-figures.svg#etbookromanosf") format("svg"); font-weight: normal; font-style: normal; } /* Tufte CSS styles */ -html { font-size: 15px; } +html { + font-size: 15px; +} -body { width: 87.5%; - margin-left: auto; - margin-right: auto; - padding-left: 12.5%; - font-family: et-book, Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif; - background-color: #fffff8; - color: #111; - max-width: 1400px; - counter-reset: sidenote-counter; } +body { + width: 87.5%; + margin-left: auto; + margin-right: auto; + padding-left: 12.5%; + font-family: et-book, Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif; + background-color: #fffff8; + color: #111; + max-width: 1400px; + counter-reset: sidenote-counter; +} -h1 { font-weight: 400; - margin-top: 4rem; - margin-bottom: 1.5rem; - font-size: 3.2rem; - line-height: 1; } +h1 { + font-weight: 400; + margin-top: 4rem; + margin-bottom: 1.5rem; + font-size: 3.2rem; + line-height: 1; +} -h2 { font-style: italic; - font-weight: 400; - margin-top: 2.1rem; - margin-bottom: 0; - font-size: 2.2rem; - line-height: 1; } +h2 { + font-style: italic; + font-weight: 400; + margin-top: 2.1rem; + margin-bottom: 0; + font-size: 2.2rem; + line-height: 1; +} -h3 { font-style: italic; - font-weight: 400; - font-size: 1.7rem; - margin-top: 2rem; - margin-bottom: 0; - line-height: 1; } +h3 { + font-style: italic; + font-weight: 400; + font-size: 1.7rem; + margin-top: 2rem; + margin-bottom: 0; + line-height: 1; +} -p.subtitle { font-style: italic; - margin-top: 1rem; - margin-bottom: 1rem; - font-size: 1.8rem; - display: block; - line-height: 1; } +p.subtitle { + font-style: italic; + margin-top: 1rem; + margin-bottom: 1rem; + font-size: 1.8rem; + display: block; + line-height: 1; +} -.numeral { font-family: et-book-roman-old-style; } +.numeral { + font-family: et-book-roman-old-style; +} -.danger { color: red; } +.danger { + color: red; +} -article { position: relative; - padding: 5rem 0rem; } +article { + position: relative; + padding: 5rem 0rem; +} -section { padding-top: 1rem; - padding-bottom: 1rem; } +section { + padding-top: 1rem; + padding-bottom: 1rem; +} -p, ol, ul { font-size: 1.4rem; } +p, +ol, +ul { + font-size: 1.4rem; +} -p { line-height: 2rem; - margin-top: 1.4rem; - margin-bottom: 1.4rem; - padding-right: 0; - vertical-align: baseline; } +p { + line-height: 2rem; + margin-top: 1.4rem; + margin-bottom: 1.4rem; + padding-right: 0; + vertical-align: baseline; +} /* Chapter Epigraphs */ -div.epigraph { margin: 5em 0; } +div.epigraph { + margin: 5em 0; +} -div.epigraph > blockquote { margin-top: 3em; - margin-bottom: 3em; } +div.epigraph > blockquote { + margin-top: 3em; + margin-bottom: 3em; +} -div.epigraph > blockquote, div.epigraph > blockquote > p { font-style: italic; } +div.epigraph > blockquote, +div.epigraph > blockquote > p { + font-style: italic; +} -div.epigraph > blockquote > footer { font-style: normal; } +div.epigraph > blockquote > footer { + font-style: normal; +} -div.epigraph > blockquote > footer > cite { font-style: italic; } +div.epigraph > blockquote > footer > cite { + font-style: italic; +} /* end chapter epigraphs styles */ -blockquote { font-size: 1.4rem; } +blockquote { + font-size: 1.4rem; +} -blockquote p { width: 50%; } +blockquote p { + width: 50%; +} -blockquote footer { width: 50%; - font-size: 1.1rem; - text-align: right; } +blockquote footer { + width: 50%; + font-size: 1.1rem; + text-align: right; +} -ol, ul { width: 45%; - -webkit-padding-start: 5%; - -webkit-padding-end: 5%; } +ol, +ul { + width: 45%; + -webkit-padding-start: 5%; + -webkit-padding-end: 5%; +} -li { padding: 0.5rem 0; } +li { + padding: 0.5rem 0; +} -figure { padding: 0; - border: 0; - font-size: 100%; - font: inherit; - vertical-align: baseline; - max-width: 55%; - -webkit-margin-start: 0; - -webkit-margin-end: 0; - margin: 0 0 3em 0; } +figure { + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; + max-width: 55%; + -webkit-margin-start: 0; + -webkit-margin-end: 0; + margin: 0 0 3em 0; +} -figcaption { float: right; - clear: right; - margin-right: -48%; - margin-top: 0; - margin-bottom: 0; - font-size: 1.1rem; - line-height: 1.6; - vertical-align: baseline; - position: relative; - max-width: 40%; } +figcaption { + float: right; + clear: right; + margin-right: -48%; + margin-top: 0; + margin-bottom: 0; + font-size: 1.1rem; + line-height: 1.6; + vertical-align: baseline; + position: relative; + max-width: 40%; +} -figure.fullwidth figcaption { margin-right: 24%; } +figure.fullwidth figcaption { + margin-right: 24%; +} /* Links: replicate underline that clears descenders */ -a:link, a:visited { color: inherit; } +a:link, +a:visited { + color: inherit; +} -a:link { text-decoration: none; - background: -webkit-linear-gradient(#fffff8, #fffff8), -webkit-linear-gradient(#fffff8, #fffff8), -webkit-linear-gradient(#333, #333); - background: linear-gradient(#fffff8, #fffff8), linear-gradient(#fffff8, #fffff8), linear-gradient(#333, #333); - -webkit-background-size: 0.05em 1px, 0.05em 1px, 1px 1px; - -moz-background-size: 0.05em 1px, 0.05em 1px, 1px 1px; - background-size: 0.05em 1px, 0.05em 1px, 1px 1px; - background-repeat: no-repeat, no-repeat, repeat-x; - text-shadow: 0.03em 0 #fffff8, -0.03em 0 #fffff8, 0 0.03em #fffff8, 0 -0.03em #fffff8, 0.06em 0 #fffff8, -0.06em 0 #fffff8, 0.09em 0 #fffff8, -0.09em 0 #fffff8, 0.12em 0 #fffff8, -0.12em 0 #fffff8, 0.15em 0 #fffff8, -0.15em 0 #fffff8; - background-position: 0% 93%, 100% 93%, 0% 93%; } +a:link { + text-decoration: none; + background: -webkit-linear-gradient(#fffff8, #fffff8), -webkit-linear-gradient(#fffff8, #fffff8), + -webkit-linear-gradient(#333, #333); + background: linear-gradient(#fffff8, #fffff8), linear-gradient(#fffff8, #fffff8), linear-gradient(#333, #333); + -webkit-background-size: 0.05em 1px, 0.05em 1px, 1px 1px; + -moz-background-size: 0.05em 1px, 0.05em 1px, 1px 1px; + background-size: 0.05em 1px, 0.05em 1px, 1px 1px; + background-repeat: no-repeat, no-repeat, repeat-x; + text-shadow: 0.03em 0 #fffff8, -0.03em 0 #fffff8, 0 0.03em #fffff8, 0 -0.03em #fffff8, 0.06em 0 #fffff8, + -0.06em 0 #fffff8, 0.09em 0 #fffff8, -0.09em 0 #fffff8, 0.12em 0 #fffff8, -0.12em 0 #fffff8, 0.15em 0 #fffff8, + -0.15em 0 #fffff8; + background-position: 0% 93%, 100% 93%, 0% 93%; +} -@media screen and (-webkit-min-device-pixel-ratio: 0) { a:link { background-position-y: 87%, 87%, 87%; } } +@media screen and (-webkit-min-device-pixel-ratio: 0) { + a:link { + background-position-y: 87%, 87%, 87%; + } +} -a:link::selection { text-shadow: 0.03em 0 #b4d5fe, -0.03em 0 #b4d5fe, 0 0.03em #b4d5fe, 0 -0.03em #b4d5fe, 0.06em 0 #b4d5fe, -0.06em 0 #b4d5fe, 0.09em 0 #b4d5fe, -0.09em 0 #b4d5fe, 0.12em 0 #b4d5fe, -0.12em 0 #b4d5fe, 0.15em 0 #b4d5fe, -0.15em 0 #b4d5fe; - background: #b4d5fe; } +a:link::selection { + text-shadow: 0.03em 0 #b4d5fe, -0.03em 0 #b4d5fe, 0 0.03em #b4d5fe, 0 -0.03em #b4d5fe, 0.06em 0 #b4d5fe, + -0.06em 0 #b4d5fe, 0.09em 0 #b4d5fe, -0.09em 0 #b4d5fe, 0.12em 0 #b4d5fe, -0.12em 0 #b4d5fe, 0.15em 0 #b4d5fe, + -0.15em 0 #b4d5fe; + background: #b4d5fe; +} -a:link::-moz-selection { text-shadow: 0.03em 0 #b4d5fe, -0.03em 0 #b4d5fe, 0 0.03em #b4d5fe, 0 -0.03em #b4d5fe, 0.06em 0 #b4d5fe, -0.06em 0 #b4d5fe, 0.09em 0 #b4d5fe, -0.09em 0 #b4d5fe, 0.12em 0 #b4d5fe, -0.12em 0 #b4d5fe, 0.15em 0 #b4d5fe, -0.15em 0 #b4d5fe; - background: #b4d5fe; } +a:link::-moz-selection { + text-shadow: 0.03em 0 #b4d5fe, -0.03em 0 #b4d5fe, 0 0.03em #b4d5fe, 0 -0.03em #b4d5fe, 0.06em 0 #b4d5fe, + -0.06em 0 #b4d5fe, 0.09em 0 #b4d5fe, -0.09em 0 #b4d5fe, 0.12em 0 #b4d5fe, -0.12em 0 #b4d5fe, 0.15em 0 #b4d5fe, + -0.15em 0 #b4d5fe; + background: #b4d5fe; +} /* Sidenotes, margin notes, figures, captions */ -img { max-width: 100%; } +img { + max-width: 100%; +} -.sidenote, .marginnote { float: right; - clear: right; - margin-right: -60%; - width: 50%; - margin-top: 0; - margin-bottom: 0; - font-size: 1.1rem; - line-height: 1.3; - vertical-align: baseline; - position: relative; } +.sidenote, +.marginnote { + float: right; + clear: right; + margin-right: -60%; + width: 50%; + margin-top: 0; + margin-bottom: 0; + font-size: 1.1rem; + line-height: 1.3; + vertical-align: baseline; + position: relative; +} -.table-caption { float:right; - clear:right; - margin-right: -60%; - width: 50%; - margin-top: 0; - margin-bottom: 0; - font-size: 1.0rem; - line-height: 1.6; } +.table-caption { + float: right; + clear: right; + margin-right: -60%; + width: 50%; + margin-top: 0; + margin-bottom: 0; + font-size: 1rem; + line-height: 1.6; +} -.sidenote-number { counter-increment: sidenote-counter; } +.sidenote-number { + counter-increment: sidenote-counter; +} -.sidenote-number:after, .sidenote:before { content: counter(sidenote-counter) " "; - font-family: et-book-roman-old-style; - position: relative; - vertical-align: baseline; } +.sidenote-number:after, +.sidenote:before { + content: counter(sidenote-counter) " "; + font-family: et-book-roman-old-style; + position: relative; + vertical-align: baseline; +} -.sidenote-number:after { content: counter(sidenote-counter); - font-size: 1rem; - top: -0.5rem; - left: 0.1rem; } +.sidenote-number:after { + content: counter(sidenote-counter); + font-size: 1rem; + top: -0.5rem; + left: 0.1rem; +} -.sidenote:before { content: counter(sidenote-counter) " "; - top: -0.5rem; } +.sidenote:before { + content: counter(sidenote-counter) " "; + top: -0.5rem; +} -p, footer, table, div.table-wrapper-small, div.supertable-wrapper > p, div.booktabs-wrapper { width: 55%; } +p, +footer, +table, +div.table-wrapper-small, +div.supertable-wrapper > p, +div.booktabs-wrapper { + width: 55%; +} -div.fullwidth, table.fullwidth { width: 100%; } +div.fullwidth, +table.fullwidth { + width: 100%; +} -div.table-wrapper { overflow-x: scroll; - font-family: "Trebuchet MS", "Gill Sans", "Gill Sans MT", sans-serif; } +div.table-wrapper { + overflow-x: scroll; + font-family: "Trebuchet MS", "Gill Sans", "Gill Sans MT", sans-serif; +} -@media screen and (max-width: 760px) { p, footer { width: 90%; } - pre.code { width: 87.5%; } - ul { width: 85%; } - figure { max-width: 90%; } - figcaption, figure.fullwidth figcaption { margin-right: 0%; - max-width: none; } - blockquote p, blockquote footer { width: 90%; }} +@media screen and (max-width: 760px) { + p, + footer { + width: 90%; + } + pre.code { + width: 87.5%; + } + ul { + width: 85%; + } + figure { + max-width: 90%; + } + figcaption, + figure.fullwidth figcaption { + margin-right: 0%; + max-width: none; + } + blockquote p, + blockquote footer { + width: 90%; + } +} -.sans { font-family: "Gill Sans", "Gill Sans MT", Calibri, sans-serif; - letter-spacing: .03em; } +.sans { + font-family: "Gill Sans", "Gill Sans MT", Calibri, sans-serif; + letter-spacing: 0.03em; +} -.code { font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; - font-size: 1.125rem; - line-height: 1.6; } +.code { + font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; + font-size: 1.125rem; + line-height: 1.6; +} -h1 .code, h2 .code, h3 .code { font-size: 0.80em; } +h1 .code, +h2 .code, +h3 .code { + font-size: 0.8em; +} -.marginnote .code, .sidenote .code { font-size: 1rem; } +.marginnote .code, +.sidenote .code { + font-size: 1rem; +} -pre.code { width: 52.5%; - padding-left: 2.5%; - overflow-x: scroll; } +pre.code { + width: 52.5%; + padding-left: 2.5%; + overflow-x: scroll; +} -.fullwidth { max-width: 90%; - clear:both; } +.fullwidth { + max-width: 90%; + clear: both; +} -span.newthought { font-variant: small-caps; - font-size: 1.2em; } +span.newthought { + font-variant: small-caps; + font-size: 1.2em; +} -input.margin-toggle { display: none; } +input.margin-toggle { + display: none; +} -label.sidenote-number { display: inline; } +label.sidenote-number { + display: inline; +} -label.margin-toggle:not(.sidenote-number) { display: none; } +label.margin-toggle:not(.sidenote-number) { + display: none; +} -@media (max-width: 760px) { label.margin-toggle:not(.sidenote-number) { display: inline; } - .sidenote, .marginnote { display: none; } - .margin-toggle:checked + .sidenote, - .margin-toggle:checked + .marginnote { display: block; - float: left; - left: 1rem; - clear: both; - width: 95%; - margin: 1rem 2.5%; - vertical-align: baseline; - position: relative; } - label { cursor: pointer; } - pre.code { width: 90%; - padding: 0; } - .table-caption { display: block; - float: right; - clear: both; - width: 98%; - margin-top: 1rem; - margin-bottom: 0.5rem; - margin-left: 1%; - margin-right: 1%; - vertical-align: baseline; - position: relative; } - div.table-wrapper, table, table.booktabs { width: 85%; } - div.table-wrapper { border-right: 1px solid #efefef; } - img { width: 100%; } } +@media (max-width: 760px) { + label.margin-toggle:not(.sidenote-number) { + display: inline; + } + .sidenote, + .marginnote { + display: none; + } + .margin-toggle:checked + .sidenote, + .margin-toggle:checked + .marginnote { + display: block; + float: left; + left: 1rem; + clear: both; + width: 95%; + margin: 1rem 2.5%; + vertical-align: baseline; + position: relative; + } + label { + cursor: pointer; + } + pre.code { + width: 90%; + padding: 0; + } + .table-caption { + display: block; + float: right; + clear: both; + width: 98%; + margin-top: 1rem; + margin-bottom: 0.5rem; + margin-left: 1%; + margin-right: 1%; + vertical-align: baseline; + position: relative; + } + div.table-wrapper, + table, + table.booktabs { + width: 85%; + } + div.table-wrapper { + border-right: 1px solid #efefef; + } + img { + width: 100%; + } +}