feat: add css print

feat/integration_ideo
Nicolas Doby 2022-11-02 11:57:45 +01:00
parent 5bdd717ceb
commit 8d053a29d8
6 changed files with 42 additions and 7 deletions

View File

@ -23,6 +23,7 @@ module.exports = function(eleventyConfig) {
// Watch our compiled assets for changes
eleventyConfig.addWatchTarget('./src/compiled-assets/main.css');
eleventyConfig.addWatchTarget('./src/compiled-assets/print.css');
//eleventyConfig.addWatchTarget('./src/compiled-assets/main.js');
//eleventyConfig.addWatchTarget('./src/compiled-assets/vendor.js');

View File

@ -4,6 +4,7 @@ const cacheBust = () => {
// A "map" of files to cache bust
const files = {
mainCss: './src/compiled-assets/main.css',
printCss: './src/compiled-assets/print.css'
// mainJs: './src/compiled-assets/main.js',
// vendorJs: './src/compiled-assets/vendor.js',
};

View File

@ -7,6 +7,7 @@
<meta name="description" content="{{ description or metadata.description }}">
<meta name="generator" content="{{ eleventy.generator }}">
<link rel="stylesheet" href="/assets/main.css?{{ cacheBust.mainCss }}"/>
<link rel="stylesheet" media="print" href="/assets/print.css?{{ cacheBust.printCss }}" />
<link rel="alternate" href="/feed/feed.xml" type="application/atom+xml" title="{{ metadata.title }}">
<link rel="alternate" href="/feed/feed.json" type="application/json" title="{{ metadata.title }}">
<link rel="icon" href="/images/favicon.svg">
@ -22,13 +23,7 @@
</header>
<main>
{# <div class="main-content">#}
{{ content | safe }}
{# </div>#}
{# <aside class="right-side">#}
{# {% include "tagslist.njk" %}#}
{# {% include "other_links.njk" %}#}
{# </aside>#}
</main>
<footer class="main-footer">

34
src/assets/css/print.scss Normal file
View File

@ -0,0 +1,34 @@
header,
.right-side,
.main-footer,
.post-nav {
display: none;
}
main {
padding: 0;
}
p {
orphans: 3;
widows: 3;
font-size: 12px;
}
h1, h2, h3, h4 {
page-break-after:avoid;
break-after: avoid;
}
h1 {
font-size: 22px;
}
h2 {
font-size: 18px;
}
h3 {
font-size: 16px;
}
h4 {
font-size: 14px;
}

1
src/assets/js/print.js Normal file
View File

@ -0,0 +1 @@
import '../css/print.scss'

View File

@ -4,7 +4,10 @@ const path = require('path');
module.exports = {
// Our "entry" point
entry: './src/assets/js/index.js',
entry: {
main: './src/assets/js/index.js',
print: './src/assets/js/print.js'
},
output: {
// The global variable name any `exports` from `index.js` will be available at
library: 'SITE',