wip(fs.dev): Work on mdx components
This commit is contained in:
parent
1b888f02f1
commit
18566b5d37
10 changed files with 78 additions and 60 deletions
|
@ -10,6 +10,17 @@ const colors = {
|
|||
none: '',
|
||||
}
|
||||
|
||||
let forceTailwind = <p className="border-accent" />
|
||||
forceTailwind = <p className="text-accent" />
|
||||
forceTailwind = <p className="border-secondary" />
|
||||
forceTailwind = <p className="text-secondary" />
|
||||
forceTailwind = <p className="border-error" />
|
||||
forceTailwind = <p className="text-error" />
|
||||
forceTailwind = <p className="border-warning" />
|
||||
forceTailwind = <p className="text-warning" />
|
||||
forceTailwind = <p className="border-info" />
|
||||
forceTailwind = <p className="text-info" />
|
||||
|
||||
const Popout = (props) => {
|
||||
let type = 'none'
|
||||
for (const t in colors) {
|
||||
|
@ -20,8 +31,8 @@ const Popout = (props) => {
|
|||
return (
|
||||
<div className="relative my-4">
|
||||
<div className={`
|
||||
border-l-4 px-8 py-2 prose lg:prose-lg bg-opacity-5 shadow border-${color} bg-${color}`}>
|
||||
<div className={`font-bold opacity-50 uppercase`}>
|
||||
border-l-4 px-8 py-2 prose lg:prose-lg shadow border-${color}`}>
|
||||
<div className={`font-bold uppercase text-${color}`}>
|
||||
{type}
|
||||
</div>
|
||||
<div className="py-1 first:mt-0 popout-content">{props.children}</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue