chore: add api explorer class name (#2087)

fern-api · Jan 27, 2025 · 31c5556 · 31c5556
1 parent 1f60ea2
commit 31c5556
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 1 deletion.
diff --git a/packages/fern-docs/ui/src/playground/Playground.scss b/packages/fern-docs/ui/src/playground/Playground.scss
@@ -0,0 +1,5 @@
+@layer components {
+  .api-explorer {
+    @apply bg-background-translucent border-default inset-x-0 bottom-0 border-t shadow-xl backdrop-blur-2xl;
+  }
+}
diff --git a/packages/fern-docs/ui/src/playground/PlaygroundDrawer.tsx b/packages/fern-docs/ui/src/playground/PlaygroundDrawer.tsx
@@ -2,6 +2,7 @@ import { NodeId } from "@fern-api/fdr-sdk/navigation";
 import { FernButton } from "@fern-docs/components";
 import * as Dialog from "@radix-ui/react-dialog";
 import * as VisuallyHidden from "@radix-ui/react-visually-hidden";
+import cn from "clsx";
 import { animate, motion, useMotionValue } from "framer-motion";
 import { Xmark } from "iconoir-react";
 import { useAtomValue, useSetAtom } from "jotai";
@@ -135,7 +136,9 @@ export const PlaygroundDrawer = memo((): ReactElement | null => {
       >
         <Dialog.Portal>
           <Dialog.Content
-            className="bg-background-translucent border-default data-[state=open]:animate-content-show-from-bottom fixed inset-x-0 bottom-0 border-t shadow-xl backdrop-blur-2xl max-sm:h-full"
+            className={cn(
+              "api-explorer data-[state=open]:animate-content-show-from-bottom fixed max-sm:h-full"
+            )}
             onInteractOutside={(e) => {
               e.preventDefault();
             }}

diff --git a/packages/fern-docs/ui/src/playground/index.scss b/packages/fern-docs/ui/src/playground/index.scss
@@ -1 +1,2 @@
 @import "./endpoint/PlaygroundEndpoint";
+@import "./Playground";
Original file line number	Diff line number	Diff line change
		@@ -1 +1,2 @@
		@import "./endpoint/PlaygroundEndpoint";
		@import "./Playground";