fixup! fixup! fixup! fixup! fixup! fixup! fixup! fixup! fixup! fixup!…

… fixup! fixup! fixup! Change documentation platform from Docz to Docoff

src/docs/_assets/stylesheets/extra.css

@@ -3,7 +3,8 @@
 :root {
   /* Visual configuration of the `<docoff-react-preview>` and `<docoff-react-base>` code */
   /* The Prism theme CSS file, for options see: https://unpkg.com/browse/prismjs/themes/ */
-  --docoff-code-prism-css: https://unpkg.com/[email protected]/themes/prism-twilight.min.css;
+  /* Beware of the double dot in `29..0` - it does not work without it… */
+  --docoff-code-prism-css: https://unpkg.com/[email protected]/themes/prism-twilight.min.css;
   --docoff-code-font-size: 0.7rem;
   --docoff-code-line-height: 1.5;
   --docoff-code-font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;

src/docs/_overrides/main.html

@@ -1,18 +1,27 @@
 {% extends "base.html" %}
 
 {% block libs %}
-  <script crossorigin src="https://unpkg.com/@babel/standalone@7/babel.min.js"></script>
-  <script crossorigin src="https://unpkg.com/react@17/umd/react.development.js"></script>
-  <script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>
+  <!-- We need to load this to make them accessible on the document root (outside shadowDOM) to preview colors etc. -->
+  <link rel="stylesheet" type="text/css" href="/docs/_assets/generated/cssCustomProperties.css">
 
-  <script crossorigin src="https://unpkg.com/@react-ui-org/[email protected]/public/generated/bundle.js"></script>
+  <!-- We load Prism by hand to match style used by Docoff -->
+  <link href="https://unpkg.com/[email protected]/themes/prism-twilight.css" rel="stylesheet" />
+{% endblock %}
 
+{% block scripts %}
+  <!-- First load dependencies -->
+  <script crossorigin src="https://unpkg.com/@babel/[email protected]/babel.min.js"></script>
+  <script crossorigin src="https://unpkg.com/[email protected]/umd/react.development.js"></script>
+  <script crossorigin src="https://unpkg.com/[email protected]/umd/react-dom.development.js"></script>
   <script crossorigin src="https://unpkg.com/@floating-ui/[email protected]/dist/floating-ui.core.umd.min.js"></script>
   <script crossorigin src="https://unpkg.com/@floating-ui/[email protected]/dist/floating-ui.dom.umd.min.js"></script>
   <script crossorigin src="https://unpkg.com/@floating-ui/[email protected]/dist/floating-ui.react-dom.umd.min.js"></script>
-
   <script src="/docs/_assets/generated/reactui.js" type="application/javascript"></script>
 
-  <!--  We need to load this to make them accessible on the document root (outside shadowDOM) to preview colors etc.-->
-  <link rel="stylesheet" type="text/css" href="/docs/_assets/generated/cssCustomProperties.css">
+  <!-- Then we load and init Docoff -->
+  <script crossorigin src="https://unpkg.com/@react-ui-org/[email protected]/public/generated/bundle.js"></script>
+
+  <!-- Then we load non-Docoff code highlighiting -->
+  <script src="https://unpkg.com/[email protected]/components/prism-core.min.js"></script>
+  <script src="https://unpkg.com/[email protected]/plugins/autoloader/prism-autoloader.min.js"></script>
 {% endblock %}

webpack.config.babel.js

@@ -94,8 +94,8 @@ module.exports = (env, argv) => ({
     }),
     new VisualizerPlugin({
       filename: argv.mode === 'production'
-        ? Path.join(__dirname, 'lib-stats.html')
-        : Path.join(__dirname, 'lib-stats.development.html'),
+        ? 'lib-stats.html'
+        : 'lib-stats.development.html',
     }),
   ],
   resolve: {