diff --git a/RELEASE_NOTES.md b/RELEASE_NOTES.md index d9d5b281..fe1e76e6 100644 --- a/RELEASE_NOTES.md +++ b/RELEASE_NOTES.md @@ -1,5 +1,8 @@ # Changelog +## 20.0.1 - 2024-05-31 +* Details improvements. [#917](https://github.com/fsprojects/FSharp.Formatting/pull/917) + ## 20.0.0 - 2024-02-14 Stable release diff --git a/docs/content/fsdocs-default.css b/docs/content/fsdocs-default.css index 90df59aa..e2063f56 100644 --- a/docs/content/fsdocs-default.css +++ b/docs/content/fsdocs-default.css @@ -47,6 +47,8 @@ --main-grid-row: 2; --main-grid-column: 2; --dialog-width: 500px; + --api-docs-first-column-min-width: 320px; + --api-docs-second-column-min-width: 240px; /* light theme */ --primary: #1e8bc3; @@ -1013,29 +1015,32 @@ span[onmouseout] { padding: var(--spacing-400) 0; } - & tbody td { - border-top: 1px solid var(--header-border); - padding: var(--spacing-300) 0; - padding-right: var(--spacing-300); + & tr { + display: flex; + flex-flow: row wrap; + column-gap: var(--spacing-300); - &:first-child a { + & td:first-of-type { + flex: 25 0 0; + min-width: var(--api-docs-first-column-min-width); overflow-x: hidden; text-overflow: ellipsis; - width: 100%; - display: block; + overflow-wrap: break-word; + + & p { + margin: unset; + } } - &:last-child { - padding-right: 0; + & td:nth-of-type(2) { + flex: 75 0 0; + min-width: var(--api-docs-second-column-min-width); } } - & thead tr td:first-child, & td.fsdocs-entity-name, & td.fsdocs-member-usage { - width: 25%; - - & p { - margin: 0; - } + & tbody td { + border-top: 1px solid var(--header-border); + padding: var(--spacing-300) 0; } .fsdocs-entity-xmldoc { @@ -1043,7 +1048,7 @@ span[onmouseout] { display: flex; flex-direction: row-reverse; justify-content: flex-start; - align-items: center; + align-items: flex-start; & p.fsdocs-summary { margin: 0; @@ -1061,12 +1066,17 @@ span[onmouseout] { .fsdocs-member-xmldoc { & summary { - list-style: none; + display: list-item; + counter-increment: list-item 0; + list-style: disclosure-closed outside; + cursor: pointer; + margin-left: var(--spacing-300); > .fsdocs-summary { display: flex; - align-items: center; flex-direction: row-reverse; + justify-content: flex-start; + align-items: flex-start; & p.fsdocs-summary { margin: 0; @@ -1080,23 +1090,15 @@ span[onmouseout] { overflow-x: auto; } } - - &::after { - content: '▶'; - cursor: pointer; - } } & details[open] summary { + list-style-type: disclosure-open; margin-bottom: var(--spacing-200); } - & details[open] summary::after { - content: "▼"; - } - .fsdocs-returns, .fsdocs-params { - margin: var(--spacing-200) 0; + margin: var(--spacing-200); &:first-child { margin-top: 0; @@ -1110,23 +1112,6 @@ span[onmouseout] { .fsdocs-return-name, .fsdocs-param-name { font-weight: 500; } - - /* hide the browser mark and display one after the summary */ - - & ::marker { - display: none; - } - - > div.fsdocs-summary { - display: flex; - flex-direction: row-reverse; - justify-content: space-between; - align-items: center; - - > p { - margin: 0; - } - } } } diff --git a/docs/content/fsdocs-theme.js b/docs/content/fsdocs-theme.js index 9ea6b3f7..eea7d521 100644 --- a/docs/content/fsdocs-theme.js +++ b/docs/content/fsdocs-theme.js @@ -12,11 +12,18 @@ if (activeItem && mainMenu) { scrollToActiveItem(activeItem); } -if(location.hash) { - const header = document.querySelector(`a[href='${location.hash}']`); - header.scrollIntoView({ behavior: 'instant'}); +function scrollToAndExpandSelectedMember() { + if (location.hash) { + const details = document.querySelector(`tr > td.fsdocs-member-usage:has(a[href='${location.hash}']) ~ td.fsdocs-member-xmldoc > details`); + details?.setAttribute('open', 'true'); + const header = document.querySelector(`a[href='${location.hash}']`); + header?.scrollIntoView({ behavior: 'instant'}); + } } +scrollToAndExpandSelectedMember(); +addEventListener('hashchange', scrollToAndExpandSelectedMember); + if(location.pathname.startsWith('/reference/')) { // Scroll to API Reference header const navHeaders = document.querySelectorAll(".nav-header");