fix(site): background color of block editor popovers

Author: ourai

.knosys/presets/tailwind/app.js

@@ -1,6 +1,31 @@
 const { nextui } = require('@nextui-org/react')
 const { fontFamily } = require('tailwindcss/defaultTheme')
 
+// for https://novel.sh/
+const novelColors = {
+  foreground: 'hsl(var(--foreground))',
+  destructive: {
+    DEFAULT: 'hsl(var(--destructive))',
+    foreground: 'hsl(var(--destructive-foreground))',
+  },
+  muted: {
+    DEFAULT: 'hsl(var(--muted))',
+    foreground: 'hsl(var(--muted-foreground))',
+  },
+  accent: {
+    DEFAULT: 'hsl(var(--accent))',
+    foreground: 'hsl(var(--accent-foreground))',
+  },
+  popover: {
+    DEFAULT: 'hsl(var(--popover))',
+    foreground: 'hsl(var(--popover-foreground))',
+  },
+  card: {
+    DEFAULT: 'hsl(var(--card))',
+    foreground: 'hsl(var(--card-foreground))',
+  },
+};
+
 /** @type {import('tailwindcss').Config} */
 module.exports = {
   darkMode: 'class',
@@ -80,6 +105,7 @@ module.exports = {
           'bg-secondary': '#173C32',
           primary: '#F3FF65',
         },
+        ...novelColors,
       },
       borderRadius: {
         none: '0',

src/shared/styles/all.scss

@@ -41,6 +41,23 @@
 ::-webkit-details-marker {   display:none; }
 @layer base {
   :root {
+    --foreground: 222.2 84% 4.9%;
+
+    --card: 0 0% 100%;
+    --card-foreground: 222.2 84% 4.9%;
+
+    --popover: 0 0% 100%;
+    --popover-foreground: 222.2 84% 4.9%;
+
+    --muted: 210 40% 96.1%;
+    --muted-foreground: 215.4 16.3% 46.9%;
+
+    --accent: 210 40% 96.1%;
+    --accent-foreground: 222.2 47.4% 11.2%;
+
+    --destructive: 0 84.2% 60.2%;
+    --destructive-foreground: 210 40% 98%;
+
     --novel-highlight-default: #ffffff;
     --novel-highlight-purple: #f6f3f8;
     --novel-highlight-red: #fdebeb;
@@ -53,6 +70,23 @@
   }
 
   .dark {
+    --foreground: 210 40% 98%;
+
+    --card: 222.2 84% 4.9%;
+    --card-foreground: 210 40% 98%;
+
+    --popover: 222.2 84% 4.9%;
+    --popover-foreground: 210 40% 98%;
+
+    --muted: 217.2 32.6% 17.5%;
+    --muted-foreground: 215 20.2% 65.1%;
+
+    --accent: 217.2 32.6% 17.5%;
+    --accent-foreground: 210 40% 98%;
+
+    --destructive: 0 62.8% 30.6%;
+    --destructive-foreground: 210 40% 98%;
+
     --novel-highlight-default: #000000;
     --novel-highlight-purple: #3f2c4b;
     --novel-highlight-red: #5c1a1a;