Merge pull request #923 from brianrourkeboll/examples

Improve API doc content alignment

Author: nojaf

RELEASE_NOTES.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 21.0.0-beta-002 - 2024-06-19
+
+### Changed
+* Shrink API docs example heading font size a bit. [#923](https://github.com/fsprojects/FSharp.Formatting/pull/923)
+* Improve overall API doc content alignment consistency in various scenarios. [#923](https://github.com/fsprojects/FSharp.Formatting/pull/923)
+
 ## 21.0.0-beta-001 - 2024-06-06
 
 ### Added

docs/content/fsdocs-default.css

@@ -1083,6 +1083,22 @@ span[onmouseout] {
         display: flex;
         flex-direction: column;
         justify-content: flex-start;
+
+        > * {
+            margin: var(--spacing-200) 0 var(--spacing-200) var(--spacing-300);
+
+            &:first-child:is(.icon-button-row) {
+                margin-block: 0;
+            }
+
+            &:nth-child(2) {
+                margin-top: 0;
+            }
+
+            &:last-child {
+                margin-bottom: 0;
+            }
+        }
     }
 
     .icon-button-row {
@@ -1099,8 +1115,6 @@ span[onmouseout] {
             counter-increment: list-item 0;
             list-style: disclosure-closed outside;
             cursor: pointer;
-            width: calc(100% - var(--spacing-300));
-            margin-left: var(--spacing-300);
 
             > .fsdocs-summary {
                 display: flex;
@@ -1127,9 +1141,13 @@ span[onmouseout] {
             margin-bottom: var(--spacing-200);
         }
 
-        .fsdocs-returns, .fsdocs-params {
+        & details > * {
             margin: var(--spacing-200) 0 var(--spacing-200) var(--spacing-300);
 
+            &:is(summary) {
+                margin-block: 0;
+            }
+
             &:first-child {
                 margin-top: 0;
             }
@@ -1147,6 +1165,10 @@ span[onmouseout] {
             margin: var(--spacing-200) 0;
         }
 
+        .fsdocs-example-header {
+            font-size: var(--font-200);
+        }
+
         > div.fsdocs-summary {
             display: flex;
             flex-direction: row;