feat(shared): Better theme support in Dot

packages/freesewing.shared/components/mdx/dot-rough.js

@@ -36,6 +36,12 @@ const noBlack = orig => {
   if (orig.getAttribute('stroke') === '#000000') {
     orig.setAttribute('stroke', 'currentColor')
   }
+  if (orig.getAttribute('fill') === '#000000') {
+    orig.setAttribute('fill', 'currentColor')
+  }
+  if (orig.getAttribute('color') === '#000000') {
+    orig.setAttribute('color', 'currentColor')
+  }
 
   return orig
 }
@@ -76,8 +82,8 @@ const coarse = (svg, options) => {
 
   const rc = rough.svg(svg, options || {})
 
+  // Replace shapes
   const children = svg.querySelectorAll('circle, rect, ellipse, line, polygon, polyline, path')
-
   for(let i = 0; i < children.length; i += 1) {
     const original = noBlack(children[i]);
     const params = [];
@@ -125,6 +131,11 @@ const coarse = (svg, options) => {
 
     original.replaceWith(replacement);
   }
+
+  // Replace text color
+  const text = svg.querySelectorAll('text')
+  for(let i = 0; i < text.length; i += 1) noBlack(text[i])
+
 }
 
 export default coarse

packages/freesewing.shared/components/mdx/dot.js

@@ -59,10 +59,9 @@ const Dot = props => {
       // Strip width/height so it's responsive
       svgRef.current.children[0].attributes.width.value = ""
       svgRef.current.children[0].attributes.height.value = ""
-      // Set style for theme support
+      // Add class for specific styling
-      svgRef.current.children[0].setAttribute('stroke', "currentColor")
+      svgRef.current.children[0].setAttribute('class', "no-fs")
     })
-
   }, [dot])
 
   return (
@@ -80,7 +79,7 @@ const Dot = props => {
           ref={svgRef}
           onClick={() => setZoom(!zoom)}
           className={zoom
-            ? 'svg-zoom non-fs-svg'
+            ? 'svg-zoom non-fs-svg text-base-content'
             : "dot shadow p-2 rounded -mt-8 hover:cursor-zoom-in text-base-content non-fs-svg"
           }
           dangerouslySetInnerHTML={{__html: svg}}

packages/freesewing.shared/prebuild/mdx.mjs

@@ -1,6 +1,5 @@
 import path from 'path'
 import fs from 'fs'
-import i18nConfig from '../config/i18n.config.mjs'
 import rdir from 'recursive-readdir'
 import { unified } from 'unified'
 import remarkParser from 'remark-parse'
@@ -91,7 +90,7 @@ export const prebuildMdx = async(site) => {
 
   // Loop over locales
   const pages = {}
-  for (const lang of (site === 'dev' ? ['en'] : i18nConfig.locales)) {
+  for (const lang of (site === 'dev' ? ['en'] : ['en', 'fr', 'es', 'nl', 'de'])) {
 
     console.log(`  - Language: ${lang}`)
 

packages/freesewing.shared/prebuild/strapi.mjs

@@ -2,7 +2,6 @@ import path from 'path'
 import fs from 'fs'
 import axios from 'axios'
 import { strapiHost } from '../config/freesewing.mjs'
-import i18nConfig from '../config/i18n.config.mjs'
 import { unified } from 'unified'
 import remarkParser from 'remark-parse'
 import remarkCompiler from 'remark-stringify'
@@ -75,7 +74,7 @@ export const prebuildStrapi = async(site) => {
   for (const type of types) {
     authors[type] = {}
     // Loop over locales
-    for (const lang of (site === 'dev' ? ['en'] : i18nConfig.locales)) {
+    for (const lang of (site === 'dev' ? ['en'] : ['en', 'es', 'de', 'fr', 'nl'])) {
       posts[lang] = {}
       console.log(`  - Language: ${lang}`)
       posts[lang][type] = await getPosts(type, site, lang)