diff --git a/generateNewBlog.mjs b/generateNewBlog.mjs
index 0a5ef8d..d5d9e6b 100644
--- a/generateNewBlog.mjs
+++ b/generateNewBlog.mjs
@@ -5,58 +5,58 @@ import inquirer from 'inquirer';
// Function to validate non-empty input
const validateInput = (input) => {
- return input.trim() !== '' ? true : 'This field is required.';
+ return input.trim() !== '' ? true : 'This field is required.';
};
// Function to generate files based on user input
async function generateFiles() {
- const currentFileUrl = import.meta.url;
- const currentDir = path.dirname(url.fileURLToPath(currentFileUrl));
+ const currentFileUrl = import.meta.url;
+ const currentDir = path.dirname(url.fileURLToPath(currentFileUrl));
- const currentDate = new Date().toISOString().split('T')[0]; // Get today's date in the format YYYY-MM-DD
+ const currentDate = new Date().toISOString().split('T')[0]; // Get today's date in the format YYYY-MM-DD
- const answers = await inquirer.prompt([
- {
- type: 'input',
- name: 'title',
- message: 'Enter the title:',
- validate: validateInput,
- },
- {
- type: 'input',
- name: 'description',
- message: 'Enter the description:',
- validate: validateInput,
- },
- {
- type: 'confirm',
- name: 'includeCode',
- message: 'Does the markdown file include code?',
- default: false,
- },
- ]);
+ const answers = await inquirer.prompt([
+ {
+ type: 'input',
+ name: 'title',
+ message: 'Enter the title:',
+ validate: validateInput,
+ },
+ {
+ type: 'input',
+ name: 'description',
+ message: 'Enter the description:',
+ validate: validateInput,
+ },
+ {
+ type: 'confirm',
+ name: 'includeCode',
+ message: 'Does the markdown file include code?',
+ default: false,
+ },
+ ]);
- // Create the variables from the supplied answers
- let { title, description, includeCode } = answers;
+ // Create the variables from the supplied answers
+ let { title, description, includeCode } = answers;
- // The title of the folder uses "-" instead of spaces, so we replace them all
- let folderTitle = title.replace(/\s+/g, '-');
+ // The title of the folder uses "-" instead of spaces, so we replace them all
+ let folderTitle = title.replace(/\s+/g, '-');
- // Create the paths for the blog and images
- const blogFolderPath = path.join(currentDir, 'src', 'blog', `${currentDate}-${folderTitle}`);
- const assetsFolderPath = path.join(
- currentDir,
- 'src',
- 'assets',
- 'images',
- `${currentDate}-${folderTitle}`,
- );
+ // Create the paths for the blog and images
+ const blogFolderPath = path.join(currentDir, 'src', 'blog', `${currentDate}-${folderTitle}`);
+ const assetsFolderPath = path.join(
+ currentDir,
+ 'src',
+ 'assets',
+ 'images',
+ `${currentDate}-${folderTitle}`,
+ );
- // Create the folders
- fs.mkdirSync(blogFolderPath, { recursive: true });
- fs.mkdirSync(assetsFolderPath, { recursive: true });
+ // Create the folders
+ fs.mkdirSync(blogFolderPath, { recursive: true });
+ fs.mkdirSync(assetsFolderPath, { recursive: true });
- const frontmatter = `---
+ const frontmatter = `---
layout: blog.njk
title: ${title}
author: David Moll
@@ -73,12 +73,12 @@ hasCode: ${includeCode}
`;
- // Write the frontmatter-data in a file to the blog-path
- fs.writeFileSync(path.join(blogFolderPath, `${currentDate}-${folderTitle}.md`), frontmatter);
+ // Write the frontmatter-data in a file to the blog-path
+ fs.writeFileSync(path.join(blogFolderPath, `${currentDate}-${folderTitle}.md`), frontmatter);
- console.log(
- `Blog folder "${currentDate}-${folderTitle}" and Markdown file created successfully.`,
- );
+ console.log(
+ `Blog folder "${currentDate}-${folderTitle}" and Markdown file created successfully.`,
+ );
}
generateFiles();
diff --git a/src/blog/2024-04-30-How-to-optimize-your-website-for-print/2024-04-30-How-to-optimize-your-website-for-print.md b/src/blog/2024-04-30-How-to-optimize-your-website-for-print/2024-04-30-How-to-optimize-your-website-for-print.md
index eb1b190..6e45f4b 100644
--- a/src/blog/2024-04-30-How-to-optimize-your-website-for-print/2024-04-30-How-to-optimize-your-website-for-print.md
+++ b/src/blog/2024-04-30-How-to-optimize-your-website-for-print/2024-04-30-How-to-optimize-your-website-for-print.md
@@ -3,12 +3,12 @@ layout: blog.njk
title: How to optimize your website for print
author: David Moll
date: 2024-04-30
-tags:
-- posts
+tags:
+ - posts
description: Neat little tricks on how to make your website looking better for print
folderName: 2024-04-30-How-to-optimize-your-website-for-print
socialMediaPreviewImage: https://blog.davidmoll.net/assets/images/2024-04-30-How-to-optimize-your-website-for-print/cover.png
-socialMediaPreviewImageAlt:
+socialMediaPreviewImageAlt:
hasCode: true
---
@@ -58,7 +58,7 @@ If your content is long enough you run into the problem that some parts of it ma
### break-after
-The `break-after` property specifies whether or not a page break, column break, or region break should occur after the specified element. This means that if you for example have an image with a class that has this styling applied and it would break across pages it will instead move down and start at the second page.
+The `break-after` property specifies whether or not a page break, column break, or region break should occur after the specified element. This means that if you for example have an image with a class that has this styling applied and it would break across pages it will instead move down and start at the second page.
```css:bundle.css
@@ -77,11 +77,12 @@ h1 {
break-before: always;
}
```
+
### break-inside
-The last property allows you to simply say to avoid content being split across pages. It's something very general you can use in multiple places to make your printed website a bit more readable:
+The last property allows you to simply say to avoid content being split across pages. It's something very general you can use in multiple places to make your printed website a bit more readable:
```css:bundle.css
@@ -93,6 +94,7 @@ pre {
break-inside: avoid;
}
```
+
### font-size
@@ -128,6 +130,7 @@ p {
font-size: 16px;
}
```
+
## Custom footer
@@ -143,5 +146,6 @@ body::after {
white-space: pre;
}
```
+
-These are some simple CSS-tricks that will help you to optimize your website a little bit. Did you use any of those? Let me know, I'd love to have a look at your page :)
\ No newline at end of file
+These are some simple CSS-tricks that will help you to optimize your website a little bit. Did you use any of those? Let me know, I'd love to have a look at your page :)