bright
bright copied to clipboard
Impossible to style the <pre > element
I wanted to reduce the padding for <pre>, this didn't work for me
<Code
{...props}
extensions={[
{
name: "pre",
Pre: (props: BrightProps) => (
<Code.Pre style={{ border : "5px solid red" }} className="my-32 ring-8" {...props} />
),
},
]}
/>
Also this
<Code
{...props}
name: "pre",
Pre={(props: BrightProps) => (
<Code.Pre style={{ border : "5px solid red" }} className="my-32 ring-8" {...props} />
)}
/>
Quick walkaround for those who are stuck
<Code
{...props}
extensions={[
{
name: "pre",
Pre: (props: BrightProps) => (
<div className="[&>pre]:!py-1">
<Code.Pre
{...props}
/>
</div>
),
},
]}
/>