build(docs-infra): fix individual API overload templates (#24976)

* Make individual overloads collapsible
* Show only the first overload expanded, rest collapsed
* Text changes to 'collapse all' once 'show all' is clicked
* Fix chevron/carrot rotation animation when overloads / overload item is expanded or collapsed

PR Close #24976

aio/src/styles/1-layouts/_api-pages.scss

@@ -161,13 +161,35 @@
 
       summary {
         height: inherit;
-        padding: 0 8px 8px;
+        padding: 0 0 8px;
 
         h4 {
           margin: 0;
         }
+
+        .show-all {
+          display: initial;
+        }
+        .collapse-all {
+          display: none;
+        }
       }
-  }
+
+      &[open] > summary {
+        .show-all {
+          display: none;
+        }
+        .collapse-all {
+          display: initial;
+        }
+      }
+    }
+
+    details.overload {
+      box-shadow: none;
+      margin: 0;
+    }
+
 
     .from-constructor, .read-only-property {
       font-size: 12px;
@@ -248,7 +270,11 @@ details {
     padding: 16px 24px;
   }
 
-  &[open] > i.material-icons {
-    @include rotate(180deg); // Rotate the icon
+  // Rotate the icon
+  summary i.material-icons.expand {
+    @include rotate(0deg);
+  }
+  &[open] > summary i.material-icons.expand {
+    @include rotate(180deg);
   }
 }