refactor: use panda for Slate span

NDLANO · Nov 8, 2024 · 35b38d8 · 35b38d8
1 parent 6b22a7b
commit 35b38d8
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 10 deletions.
diff --git a/src/components/SlateEditor/plugins/span/Span.tsx b/src/components/SlateEditor/plugins/span/Span.tsx
@@ -6,13 +6,13 @@
  *
  */
 
-import styled from "@emotion/styled";
-import { colors } from "@ndla/core";
+import { styled } from "@ndla/styled-system/jsx";
 
-const Span = styled.span`
-  position: relative;
-  text-decoration: underline;
-  text-decoration-color: ${colors.brand.tertiary};
-`;
-
-export default Span;
+export const Span = styled("span", {
+  base: {
+    position: "relative",
+    textDecoration: "underline",
+    textDecorationThickness: "1px",
+    textDecorationColor: "stroke.subtle",
+  },
+});
diff --git a/src/components/SlateEditor/plugins/span/render.tsx b/src/components/SlateEditor/plugins/span/render.tsx
@@ -8,7 +8,7 @@
 
 import { Editor } from "slate";
 import { RenderElementProps } from "slate-react";
-import Span from "./Span";
+import { Span } from "./Span";
 import { TYPE_SPAN } from "./types";
 import { InlineBugfix } from "../../utils/InlineBugFix";