From 022dbf3f587847d97c292791e68d15f0caa80161 Mon Sep 17 00:00:00 2001 From: Gabe Serna Date: Thu, 7 Nov 2024 15:34:10 -0500 Subject: [PATCH] Fix: Knob not Working with Accordion Content Transform --- app/audio/MidiEditor.tsx | 11 +++++------ app/globals.css | 14 -------------- components/ui/accordion.tsx | 4 ++-- tailwind.config.ts | 4 ++++ 4 files changed, 11 insertions(+), 22 deletions(-) diff --git a/app/audio/MidiEditor.tsx b/app/audio/MidiEditor.tsx index f5d0e61..49c5e8e 100644 --- a/app/audio/MidiEditor.tsx +++ b/app/audio/MidiEditor.tsx @@ -70,11 +70,11 @@ export default function MidiEditor() { Midi Adjustments - + @@ -82,13 +82,12 @@ export default function MidiEditor() { Audio Controls - - {/* */} - {/* knob inside of the accordion content does not work because of the -translate-y-10 class */} + + (({ className, children, ...props }, ref) => ( -
{children}
+
{children}
)); diff --git a/tailwind.config.ts b/tailwind.config.ts index 2e52d47..9ba82c0 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -65,17 +65,21 @@ const config = { "accordion-down": { from: { height: "0", + transform: "translateY(-20px)", }, to: { height: "var(--radix-accordion-content-height)", + transform: "translateY(0)", }, }, "accordion-up": { from: { height: "var(--radix-accordion-content-height)", + transform: "translateY(0)", }, to: { height: "0", + transform: "translateY(-20px)", }, }, },