fix: hotfixes for storybook themes and eslint

Author: ovflowd

.eslintrc.json

@@ -2,9 +2,9 @@
   "extends": ["prettier"],
   "overrides": [
     {
-      "files": ["**/*.{mjs,ts,tsx}"],
+      "files": ["**/*.{js,mjs,ts,tsx}"],
       "extends": ["eslint:recommended"],
-      "env": { "jest": true, "es6": true }
+      "env": { "jest": true, "es6": true, "browser": true }
     },
     {
       "files": ["**/*.{mjs,ts,tsx,mdx}"],

.storybook/preview.tsx

@@ -1,7 +1,6 @@
 import NextImage from 'next/image';
 import { withThemeByDataAttribute } from '@storybook/addon-themes';
 import { SiteProvider } from '../providers/siteProvider';
-import { ThemeProvider } from '../providers/themeProvider';
 import { LocaleProvider } from '../providers/localeProvider';
 import { OPEN_SANS_FONT, STORYBOOK_MODES, STORYBOOK_SIZES } from './constants';
 import type { Preview, ReactRenderer } from '@storybook/react';
@@ -21,11 +20,9 @@ const preview: Preview = {
     Story => (
       <SiteProvider>
         <LocaleProvider>
-          <ThemeProvider>
-            <div className={`${OPEN_SANS_FONT.variable}`}>
-              <Story />
-            </div>
-          </ThemeProvider>
+          <div className={`${OPEN_SANS_FONT.variable}`}>
+            <Story />
+          </div>
         </LocaleProvider>
       </SiteProvider>
     ),

public/static/js/legacyMain.js

@@ -2,26 +2,13 @@ const themeAttr = 'data-theme';
 
 const setTheme = theme => {
   document.querySelector('html').setAttribute(themeAttr, theme);
-  document.body.className = theme;
   window.localStorage.setItem('theme', theme);
 };
 
 const preferredColorScheme = window.matchMedia('(prefers-color-scheme: dark)');
 
 const getTheme = () => window.localStorage.getItem('theme');
 
-const versionIntoHref = (nodeList, filename) => {
-  const linkEls = Array.prototype.slice.call(nodeList);
-  let version;
-  let el;
-
-  for (let i = 0; i < linkEls.length; i++) {
-    version = linkEls[i].getAttribute('data-version');
-    el = linkEls[i];
-    el.href += filename.replace('%version%', version);
-  }
-};
-
 const listenLanguagePickerButton = () => {
   const langPickerTogglerElement = document.querySelector(
     '.lang-picker-toggler'

styles/old/base.css

@@ -1,4 +1,4 @@
-body {
+html {
   background-color: $white;
   box-sizing: border-box;
   color: $node-gray;

styles/old/layout/dark-theme.css

@@ -1,11 +1,6 @@
-[data-theme='dark'] body,
-body.dark {
+html[data-theme='dark'] {
   background-color: $dark-black;
   color: $white;
-}
-
-[data-theme='dark'] body,
-.dark {
   color-scheme: dark;
 
   .dark-theme-switcher {
@@ -23,8 +18,6 @@ body.dark {
   }
 
   #main {
-    background-color: $dark-black;
-
     p,
     h1,
     h2,