Make compare sheet nav collapsible and hide run picker in fullscreen.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
oliver 2026-09-21 15:16:53 +08:00
parent 4c3c034c4c
commit 28aa7cd87e
4 changed files with 267 additions and 140 deletions

View file

@ -11327,6 +11327,15 @@ html.login-page--paused .login-page__flare {
padding: 2px 0;
}
.bs-cmp-board__meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
min-width: 0;
flex: 1 1 auto;
}
.bs-cmp-board__run-select {
flex: 0 1 280px;
min-width: 140px;
@ -11355,7 +11364,7 @@ html.login-page--paused .login-page__flare {
align-items: center;
gap: 6px 8px;
min-width: 0;
flex: 1 1 320px;
flex: 1 1 280px;
height: 32px;
padding: 0 8px;
border-radius: 8px;
@ -11440,9 +11449,12 @@ html.login-page--paused .login-page__flare {
margin-left: 0;
}
.bs-cmp-board__meta {
flex: 1 1 100%;
}
.bs-cmp-sides {
flex: 1 1 100%;
order: 3;
height: auto;
min-height: 32px;
padding: 4px 8px;
@ -11452,6 +11464,11 @@ html.login-page--paused .login-page__flare {
.bs-cmp-sides__name {
max-width: none;
}
.bs-cmp-board__run-select {
flex: 1 1 200px;
max-width: none;
}
}
.bs-cmp-board__body {
@ -11461,6 +11478,11 @@ html.login-page--paused .login-page__flare {
flex: 1 1 auto;
min-height: 0;
align-items: stretch;
transition: grid-template-columns 0.18s ease;
}
.bs-cmp-board__body.is-nav-collapsed {
grid-template-columns: 44px minmax(0, 1fr);
}
.bs-cmp-nav {
@ -11475,15 +11497,44 @@ html.login-page--paused .login-page__flare {
.bs-cmp-nav__head {
display: grid;
grid-template-columns: 8px minmax(0, 1fr) auto;
grid-template-columns: 28px minmax(0, 1fr) auto;
align-items: center;
gap: 0 8px;
padding: 8px 10px;
gap: 0 6px;
padding: 6px 8px;
border-bottom: 1px solid var(--bs-cmp-border);
flex: 0 0 auto;
min-height: 36px;
}
.bs-cmp-nav.is-collapsed .bs-cmp-nav__head {
grid-template-columns: 1fr;
justify-items: center;
padding: 6px 4px;
}
.bs-cmp-nav__toggle {
appearance: none;
width: 28px;
height: 28px;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid rgba(148, 163, 184, 0.28);
border-radius: 6px;
background: rgba(15, 23, 42, 0.55);
color: #93c5fd;
font-size: 14px;
font-weight: 700;
line-height: 1;
cursor: pointer;
padding: 0;
}
.bs-cmp-nav__toggle:hover {
background: rgba(37, 99, 235, 0.22);
border-color: rgba(59, 130, 246, 0.45);
}
.bs-cmp-nav__dot--spacer {
visibility: hidden;
}
@ -11597,6 +11648,34 @@ html.login-page--paused .login-page__flare {
transition: background 0.12s ease, border-color 0.12s ease;
}
.bs-cmp-nav.is-collapsed .bs-cmp-nav__item {
grid-template-columns: 1fr;
justify-items: center;
padding: 8px 4px;
border-radius: 6px;
}
.bs-cmp-nav.is-collapsed .bs-cmp-nav__name,
.bs-cmp-nav.is-collapsed .bs-cmp-nav__stats {
display: none;
}
.bs-cmp-nav.is-collapsed .bs-cmp-nav__list {
padding: 4px;
gap: 2px;
align-items: stretch;
}
.bs-cmp-nav.is-collapsed .bs-cmp-nav__dot {
width: 8px;
height: 8px;
}
.bs-cmp-nav.is-collapsed .bs-cmp-nav__item.is-active {
box-shadow: none;
background: rgba(37, 99, 235, 0.28);
}
.bs-cmp-nav__item:hover {
background: rgba(30, 41, 59, 0.75);
}
@ -12042,10 +12121,18 @@ html.login-page--paused .login-page__flare {
grid-template-columns: 1fr;
}
.bs-cmp-board__body.is-nav-collapsed {
grid-template-columns: 1fr;
}
.bs-cmp-nav {
max-height: 180px;
}
.bs-cmp-nav.is-collapsed {
max-height: 52px;
}
.bs-cmp-nav__list {
flex-direction: row;
flex-wrap: nowrap;
@ -12053,6 +12140,10 @@ html.login-page--paused .login-page__flare {
overflow-y: hidden;
}
.bs-cmp-nav.is-collapsed .bs-cmp-nav__list {
display: none;
}
.bs-cmp-nav__item {
flex: 0 0 auto;
min-width: 180px;