Browse Source

Fix nits

main
Dan Abramov 2 years ago
parent
commit
51ad3c6b5d
  1. 12
      beta/src/components/MDX/ExpandableExample.tsx

12
beta/src/components/MDX/ExpandableExample.tsx

@ -30,11 +30,7 @@ function ExpandableExample({
<details <details
open={isExpanded} open={isExpanded}
onToggle={(e: any) => { onToggle={(e: any) => {
setIsExpanded(e.target!.open); setIsExpanded(e.currentTarget!.open);
}}
onClick={(e) => {
// We toggle using a button instead of this whole area.
e.preventDefault();
}} }}
className={cn('my-12 rounded-lg shadow-inner relative', { className={cn('my-12 rounded-lg shadow-inner relative', {
'dark:bg-opacity-20 dark:bg-purple-60 bg-purple-5': isDeepDive, 'dark:bg-opacity-20 dark:bg-purple-60 bg-purple-5': isDeepDive,
@ -42,7 +38,11 @@ function ExpandableExample({
})}> })}>
<summary <summary
className="list-none p-8" className="list-none p-8"
tabIndex={-1 /* there's a button instead */}> tabIndex={-1 /* there's a button instead */}
onClick={(e) => {
// We toggle using a button instead of this whole area.
e.preventDefault();
}}>
<h5 <h5
className={cn('mb-4 uppercase font-bold flex items-center text-sm', { className={cn('mb-4 uppercase font-bold flex items-center text-sm', {
'dark:text-purple-30 text-purple-50': isDeepDive, 'dark:text-purple-30 text-purple-50': isDeepDive,

Loading…
Cancel
Save