fix: adjust floating button position

package.json

@@ -2,7 +2,7 @@
   "name": "notion-enhancer",
   "version": "0.11.1",
   "author": "dragonwocky <thedragonring.bod@gmail.com> (https://dragonwocky.me/)",
-  "description": "an enhancer/customiser for the all-in-one productivity workspace notion.so",
+  "description": "An enhancer/customiser for the all-in-one productivity workspace Notion",
   "homepage": "https://notion-enhancer.github.io",
   "repository": "github:notion-enhancer/desktop",
   "bugs": "https://github.com/notion-enhancer/desktop/issues",

src/core/client.mjs

@@ -4,8 +4,10 @@
  * (https://notion-enhancer.github.io/) under the MIT license
  */
 
+// telemetry endpoint not ready, disabled for current release
+
 import { checkForUpdate } from "./updateCheck.mjs";
-import { sendTelemetryPing } from "./sendTelemetry.mjs";
+// import { sendTelemetryPing } from "./sendTelemetry.mjs";
 import { Modal, Frame } from "./islands/Modal.mjs";
 import { MenuButton } from "./islands/MenuButton.mjs";
 import { Tooltip } from "./islands/Tooltip.mjs";
@@ -152,5 +154,5 @@ export default async (api, db) =>
     insertPanel(api, db),
     insertCustomStyles(api, db),
     loadThemeOverrides(api, db),
-    sendTelemetryPing(),
+    // sendTelemetryPing(),
   ]).then(() => api.sendMessage("notion-enhancer", "load-complete"));

src/core/islands/FloatingButton.mjs

@@ -15,7 +15,7 @@ const setupWrapper = () => {
         if (!$notionAi) return;
         const $wrapper = html`<div
           class="notion-enhancer--floating-buttons z-50 gap-[12px]
-          flex absolute bottom-[calc(26px+env(safe-area-inset-bottom))]"
+          flex absolute bottom-[calc(16px+env(safe-area-inset-bottom))]"
         ></div>`;
         removeMutationListener(addToDom);
         $notionAi.after($wrapper);

src/core/menu/islands/Banner.mjs

@@ -166,14 +166,13 @@ function Banner({ updateAvailable, isDevelopmentBuild }) {
           >Sponsor me
         <//>
       </div>
-      <!-- Disclaimer: these perks are only a draft, for anyone reading this.
-      This information may change at any time. -->
+      <!-- Disclaimer: draft of potential perks, to be confirmed before full release. -->
       <${Description} class="mt-[6px]">
-        Sponsors help make open-source development sustainable and receive
+        <!-- Sponsors help make open-source development sustainable and receive
         access to priority support channels, private developer previews, and
         role cosmetics on Discord. A one-time donation is equivalent to 1 month
         of sponsor perks. To learn more about perks, read the
-        <a href=${tsAndCs} class="ml-[3px]">Terms & Conditions</a>.
+        <a href=${tsAndCs} class="ml-[3px]">Terms & Conditions</a>. -->
       <//>
     </div>`;
   initDatabase()

src/core/menu/islands/Onboarding.mjs

@@ -31,9 +31,7 @@ function Onboarding() {
         process and/or store data on your device (including workspace content,
         device metadata, and notion-enhancer configuration) as described in its
         privacy policy. Unless otherwise stated, the notion-enhancer will never
-        transmit your information from your device. Collection of anonymous
-        telemetry data is enabled by default and can be disabled at any time
-        through the menu.
+        transmit personally identifiable information from your device.
         <br /><br />
         The notion-enhancer is free and open-source software distributed under
         the <a href="${tsAndCs}#license">MIT License</a> without warranty of any

src/core/menu/islands/Telemetry.mjs

@@ -4,6 +4,8 @@
  * (https://notion-enhancer.github.io/) under the MIT license
  */
 
+// telemetry endpoint not ready, disabled for current release
+
 import { collectTelemetryData } from "../../sendTelemetry.mjs";
 import { Option } from "./Options.mjs";
 

src/core/menu/menu.mjs

@@ -9,12 +9,12 @@ import { Sidebar } from "./islands/Sidebar.mjs";
 import { Footer } from "./islands/Footer.mjs";
 import { Banner } from "./islands/Banner.mjs";
 import { Onboarding } from "./islands/Onboarding.mjs";
-import { Telemetry } from "./islands/Telemetry.mjs";
 import { View } from "./islands/View.mjs";
 import { List } from "./islands/List.mjs";
 import { Mod } from "./islands/Mod.mjs";
 import { Options } from "./islands/Options.mjs";
 import { Profiles } from "./islands/Profiles.mjs";
+import { Description } from "./islands/Description.mjs";
 
 let _apiImport, //
   _renderStarted,
@@ -137,10 +137,76 @@ const renderMenu = async () => {
                   isDevelopmentBuild=${await isDevelopmentBuild()}
                 />
                 <${Onboarding} />
+                <div
+                  class="p-6 rounded-[4px] mt-[16px] text-[14px]
+                  border border-[color:var(--theme--fg-red)]
+                  bg-[color:var(--theme--dim-red)] typography"
+                >
+                  Hi there! Before you go any further, <b>please note that this update is
+                  not feature complete.</b> As part of an internal overhaul and the Chrome
+                  extension's upgrade to manifest v3, all themes and extensions must be
+                  ported manually across to the new version.
+                  <br />
+                  <br />
+                  The following extensions have not been updated yet but will be
+                  soon:
+                  <ul class="list-disc pl-6">
+                    <li>indentation lines</li>
+                    <li>view scale</li>
+                    <li>emoji sets</li>
+                    <li>simpler databases</li>
+                    <li>icon sets</li>
+                    <li>quick note</li>
+                  </ul>
+                  <br />
+                  The theming system is incomplete and only mostly recolours the
+                  app's interface. The following themes have not been updated
+                  yet but will be soon:
+                  <ul class="list-disc pl-6">
+                    <li>dark+</li>
+                    <li>light+</li>
+                    <li>nord</li>
+                    <li>dracula</li>
+                    <li>neutral</li>
+                    <li>cherry cola</li>
+                    <li>gruvbox dark</li>
+                    <li>gruvbox light</li>
+                    <li>pastel dark</li>
+                    <li>pinky boom</li>
+                    <li>playful purple</li>
+                  </ul>
+                  <br />
+                  In the meantime, the styling for these themes can be
+                  found <a href="https://github.com/notion-enhancer/repo"
+                  >here</a> and
+                  copy/pasted into your custom styles alongside the <a
+                    href="https://github.com/notion-enhancer/repo/blob/dev/theming/theme.css"
+                    >old theming system</a>, if you wish.
+                  <br />
+                  <br />
+                  The following extensions have been deprecated as their feature
+                  offerings are now available within Notion by default. Some
+                  features that belonged to these extensions have been merged
+                  into the notion-enhancer's core or into the tweaks extension:
+                  <ul class="list-disc pl-6">
+                    <li>integrated titlebar</li>
+                    <li>collapsible properties</li>
+                    <li>collapsible headers</li>
+                    <li>tray</li>
+                    <li>tabs</li>
+                    <li>weekly view</li>
+                    <li>truncated titles</li>
+                    <li>global block links</li>
+                  </ul>
+                  <br />
+                  A full changelog and updated documentation will be made
+                  available on the website as soon as possible. This release is
+                  being made available early in order to comply with Chrome's
+                  deprecation of manifest v2.
+                </div>
               <//>
               <${View} id="core">
                 <${Options} mod=${mods.find(({ _src }) => _src === "core")} />
-                <${Telemetry} />
                 <${Profiles} />
               <//>
               ${[...categories, ...mods]

src/core/sendTelemetry.mjs

@@ -4,6 +4,8 @@
  * (https://notion-enhancer.github.io/) under the MIT license
  */
 
+// telemetry endpoint not ready, disabled for current release
+
 const pingEndpoint = "https://notion-enhancer.deno.dev/api/ping",
   collectTelemetryData = async () => {
     const { platform, version } = globalThis.__enhancerApi,
@@ -17,29 +19,29 @@ const pingEndpoint = "https://notion-enhancer.deno.dev/api/ping",
     return { platform, version, timezone, enabled_mods };
   },
   sendTelemetryPing = async () => {
-    const db = __enhancerApi.initDatabase(),
-      { version } = globalThis.__enhancerApi,
-      agreedToTerms = await db.get("agreedToTerms"),
-      telemetryEnabled = (await db.get("telemetryEnabled")) ?? true;
-    if (!telemetryEnabled || agreedToTerms !== version) return;
+    // const db = __enhancerApi.initDatabase(),
+    //   { version } = globalThis.__enhancerApi,
+    //   agreedToTerms = await db.get("agreedToTerms"),
+    //   telemetryEnabled = (await db.get("telemetryEnabled")) ?? true;
+    // if (!telemetryEnabled || agreedToTerms !== version) return;
 
-    const lastTelemetryPing = await db.get("lastTelemetryPing");
-    if (lastTelemetryPing) {
-      const msSincePing = Date.now() - new Date(lastTelemetryPing);
-      // send ping only once a week
-      if (msSincePing / 8.64e7 < 7) return;
-    }
+    // const lastTelemetryPing = await db.get("lastTelemetryPing");
+    // if (lastTelemetryPing) {
+    //   const msSincePing = Date.now() - new Date(lastTelemetryPing);
+    //   // send ping only once a week
+    //   if (msSincePing / 8.64e7 < 7) return;
+    // }
 
-    try {
-      const telemetryData = await collectTelemetryData(),
-        pingTimestamp = await fetch(pingEndpoint, {
-          method: "POST",
-          body: JSON.stringify(telemetryData),
-        }).then((res) => res.text());
-      await db.set("lastTelemetryPing", pingTimestamp);
-    } catch (err) {
-      console.error(err);
-    }
+    // try {
+    //   const telemetryData = await collectTelemetryData(),
+    //     pingTimestamp = await fetch(pingEndpoint, {
+    //       method: "POST",
+    //       body: JSON.stringify(telemetryData),
+    //     }).then((res) => res.text());
+    //   await db.set("lastTelemetryPing", pingTimestamp);
+    // } catch (err) {
+    //   console.error(err);
+    // }
   };
 
 export { collectTelemetryData, sendTelemetryPing };

src/manifest.json

@@ -3,7 +3,7 @@
   "name": "notion-enhancer",
   "version": "0.11.1",
   "author": "dragonwocky <thedragonring.bod@gmail.com> (https://dragonwocky.me/)",
-  "description": "an enhancer/customiser for the all-in-one productivity workspace notion.so",
+  "description": "An enhancer/customiser for the all-in-one productivity workspace Notion",
   "homepage_url": "https://notion-enhancer.github.io",
   "content_scripts": [{ "matches": ["*://*.notion.so/*"], "js": ["/init.js"] }],
   "background": { "service_worker": "/worker.js" },
@@ -20,7 +20,6 @@
     "tabs",
     "storage",
     "userScripts",
-    "clipboardRead",
     "clipboardWrite",
     "unlimitedStorage"
   ],

src/registry.json

@@ -10,5 +10,6 @@
   "extensions/right-to-left",
   "extensions/no-peeking",
   "extensions/focus",
-  "themes/classic-dark"
+  "themes/classic-dark",
+  "themes/material-ocean"
 ]

src/themes/classic-dark/mod.json

@@ -1,7 +1,7 @@
 {
-  "id": "fe0f4498-df34-4dd8-8470-27b6fcec9acd",
   "name": "Classic Dark",
   "version": "1.0.0",
+  "id": "fe0f4498-df34-4dd8-8470-27b6fcec9acd",
   "description": "The original Notion dark theme from pre-2022.",
   "thumbnail": "classic-dark.png",
   "tags": ["dark"],

src/themes/material-ocean/client.css

@@ -0,0 +1,87 @@
+/**
+ * notion-enhancer: material ocean
+ * (c) 2020 Abubakar Yagoub <i@blacksuan19.me> (https://blacksuan19.tk)
+ * (c) 2024 dragonwocky <thedragonring.bod@gmail.com> (https://dragonwocky.me/)
+ * (https://notion-enhancer.github.io/) under the MIT license
+ */
+
+body.dark {
+  --ocean--main: #0f111a;
+  --ocean--sec: #00010a;
+  --ocean--tet: #000108;
+  --ocean--accent: #ff4151;
+  --ocean--light_gray: #e9e9e9;
+  --ocean--gray: #e0e0e0;
+  --ocean--brown: #d8b6a6;
+  --ocean--orange: #fde3c0;
+  --ocean--yellow: #ebcb8b;
+  --ocean--green: #a3be8c;
+  --ocean--blue: #81a1c1;
+  --ocean--purple: #b48ead;
+  --ocean--pink: #ffc0cb;
+  --ocean--red: #bf616a;
+
+  --theme--fg-secondary: var(--ocean--gray);
+  --theme--fg-border: rgba(255, 255, 255, 0.1);
+  --theme--fg-gray: var(--ocean--gray);
+  --theme--fg-brown: var(--ocean--brown);
+  --theme--fg-orange: var(--ocean--orange);
+  --theme--fg-yellow: var(--ocean--yellow);
+  --theme--fg-green: var(--ocean--green);
+  --theme--fg-blue: var(--ocean--blue);
+  --theme--fg-purple: var(--ocean--purple);
+  --theme--fg-pink: var(--ocean--pink);
+  --theme--fg-red: var(--ocean--red);
+
+  --theme--bg-primary: var(--ocean--main);
+  --theme--bg-secondary: var(--ocean--sec);
+  --theme--bg-hover: rgb(0, 1, 8, 0.3);
+  --theme--bg-light_gray: var(--ocean--light_gray);
+  --theme--bg-gray: var(--ocean--gray);
+  --theme--bg-brown: var(--ocean--brown);
+  --theme--bg-orange: var(--ocean--orange);
+  --theme--bg-yellow: var(--ocean--yellow);
+  --theme--bg-green: var(--ocean--green);
+  --theme--bg-blue: var(--ocean--blue);
+  --theme--bg-purple: var(--ocean--purple);
+  --theme--bg-pink: var(--ocean--pink);
+  --theme--bg-red: var(--ocean--red);
+
+  --theme--dim-light_gray: var(--ocean--light_gray);
+  --theme--dim-gray: #e0e0e089;
+  --theme--dim-brown: #d8b6a692;
+  --theme--dim-orange: #fde3c09f;
+  --theme--dim-yellow: #ffe6a6ad;
+  --theme--dim-green: #a3be8ca3;
+  --theme--dim-blue: #81a1c1a3;
+  --theme--dim-purple: #b48eada8;
+  --theme--dim-pink: #ffc0cbb1;
+  --theme--dim-red: #bf616a9e;
+
+  --theme--accent-primary: var(--ocean--accent);
+  --theme--accent-primary_hover: #fc3747;
+  --theme--accent-primary_transparent: rgba(255, 65, 81, 0.2);
+  --theme--accent-secondary: var(--ocean--accent);
+  --theme--accent-secondary_hover: #fc3747;
+
+  --theme--scrollbar-track: transparent;
+  --theme--scrollbar-thumb: var(--ocean--sec);
+  --theme--scrollbar-thumb_hover: var(--ocean--accent);
+
+  --theme--code-inline_fg: #b3f5c8;
+  --theme--code-inline_bg: var(--ocean--sec);
+  --theme--code-block_bg: var(--ocean--sec);
+  --theme--code-keyword: var(--ocean--pink);
+  --theme--code-builtin: var(--ocean--yellow);
+  --theme--code-class_name: var(--ocean--blue);
+  --theme--code-number: var(--ocean--purple);
+  --theme--code-property: var(--ocean--pink);
+  --theme--code-regex: var(--ocean--yellow);
+  --theme--code-url: var(--ocean--yellow);
+  --theme--code-punctuation: var(--ocean--gray);
+  --theme--code-comment: var(--ocean--gray);
+  --theme--code-tag: var(--ocean--pink);
+  --theme--code-attr_name: var(--ocean--yellow);
+  --theme--code-selector: var(--ocean--orange);
+  --theme--code-atrule: var(--ocean--orange);
+}

src/themes/material-ocean/mod.json

@@ -1,23 +1,21 @@
 {
-  "name": "material ocean",
+  "name": "Material Ocean",
+  "version": "0.3.0",
   "id": "69e7ccb2-4aef-484c-876d-3de1b433d2b9",
-  "version": "0.2.0",
-  "description": "an oceanic colour palette.",
-  "preview": "material-ocean.png",
-  "tags": ["theme", "dark"],
+  "description": "An oceanic colour palette with pink highlights.",
+  "thumbnail": "material-ocean.png",
+  "tags": ["dark"],
   "authors": [
+    {
+      "name": "dragonwocky",
+      "homepage": "https://dragonwocky.me/",
+      "avatar": "https://dragonwocky.me/avatar.jpg"
+    },
     {
       "name": "blacksuan19",
-      "email": "abubakaryagob@gmail.com",
       "homepage": "http://github.com/blacksuan19",
       "avatar": "https://avatars.githubusercontent.com/u/10248473"
     }
   ],
-  "css": {
-    "frame": ["variables.css"],
-    "client": ["variables.css"],
-    "menu": ["variables.css"]
-  },
-  "js": {},
-  "options": []
+  "clientStyles": ["client.css"]
 }

src/themes/material-ocean/variables.css

@@ -1,173 +0,0 @@
-/**
- * notion-enhancer: material ocean
- * (c) 2020 Abubakar Yagoub <i@blacksuan19.me> (https://blacksuan19.tk)
- * (https://notion-enhancer.github.io/) under the MIT license
- */
-
-:root.dark {
-  --ocean--main: #0f111a;
-  --ocean--sec: #00010a;
-  --ocean--tet: #000108;
-  --ocean--accent: #ff4151;
-  --ocean--light_gray: #E9E9E9;
-  --ocean--gray: #e0e0e0;
-  --ocean--brown: #d8b6a6;
-  --ocean--orange: #fde3c0;
-  --ocean--yellow: #ebcb8b;
-  --ocean--green: #a3be8c;
-  --ocean--blue: #81a1c1;
-  --ocean--purple: #b48ead;
-  --ocean--pink: #ffc0cb;
-  --ocean--red: #bf616a;
-
-  --theme--accent_blue: var(--ocean--accent);
-  --theme--accent_blue-selection: rgba(255, 65, 81, 0.2);
-  --theme--accent_blue-hover: #fc3747;
-  --theme--accent_blue-active: #ff4d5c;
-  --theme--accent_blue-text: #fff;
-  --theme--accent_red: var(--ocean--accent);
-  --theme--accent_red-button: #ff41514b;
-  --theme--accent_red-text: #fff;
-
-  --theme--bg: var(--ocean--main);
-  --theme--bg_secondary: var(--ocean--sec);
-  --theme--bg_card: var(--ocean--sec);
-
-  --theme--scrollbar_track: transparent;
-  --theme--scrollbar_thumb: var(--ocean--sec);
-  --theme--scrollbar_thumb-hover: var(--ocean--accent);
-
-  --theme--ui_divider: rgba(255, 255, 255, 0.1);
-  --theme--ui_interactive-hover: rgb(0, 1, 8, 0.3);
-  --theme--ui_interactive-active: rgb(0, 1, 8, 0.6);
-  --theme--ui_toggle-off: #30313c;
-  --theme--ui_corner_action: var(--theme--bg_card);
-  --theme--ui_corner_action-hover: var(--theme--ui_interactive-hover);
-  --theme--ui_corner_action-active: var(--theme--ui_interactive-active);
-
-  --theme--icon: var(--ocean--gray);
-  --theme--icon_secondary: var(--ocean--gray);
-
-  --theme--text: #fff;
-  --theme--text_secondary: var(--ocean--gray);
-  --theme--text_gray: var(--ocean--gray);
-  --theme--text_brown: var(--ocean--brown);
-  --theme--text_orange: var(--ocean--orange);
-  --theme--text_yellow: var(--ocean--yellow);
-  --theme--text_green: var(--ocean--green);
-  --theme--text_blue: var(--ocean--blue);
-  --theme--text_purple: var(--ocean--purple);
-  --theme--text_pink: var(--ocean--pink);
-  --theme--text_red: var(--ocean--red);
-
-  --theme--highlight_gray: var(--ocean--gray);
-  --theme--highlight_gray-text: var(--ocean--main);
-  --theme--highlight_brown: var(--ocean--brown);
-  --theme--highlight_brown-text: var(--ocean--main);
-  --theme--highlight_orange: var(--ocean--orange);
-  --theme--highlight_orange-text: var(--ocean--main);
-  --theme--highlight_yellow: var(--ocean--yellow);
-  --theme--highlight_yellow-text: var(--ocean--main);
-  --theme--highlight_green: var(--ocean--green);
-  --theme--highlight_green-text: var(--ocean--main);
-  --theme--highlight_blue: var(--ocean--blue);
-  --theme--highlight_blue-text: var(--ocean--main);
-  --theme--highlight_purple: var(--ocean--purple);
-  --theme--highlight_purple-text: var(--ocean--main);
-  --theme--highlight_pink: var(--ocean--pink);
-  --theme--highlight_pink-text: var(--ocean--main);
-  --theme--highlight_red: var(--ocean--red);
-  --theme--highlight_red-text: var(--ocean--main);
-
-  --theme--callout_gray: #e0e0e089;
-  --theme--callout_gray-text: var(--ocean--main);
-  --theme--callout_brown: #d8b6a692;
-  --theme--callout_brown-text: var(--ocean--main);
-  --theme--callout_orange: #fde3c09f;
-  --theme--callout_orange-text: var(--ocean--main);
-  --theme--callout_yellow: #ffe6a6ad;
-  --theme--callout_yellow-text: var(--ocean--main);
-  --theme--callout_green: #a3be8ca3;
-  --theme--callout_green-text: var(--ocean--main);
-  --theme--callout_blue: #81a1c1a3;
-  --theme--callout_blue-text: var(--ocean--main);
-  --theme--callout_purple: #b48eada8;
-  --theme--callout_purple-text: var(--ocean--main);
-  --theme--callout_pink: #ffc0cbb1;
-  --theme--callout_pink-text: var(--ocean--main);
-  --theme--callout_red: #bf616a9e;
-  --theme--callout_red-text: var(--ocean--main);
-
-  --theme--tag_default: var(--ocean--gray);
-  --theme--tag_default-text: var(--ocean--main);
-  --theme--tag_light_gray: var(--ocean--light_gray);
-  --theme--tag_light_gray-text: var(--ocean--main);
-  --theme--tag_gray: var(--theme--highlight_gray);
-  --theme--tag_gray-text: var(--ocean--main);
-  --theme--tag_brown: var(--theme--highlight_brown);
-  --theme--tag_brown-text: var(--ocean--main);
-  --theme--tag_orange: var(--theme--highlight_orange);
-  --theme--tag_orange-text: var(--ocean--main);
-  --theme--tag_yellow: var(--theme--highlight_yellow);
-  --theme--tag_yellow-text: var(--ocean--main);
-  --theme--tag_green: var(--theme--highlight_green);
-  --theme--tag_green-text: var(--ocean--main);
-  --theme--tag_blue: var(--theme--highlight_blue);
-  --theme--tag_blue-text: var(--ocean--main);
-  --theme--tag_purple: var(--theme--highlight_purple);
-  --theme--tag_purple-text: var(--ocean--main);
-  --theme--tag_pink: var(--theme--highlight_pink);
-  --theme--tag_pink-text: var(--ocean--main);
-  --theme--tag_red: var(--theme--highlight_red);
-  --theme--tag_red-text: var(--ocean--main);
-
-  --theme--board_light_gray: var(--ocean--light_gray);
-  --theme--board_light_gray-text: var(--ocean--main);
-  --theme--board_light_gray-card: rgba(0, 0, 0, 0.075);
-  --theme--board_gray: var(--theme--highlight_gray);
-  --theme--board_gray-text: var(--theme--highlight_gray-text);
-  --theme--board_gray-card: rgba(0, 0, 0, 0.075);
-  --theme--board_brown: var(--theme--highlight_brown);
-  --theme--board_brown-text: var(--theme--highlight_brown-text);
-  --theme--board_brown-card: rgba(0, 0, 0, 0.075);
-  --theme--board_orange: var(--theme--highlight_orange);
-  --theme--board_orange-text: var(--theme--highlight_orange-text);
-  --theme--board_orange-card: rgba(0, 0, 0, 0.075);
-  --theme--board_yellow: var(--theme--highlight_yellow);
-  --theme--board_yellow-text: var(--theme--highlight_yellow-text);
-  --theme--board_yellow-card: rgba(0, 0, 0, 0.075);
-  --theme--board_green: var(--theme--highlight_green);
-  --theme--board_green-text: var(--theme--highlight_green-text);
-  --theme--board_green-card: rgba(0, 0, 0, 0.075);
-  --theme--board_blue: var(--theme--highlight_blue);
-  --theme--board_blue-text: var(--theme--highlight_blue-text);
-  --theme--board_blue-card: rgba(0, 0, 0, 0.075);
-  --theme--board_purple: var(--theme--highlight_purple);
-  --theme--board_purple-text: var(--theme--highlight_purple-text);
-  --theme--board_purple-card: rgba(0, 0, 0, 0.075);
-  --theme--board_pink: var(--theme--highlight_pink);
-  --theme--board_pink-text: var(--theme--highlight_pink-text);
-  --theme--board_pink-card: rgba(0, 0, 0, 0.075);
-  --theme--board_red: var(--theme--highlight_red);
-  --theme--board_red-text: var(--theme--highlight_red-text);
-  --theme--board_red-card: rgba(0, 0, 0, 0.075);
-
-  --theme--code_inline: var(--ocean--sec);
-  --theme--code_inline-text: #b3f5c8;
-
-  --theme--code: var(--ocean--sec);
-  --theme--code_function: var(--theme--text_blue);
-  --theme--code_keyword: var(--theme--text_pink);
-  --theme--code_tag: var(--theme--text_pink);
-  --theme--code_operator: var(--theme--text_yellow);
-  --theme--code_property: var(--theme--text_pink);
-  --theme--code_builtin: var(--theme--text_yellow);
-  --theme--code_attr-name: var(--theme--text_yellow);
-  --theme--code_comment: var(--theme--text_gray);
-  --theme--code_punctuation: var(--theme--text_gray);
-  --theme--code_doctype: var(--theme--text_gray);
-  --theme--code_number: var(--theme--text_purple);
-  --theme--code_selector: var(--theme--text_orange);
-  --theme--code_atrule: var(--theme--text_orange);
-  --theme--code_regex: var(--theme--text_yellow);
-}