chore: docusarus v3.8 (#800)

* chore: docusarus v3.8

* chore: fixes

* chore: turn off some v4 opts due to problems

Author: LaurenceJJones

crowdsec-docs/docusaurus.config.js

@@ -47,6 +47,9 @@ const backportRedirect = (s) => {
 /** @type {import('@docusaurus/types').DocusaurusConfig} */
 module.exports = {
     future: {
+        v4: {
+            removeLegacyPostBuildHeadAttribute: true,
+        },
         experimental_faster: true,
     },
     title: "CrowdSec",

crowdsec-docs/package-lock.json

@@ -16,12 +16,12 @@
     "dependencies": {
         "@coreui/icons": "^3.0.1",
         "@coreui/icons-react": "2.3.0",
-        "@docusaurus/core": "^3.7.0",
-        "@docusaurus/faster": "^3.7.0",
-        "@docusaurus/plugin-client-redirects": "^3.7.0",
-        "@docusaurus/preset-classic": "^3.7.0",
-        "@docusaurus/theme-common": "^3.7.0",
-        "@docusaurus/theme-search-algolia": "^3.7.0",
+        "@docusaurus/core": "^3.8.1",
+        "@docusaurus/faster": "^3.8.1",
+        "@docusaurus/plugin-client-redirects": "^3.8.1",
+        "@docusaurus/preset-classic": "^3.8.1",
+        "@docusaurus/theme-common": "^3.8.1",
+        "@docusaurus/theme-search-algolia": "^3.8.1",
         "@emotion/react": "^11.13.3",
         "@emotion/styled": "^11.13.0",
         "@mdx-js/react": "^3.1.0",
@@ -31,8 +31,8 @@
         "@radix-ui/react-tooltip": "^1.1.2",
         "class-variance-authority": "^0.7.0",
         "clsx": "^2.1.1",
-        "lucide-react": "^0.441.0",
         "docusaurus-plugin-zooming": "^1.0.0",
+        "lucide-react": "^0.441.0",
         "material-react-table": "^2.0.2",
         "prism-react-renderer": "^2.4.0",
         "react": "^18.3.1",

crowdsec-docs/package.json

@@ -6,7 +6,7 @@ import {useColorMode} from '@docusaurus/theme-common';
 
 
 const TableRender = ({ columns, url, include=[], exclude=[] }) => {
-    const [jsonContent, setJsonContent] = useState()
+    const [jsonContent, setJsonContent] = useState([])
     const {colorMode} = useColorMode();
 
     const theme = useMemo(() => {

crowdsec-docs/src/components/tableRender.js

@@ -1,10 +1,8 @@
+@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&display=swap');
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
 
-
-@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&display=swap');
-
 /* stylelint-disable docusaurus/copyright-header */
 /**
  * Any CSS included here will be global. The classic template
@@ -258,9 +256,18 @@ html[data-theme="dark"] .footer, html[data-theme="dark"] .navbar, html[data-them
   color: rgb(var(--color-gray-300));
 }
 
+
 /** Patch some colors **/
-svg[class^='lightToggleIcon'], .navbar__toggle > svg, .navbar-sidebar__back {
-  color: #fff;
+button[class*='toggleButton']:hover {
+  background-color: transparent;
+}
+
+svg[class*='toggleIcon'][class*='lightToggleIcon'] {
+  color: #fff !important;
+}
+
+svg[class*='toggleIcon'][class*='ToggleIcon']:hover {
+  color: var(--ifm-color-primary) !important;
 }
 
 

crowdsec-docs/src/css/custom.css

@@ -69,7 +69,7 @@ function TabList({className, block, selectedValue, selectValue, tabValues}) {
             'tabs__item--active': selectedValue === value,
           })}>
 	      <span className='tw-flex tw-gap-2 tw-items-center'>
-	  	{!!icon && <CIcon icon={icon} size='l' />} {label ?? value}
+	  	{!!icon && <CIcon icon={icon} size='lg' />} {label ?? value}
 	      </span>
         </li>
       ))}