From e1b11264df0d9169598733dfd65a5cfdc88febdd Mon Sep 17 00:00:00 2001 From: Dmitriy Vasilev Date: Tue, 15 Sep 2026 20:16:39 +0700 Subject: [PATCH] fix(website): keep the embedded spec brief from collapsing onto the tab strip MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The brief is a flex item in a column with min-height:0, so it shrank under pressure -- and it has nothing to give. Collapsed it is one 36px row, and at 370px, where the toolbar above wraps to two lines, it was squeezed to 28px and "ABOUT THIS SPEC" drew itself over the tab strip; open it was squeezed from 461px to the same 28px and drew over everything below. It no longer shrinks, and when open it takes what it needs up to 45vh and scrolls the rest. Встроенная справка о спеке — flex-элемент в колонке с min-height:0, и ей нечего отдавать. В свёрнутом виде это одна строка 36px, но на ширине 370px, где панель сверху переносится на две строки, её сжимало до 28px и надпись "ABOUT THIS SPEC" наезжала на строку табов; в раскрытом виде её сжимало с 461px до тех же 28px. Теперь она не сжимается, а раскрытая занимает до 45vh и прокручивается внутри себя. Co-Authored-By: Claude Opus 5 --- apps/website/src/index.css | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/apps/website/src/index.css b/apps/website/src/index.css index 8082414cec..1916c5e09d 100644 --- a/apps/website/src/index.css +++ b/apps/website/src/index.css @@ -1374,6 +1374,19 @@ input:focus-visible { the landing's embed, where it was taking 284px of an 826px column and leaving the code 332. Scoped under .spec-x like the rest of the Explorer. */ .spec-x-brief { min-height: 0; } +/* This box sits in a column flex with min-height:0, so it shrinks under + pressure -- and it has nothing to give. Collapsed it is one 36px row, and at + 370px, where the toolbar above wraps to two lines, it was squeezed to 28px + and the summary drew itself over the tab strip below; open it was squeezed + from 461px to the same 28px and drew over everything. So it never shrinks, + and when open it takes what it needs up to 45vh and scrolls the rest, + leaving the tab strip and the code pane their own height. */ +.spec-x-brief.is-collapsible { flex: 0 0 auto; } +.spec-x-brief.is-collapsible[open] { + max-height: 45vh; + overflow: auto; + overscroll-behavior: contain; +} .spec-x-brief:not(.is-collapsible) > summary { display: none; } .spec-x-brief.is-collapsible > summary { display: flex;