diff --git a/.eleventy.js b/.eleventy.js index 8fff436..b7a1f94 100644 --- a/.eleventy.js +++ b/.eleventy.js @@ -182,11 +182,9 @@ const postcssFilter = (cssCode, done) => { require('postcss-import'), tailwind(require('./tailwind.config')), autoprefixer(), - // TODO use purgecss for each layout - // cssnano({ preset: 'default' }) + cssnano({ preset: 'default' }) // minify css ]) .process(cssCode, { - // path to our CSS file from: './src/_assets/css/styles.css' }) .then( diff --git a/README.md b/README.md index fb03442..a6b0c2c 100644 --- a/README.md +++ b/README.md @@ -15,17 +15,16 @@ I wanted to use [Windty](https://github.com/distantcam/windty/) for my next [ele - Handle markdown with style - Process images to make them responsive ### Content Managment System -- Installed Decap CMS with content flow +- Installed Sveltia and Decap CMS with content flow - Possibility to use Sveltia CMS with the same config ### Documentation -- Documentation comes with the package as an example +- Documentation comes with the starter as an example - Explains how features are developped ## What is still missing - better SEO metadata -- documentation on the CMS -- maybe a nicer design +- dark mode ## Install 1. Create a new repository from [huwindty’s template](https://github.com/aloxe/huwindty/generate), or [clone huwindty](https://docs.github.com/en/free-pro-team@latest/github/creating-cloning-and-archiving-repositories/cloning-a-repository) where you want. @@ -33,4 +32,4 @@ I wanted to use [Windty](https://github.com/distantcam/windty/) for my next [ele 3. Start development: `npm start` 4. See your website at http://localhost:8080/ 5. To build the release version: `npm run build` -6. When ready, push to GitHub and the action will build and publish your site to [GitHub Pages](https://docs.github.com/en/free-pro-team@latest/github/working-with-github-pages) +6. When ready, push to GitHub and the action will build and publish your site to [GitHub Pages](https://docs.github.com/en/free-pro-team@latest/github/working-with-github-pages) (needs configuration) diff --git a/src/_assets/public/css/highlightjs.css b/src/_assets/css/highlightjs.css similarity index 80% rename from src/_assets/public/css/highlightjs.css rename to src/_assets/css/highlightjs.css index b26a9da..a47476a 100644 --- a/src/_assets/public/css/highlightjs.css +++ b/src/_assets/css/highlightjs.css @@ -1 +1,7 @@ +/* +highlightjs theme from https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css +slightly modified to be more readable +other themes here: https://highlightjs.org/examples +*/ + pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{color:#abb2bf;background:#1d212c}.hljs-comment,.hljs-quote{color:#9fa985;font-style:italic}.hljs-doctag,.hljs-formula,.hljs-keyword{color:#c678dd}.hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst{color:#f8969e}.hljs-literal{color:#56b6c2}.hljs-addition,.hljs-attribute,.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#98c379}.hljs-attr,.hljs-number,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#d19a66}.hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-symbol,.hljs-title{color:#61aeee}.hljs-built_in,.hljs-class .hljs-title,.hljs-title.class_{color:#e6c07b}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.hljs-link{text-decoration:underline} diff --git a/src/_assets/css/mkdn.css b/src/_assets/css/mkdn.css new file mode 100644 index 0000000..facd430 --- /dev/null +++ b/src/_assets/css/mkdn.css @@ -0,0 +1,41 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; + +@layer components { + .mkdn h2 { + @apply mt-8 mb-6 text-left text-2xl font-bold leading-tight text-indigo-800 + } + .mkdn h3 { + @apply my-4 text-left text-xl font-bold leading-normal text-blue-950 + } + .mkdn p, .mkdn ul, .mkdn ol { + @apply my-4 text-xl font-light leading-6 text-slate-900 + } + .mkdn ul { + @apply list-disc + } + .mkdn ol { + @apply list-decimal + } + .mkdn li { + @apply ml-8 mb-2 + } + .mkdn code { + @apply text-xl + } + .mkdn a { + @apply text-blue-900 underline underline-offset-2 hover:no-underline + } + .mkdn .note { + @apply text-cyan-900 bg-sky-200 border p-4 border-cyan-900 border-l-8 + before:content-['ⓘ_Note:_'] before:font-bold + } +} + +/* Markdown style +see: https://aloxe.github.io/huwindty/documentation/styles/ +other solution for markdown styling +read: https://dev.to/matthewtole/eleventy-markdown-and-tailwind-css-14f8 +*/ + diff --git a/src/_assets/css/styles.css b/src/_assets/css/styles.css index d95565c..bcf21eb 100644 --- a/src/_assets/css/styles.css +++ b/src/_assets/css/styles.css @@ -2,38 +2,4 @@ @tailwind components; @tailwind utilities; -@layer components { - .mkdn h2 { - @apply mt-8 mb-6 text-left text-2xl font-bold leading-tight text-indigo-800 - } - .mkdn h3 { - @apply my-4 text-left text-xl font-bold leading-normal text-blue-950 - } - .mkdn p, .mkdn ul, .mkdn ol { - @apply my-4 text-xl font-light leading-6 text-slate-900 - } - .mkdn ul { - @apply list-disc list-inside - } - .mkdn ol { - @apply list-decimal list-inside - } - .mkdn li { - @apply ml-8 mb-2 - } - .mkdn code { - @apply text-xl - } - .mkdn a { - @apply text-blue-900 underline underline-offset-2 hover:no-underline - } - .mkdn .note { - @apply text-cyan-900 bg-sky-200 border p-4 border-cyan-900 border-l-8 - before:content-['ⓘ_Note:_'] before:font-bold - } -} - -/* other solution for styling -read: https://dev.to/matthewtole/eleventy-markdown-and-tailwind-css-14f8 -*/ diff --git a/src/_layouts/base.njk b/src/_layouts/base.njk index 88e0ef2..72fd5b7 100644 --- a/src/_layouts/base.njk +++ b/src/_layouts/base.njk @@ -1,22 +1,25 @@ - + {% block head %} {% include "head.njk" %} {% endblock %} - + {# #} + {% block menu %} {% include "menu.njk" %} {% endblock %} - {% block header %} - {% include "header.njk" %} - {% endblock %} - {% block main %} -
- {{ content | safe }} +
+ {% block header %} + {% include "header.njk" %} + {% endblock %} + + {% block content %} + {{ content | safe }} + {% endblock %}
{% endblock %} diff --git a/src/_layouts/includes/footer.njk b/src/_layouts/includes/footer.njk index d04d7cb..d8127f0 100644 --- a/src/_layouts/includes/footer.njk +++ b/src/_layouts/includes/footer.njk @@ -1,3 +1,3 @@ -