Added click to expand text on collapsed scope support section (#2934)

Author: AndreasArvidsson

packages/cursorless-org-docs/src/css/custom.css

@@ -34,7 +34,7 @@
   margin-bottom: 1rem;
 }
 
-.card.open > .card__header {
+.card > .card__header {
   border-bottom: 1px solid var(--ifm-color-emphasis-300);
   padding-bottom: 1rem;
 }

packages/cursorless-org-docs/src/docs/user/languages/components/ScopeSupportForLevel.tsx

@@ -47,7 +47,11 @@ export function ScopeSupportForLevel({
 
   const renderBody = () => {
     if (!open) {
-      return null;
+      return (
+        <div className="card__body pointer" onClick={() => setOpen(true)}>
+          <i>+ Click to expand</i>
+        </div>
+      );
     }
 
     return (
@@ -79,8 +83,8 @@ export function ScopeSupportForLevel({
   };
 
   return (
-    <div className={"card pointer" + (open ? " open" : "")}>
-      <div className="card__header" onClick={() => setOpen(!open)}>
+    <div className={"card" + (open ? " open" : "")}>
+      <div className="card__header pointer" onClick={() => setOpen(!open)}>
         <h3>{title}</h3>
         {subtitle}
       </div>