Commit 301c3b70 authored by Guillaume Grossetie's avatar Guillaume Grossetie 🎧
Browse files

add PostCSS and Babel to support all modern browsers

parent dcd6fc45
......@@ -3,18 +3,35 @@
const ospath = require('path')
const asciidoctor = require('@asciidoctor/core')()
const documentModelConverter = require(`${__dirname}/lib/document-model-converter.js`)
const autoprefixer = require('autoprefixer')
const postcss = require('postcss')
const postcssPresetEnv = require('postcss-preset-env')
const postcssAtImport = require("postcss-import")
const fs = require('fs')
const path = require('path')
module.exports = function (eleventyConfig, rest) {
eleventyConfig.ignores.add("pages/examples/**")
eleventyConfig.addPassthroughCopy('pages/**/*.{jpg,png,gif,svg,ico,css,txt,json,js}')
eleventyConfig.addPassthroughCopy('assets/**/*.{jpg,png,gif,svg,ico,css,txt,json}')
eleventyConfig.addPassthroughCopy('pages/**/*.{jpg,png,gif,svg,ico,txt,json}')
eleventyConfig.setBrowserSyncConfig({
files: ['_site/**/*'],
open: true,
open: false
})
eleventyConfig.addPassthroughCopy({
"node_modules/highlight.js/styles/default.css": "assets/css/highlightjs/default.css",
"node_modules/highlight.js/styles/monokai-sublime.css": "assets/css/highlightjs/monokai-sublime.css",
eleventyConfig.addExtension('css', {
outputFileExtension: 'css',
compileOptions: {
cache: false,
},
compile: async function (inputContent, inputPath) {
const parsed = path.parse(inputPath)
if (parsed.name.startsWith("_")) {
return
}
const result = await postcss([postcssAtImport, autoprefixer, postcssPresetEnv({ browsers: 'defaults,not IE 11' })])
.process(inputContent, { from: inputPath, to: '_site/assets/css/main.css' })
return async (data) => {
return result.css
}
}
})
eleventyConfig.addExtension('adoc', {
compile: function (fileContents, path) {
......
pages/examples/**
This diff is collapsed.
......@@ -4,24 +4,33 @@
"version": "1.0.0",
"license": "EPL-2.0",
"scripts": {
"build": "rollup -c --environment BUILD:production && ELEVENTY_EXPERIMENTAL=true eleventy --config .eleventy.js",
"start": "rollup -c -w & ELEVENTY_EXPERIMENTAL=true eleventy --serve --config .eleventy.js"
"build": "rollup -c --environment BUILD:production && eleventy --config .eleventy.js",
"start": "rollup -c -w & eleventy --serve --config .eleventy.js"
},
"devDependencies": {
"@11ty/eleventy": "~1.0",
"@asciidoctor/core": "^2.2.6",
"@babel/preset-env": "^7.16.11",
"@codemirror/commands": "^0.19.8",
"@codemirror/gutter": "^0.19.9",
"@codemirror/history": "^0.19.2",
"@codemirror/state": "^0.19.6",
"@codemirror/text": "^0.19.6",
"@codemirror/view": "^0.19.40",
"@rollup/plugin-babel": "^5.3.0",
"@rollup/plugin-commonjs": "^21.0.1",
"@rollup/plugin-node-resolve": "^13.1.3",
"highlight.js": "^9.18.3",
"highlightjs-line-numbers.js": "^2.8.0",
"node-html-parser": "^5.2.0",
"postcss": "^8.4.6",
"postcss-import": "^14.0.2",
"postcss-preset-env": "^7.3.1",
"rollup": "^2.67.0",
"rollup-plugin-terser": "^7.0.2"
}
},
"browserslist": [
"defaults",
"not IE 11"
]
}
......@@ -8,10 +8,7 @@
{# % include 'seo.njk' % #}
{% include 'favicon.njk' %}
<title>AsciiDoc</title>
<link rel="stylesheet" href="/assets/css/highlightjs/default.css">
<link rel="stylesheet" href="/assets/css/highlightjs/monokai-sublime.css">
<link rel="stylesheet" href="./assets/css/main.css">
<link rel="stylesheet" href="./assets/css/doc.css">
</head>
<body>
<header class="header">
......
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;900&family=Urbanist:wght@400;500;700;900&family=Source+Code+Pro:ital,wght@0,400;0,500;0,600;1,400&display=swap');
/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */
html,
body,
p,
ol,
ul,
li,
dl,
dt,
dd,
blockquote,
figure,
fieldset,
legend,
textarea,
pre,
iframe,
hr,
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0;
padding: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: 100%;
font-weight: normal;
}
ul {
list-style: none;
}
button,
input,
select {
margin: 0;
}
html {
box-sizing: border-box;
}
*, *::before, *::after {
box-sizing: inherit;
}
img,
video {
height: auto;
max-width: 100%;
}
iframe {
border: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}
/* asciidoc.org style */
:root {
--brand-color-50: #f1fcfe;
--brand-color-100: #d2f4fd;
......@@ -495,7 +416,7 @@ section.try .paragraph {
}
section.try .paragraph:not(:last-child) {
margin-bottom: 3rem;
margin-bottom: 3rem;
}
section.try .toggle {
......
/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */
html,
body,
p,
ol,
ul,
li,
dl,
dt,
dd,
blockquote,
figure,
fieldset,
legend,
textarea,
pre,
iframe,
hr,
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0;
padding: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: 100%;
font-weight: normal;
}
ul {
list-style: none;
}
button,
input,
select {
margin: 0;
}
html {
box-sizing: border-box;
}
*, *::before, *::after {
box-sizing: inherit;
}
img,
video {
height: auto;
max-width: 100%;
}
iframe {
border: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;900&family=Urbanist:wght@400;500;700;900&family=Source+Code+Pro:ital,wght@0,400;0,500;0,600;1,400&display=swap');
@import "highlight.js/styles/default.css";
@import "highlight.js/styles/monokai-sublime.css";
@import "_minireset.css";
@import "_base.css";
@import "_doc.css";
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