Commit ebba997a authored by doshitan's avatar doshitan

Pull in latest tufte-css updates

parent 5905967a
......@@ -208,10 +208,8 @@ theStylesheet = do
-- to be the same size as a <p>
fontSize (cfgCodeFontSize doshitanConfig)
fontFamily (cfgFontFamilyMono doshitanConfig) [monospace]
pre # ".code" ? do
pre ? do
overflowX (other "initial")
-- undo Pandoc CSS removal of margin
marginLeft (pct 2.5)
"pre.numberSource a.sourceLine::before" ? do
important $ sym padding nil
......@@ -222,8 +220,6 @@ theStylesheet = do
code ? do
"font-variant-numeric" -: "slashed-zero";
a # ".no-underline" ? noUnderline
kbd ? do -- Inspired by Stack Overflow's styling
sym2 padding (em 0.1) (em 0.6)
border solid (px 1) "#CCC"
......@@ -262,12 +258,6 @@ theStylesheet = do
printStyles
where
noUnderline = do
"background" -: "0"
"text-shadow" -: "none"
smallScreen :: Config -> Css -> Css
smallScreen cfg = query Clay.Media.screen [Clay.Media.maxWidth (cfgSmallScreenBreakpoint cfg)]
......
......@@ -126,7 +126,6 @@ tufte cfg = do
".danger" ? color red
article ? do
position relative
sym2 padding (rem 5) nil
section ? do
......@@ -198,7 +197,9 @@ tufte cfg = do
((a # link) <> (a # visited)) ? color inherit
(a # link) ? cfgLinkCss cfg
".no-tufte-underline:link" ? noUnderline
(a # link <> ".tufte-underline" <> ".hover-tufte-underline:hover") ? cfgLinkCss cfg
-- In upstream Tufte, this is specifically applied to a:link, but might as
-- well just apply a simplified version to everything for consistency
......@@ -208,7 +209,9 @@ tufte cfg = do
-- TODO: I don't know why this is done, just positioning it with the other
-- rules for it seems to work fine
-- query Clay.Media.screen [Clay.Stylesheet.Feature "-webkit-min-device-pixel-ratio" (Just "0")] $
-- (a # link) ? ("background-position-y" -: "87%, 87%, 87%")
-- (a # link <> ".tufte-underline" <> ".hover-tufte-underline:hover") ? ("background-position-y" -: "87%, 87%, 87%")
("a.no-tufte-underline:link::selection" <> "a.no-tufte-underline:link::-moz-selection") ? noUnderline
img ? maxWidth (pct 100)
......@@ -265,10 +268,13 @@ tufte cfg = do
fontFamily (cfgFontFamilySans cfg) [sansSerif]
"letter-spacing" -: "0.3rem"
code ? do
(code <> (pre |> code)) ? do
fontFamily (cfgFontFamilyMono cfg) [monospace]
fontSize (cfgCodeFontSize cfg)
lineHeight (unitless 1.42)
-- Prevent adjustments of font size after orientation changes in iOS. See
-- https://github.com/edwardtufte/tufte-css/issues/81#issuecomment-261953409
"-webkit-text-size-adjust" -: "100%"
".sans > code" ? fontSize (rem 1.2)
......@@ -276,12 +282,15 @@ tufte cfg = do
(".marginnote" <> ".sidenote") ? code <? fontSize (rem 1)
pre # ".code" ? do
fontSize (rem 0.9)
pre |> "code" ? do
fontSize (cfgCodeFontSize cfg)
width (pct 52.5)
marginLeft (pct 2.5)
overflowX auto
".fullwidth" & width (pct 90)
display block
"pre.fullwidth > code" ? do
width (pct 90)
".fullwidth" ? do
maxWidth (pct 90)
......@@ -320,7 +329,7 @@ tufte cfg = do
(p <> footer <> table) <? width (pct 100)
(ol <> ul) <? width (pct 90)
"pre.code" ? width (pct 97)
(pre |> code) ? width (pct 97)
figure ? maxWidth (pct 90)
......@@ -351,6 +360,8 @@ tufte cfg = do
clear both
width (pct 95)
-- TODO: open Clay issue about mixed units
-- TODO: use once released
-- https://github.com/sebastiaanvisser/clay/commit/25a90636796f8e02a5dd5be35067fe3296c7d5fa
-- sym2 margin (rem 1) (pct 2.5)
"margin" -: "1rem 2.5%"
verticalAlign vAlignBaseline
......@@ -368,11 +379,17 @@ tufte cfg = do
"text-shadow" -: "none"
backgroundColor (cfgHighlightColor cfg)
noUnderline :: Css
noUnderline = do
"background" -: "unset"
"text-shadow" -: "unset"
tufteLinkCss :: Css
tufteLinkCss = do
textDecoration 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)"
"background" -: "-webkit-linear-gradient(#fffff8, #fffff8), -webkit-linear-gradient(#fffff8, #fffff8), -webkit-linear-gradient(currentColor, currentColor)"
"background" -: "linear-gradient(#fffff8, #fffff8), linear-gradient(#fffff8, #fffff8), linear-gradient(currentColor, currentColor)"
"-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"
......
......@@ -2,6 +2,7 @@
font-family: "Fira Mono";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(/assets/font/FiraMono-Regular.subset.woff2) format("woff2"),
url(/assets/font/FiraMono-Regular.subset.woff) format("woff"),
url(/assets/font/FiraMono-Regular.subset.otf) format("opentype");
......@@ -11,6 +12,7 @@
font-family: "Fira Mono";
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(/assets/font/FiraMono-Bold.subset.woff2) format("woff2"),
url(/assets/font/FiraMono-Bold.subset.woff) format("woff"),
url(/assets/font/FiraMono-Bold.subset.otf) format("opentype");
......
......@@ -2,6 +2,7 @@
font-family: "Merriweather";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(/assets/font/Merriweather-Regular.subset.woff2) format("woff2"),
url(/assets/font/Merriweather-Regular.subset.woff) format("woff"),
url(/assets/font/Merriweather-Regular.subset.otf) format("opentype");
......@@ -11,6 +12,7 @@
font-family: "Merriweather";
font-style: italic;
font-weight: 400;
font-display: swap;
src: url(/assets/font/MerriweatherItalic-Italic.subset.woff2) format("woff2"),
url(/assets/font/MerriweatherItalic-Italic.subset.woff) format("woff"),
url(/assets/font/MerriweatherItalic-Italic.subset.otf) format("opentype");
......@@ -20,6 +22,7 @@
font-family: "Merriweather";
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(/assets/font/Merriweather-Bold.subset.woff2) format("woff2"),
url(/assets/font/Merriweather-Bold.subset.woff) format("woff"),
url(/assets/font/Merriweather-Bold.subset.otf) format("opentype");
......
......@@ -3,7 +3,7 @@ module Site.Pandoc where
import Hakyll
import RIO
import qualified RIO.Text as T
import Text.Pandoc (Block (CodeBlock, Header))
import Text.Pandoc (Block (Header))
import qualified Text.Pandoc as Pandoc
import Text.Pandoc.Options (HTMLMathMethod (PlainMath),
WriterOptions, writerHTMLMathMethod,
......@@ -23,7 +23,7 @@ mPandocCompiler =
pandocCompilerWithTransform
defaultHakyllReaderOptions
writerOptions
(usingSideNotes . walk (addCodeClass . bumpHeaders))
(usingSideNotes . walk bumpHeaders)
feedPandocCompiler :: Compiler (Item String)
feedPandocCompiler = pandocCompilerWith defaultHakyllReaderOptions writerOptions'
......@@ -51,10 +51,3 @@ writePlain = traverse $ \pandoc ->
bumpHeaders :: Block -> Block
bumpHeaders (Header lvl attrs inlines) = Header (lvl + 1) attrs inlines
bumpHeaders x = x
-- Tufte CSS expects a .code class on a pre to apply styling, which is mostly
-- ineffectual due to pandoc wrapping most code blocks in a div, but at least
-- apply the class it for now
addCodeClass :: Block -> Block
addCodeClass (CodeBlock (ident, classes, attrs) code) = CodeBlock (ident, "code":classes, attrs) code
addCodeClass x = x
......@@ -49,6 +49,7 @@ for FONTVER in $FIRA_MONO_FONT_VERS ; do
font-family: "Fira Mono";
font-style: $(fontStyleForVer);
font-weight: $(fontWeightForVer);
font-display: swap;
src: url(/assets/font/$(destFilenameForVer "woff2")) format("woff2"),
url(/assets/font/$(destFilenameForVer "woff")) format("woff"),
url(/assets/font/$(destFilenameForVer "otf")) format("opentype");
......
......@@ -50,6 +50,7 @@ for FONTVER in $MERRIWEATHER_FONT_VERS ; do
font-family: "Merriweather";
font-style: $(fontStyleForVer);
font-weight: $(fontWeightForVer);
font-display: swap;
src: url(/assets/font/$(destFilenameForVer "woff2")) format("woff2"),
url(/assets/font/$(destFilenameForVer "woff")) format("woff"),
url(/assets/font/$(destFilenameForVer "otf")) format("opentype");
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment