prreviewbuddy 0.86.7 → 0.87.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +49 -0
- package/dist/{delete_review-CwKZQlMg.js → delete_review-D7TXn5ck.js} +5 -1
- package/dist/main.js +1 -1
- package/dist/server.js +338 -130
- package/package.json +1 -1
- package/static/{chunk-Di41wu5k.js → chunk-BKBTVY9X.js} +1 -1
- package/static/{chunk-huqt-B16.js → chunk-BmIk8Mrb.js} +1 -1
- package/static/{chunk-D9x9bcKf.js → chunk-CMC5F4_t.js} +1 -1
- package/static/{chunk-BUD1RoN4.js → chunk-DDm8oQLU.js} +1 -1
- package/static/help.js +1 -1
- package/static/notifications.js +1 -1
- package/static/reviews.js +1 -1
- package/static/runs.js +1 -1
- package/static/settings.js +1 -1
- package/static/shell.css +178 -108
- package/static/workspace.js +47 -47
package/static/shell.css
CHANGED
|
@@ -470,10 +470,20 @@ body > * { flex: 0 0 auto; }
|
|
|
470
470
|
.prb-shell {
|
|
471
471
|
display: grid;
|
|
472
472
|
grid-template-columns: var(--rail-width) minmax(0, 1fr);
|
|
473
|
+
grid-template-rows: auto minmax(0, 1fr);
|
|
473
474
|
flex: 1 1 0;
|
|
474
475
|
min-height: 0;
|
|
475
476
|
}
|
|
476
477
|
.prb-shell > * { min-height: 0; }
|
|
478
|
+
/* The application shell is the strip and the rail, and the rail starts directly under the strip on
|
|
479
|
+
every page. What a page says about itself (its context bar, or a review's bar and banners) sits at
|
|
480
|
+
the top of the content column beside the rail, so however tall it is it moves only that column.
|
|
481
|
+
Placed by grid line, never by an offset: the rail spans both rows, the bar takes the first row of
|
|
482
|
+
the last column and the content the second, so the same rules hold when the narrow layout drops
|
|
483
|
+
the rail and the shell is one column. */
|
|
484
|
+
.prb-shell > .prb-rail { grid-column: 1; grid-row: 1 / -1; }
|
|
485
|
+
.prb-shell > .prb-context { grid-column: -2; grid-row: 1; }
|
|
486
|
+
.prb-shell > main { grid-column: -2; grid-row: 2; }
|
|
477
487
|
|
|
478
488
|
/* ── The strip's controls ──
|
|
479
489
|
Notifications, Settings and Stop server, as icons, in the corner they are reached for from. Icon
|
|
@@ -605,6 +615,27 @@ body[data-restarting] .prb-body { opacity: 0.55; pointer-events: none; }
|
|
|
605
615
|
.prb-strip-action:hover .prb-unread-dot,
|
|
606
616
|
.prb-strip-action[aria-current="true"] .prb-unread-dot { border-color: var(--surface-2); }
|
|
607
617
|
.prb-unread-dot[hidden] { display: none; }
|
|
618
|
+
/* The count beside Runs, on the strip's Runs icon: a digit where the bell has a dot, because how
|
|
619
|
+
much is running is the useful part, and capped at 9+ so it stays the size of the corner. */
|
|
620
|
+
.prb-strip-count {
|
|
621
|
+
position: absolute;
|
|
622
|
+
top: -1px;
|
|
623
|
+
right: -3px;
|
|
624
|
+
min-width: 15px;
|
|
625
|
+
padding: 0 4px;
|
|
626
|
+
border: 2px solid var(--bg);
|
|
627
|
+
border-radius: 999px;
|
|
628
|
+
background: var(--wordmark-accent);
|
|
629
|
+
color: var(--bg);
|
|
630
|
+
font-size: var(--t-pill);
|
|
631
|
+
font-weight: 700;
|
|
632
|
+
line-height: 11px;
|
|
633
|
+
text-align: center;
|
|
634
|
+
font-variant-numeric: tabular-nums;
|
|
635
|
+
}
|
|
636
|
+
.prb-strip-action:hover .prb-strip-count,
|
|
637
|
+
.prb-strip-action[aria-current="true"] .prb-strip-count { border-color: var(--surface-2); }
|
|
638
|
+
.prb-strip-count[hidden] { display: none; }
|
|
608
639
|
|
|
609
640
|
/* Said, never shown. The bell carries the count twice: the digit above, capped at 9+, and this,
|
|
610
641
|
which is the whole number in words. A screen reader hears one bell that knows how many. */
|
|
@@ -623,47 +654,39 @@ body[data-restarting] .prb-body { opacity: 0.55; pointer-events: none; }
|
|
|
623
654
|
|
|
624
655
|
/* ── The context bar ──
|
|
625
656
|
What page this is, and the controls belonging to it: the dominant bar on a page that is not a
|
|
626
|
-
review, exactly as `.prb-review-bar` is on one.
|
|
627
|
-
|
|
657
|
+
review, exactly as `.prb-review-bar` is on one. Two regions, one border: the title row, the same
|
|
658
|
+
height on every page and the same height as the review bar, and beneath it the controls row of a
|
|
659
|
+
page that has controls. So the title sits at the same place on every page and only the presence
|
|
660
|
+
of controls changes how tall the bar is. It does not scroll because nothing it is in scrolls:
|
|
661
|
+
`main`, the row below it in the shell, is the scroller. */
|
|
628
662
|
.prb-context {
|
|
629
|
-
display: flex;
|
|
630
|
-
align-items: center;
|
|
631
|
-
flex-wrap: wrap;
|
|
632
|
-
gap: 12px 16px;
|
|
633
663
|
flex: none;
|
|
634
|
-
min-height: var(--header-height);
|
|
635
|
-
padding: 10px 20px;
|
|
636
664
|
background: var(--surface);
|
|
637
665
|
border-bottom: 1px solid var(--border);
|
|
638
666
|
}
|
|
667
|
+
/* Title at the workspace's left edge on every page, never in the list's centred column: it names the
|
|
668
|
+
page, and the page is the whole column. Actions (Mark all read) take the right of the row. A fixed
|
|
669
|
+
height, not a minimum, so a row of actions can never make one page's title row taller. */
|
|
670
|
+
.prb-context-primary {
|
|
671
|
+
display: flex;
|
|
672
|
+
align-items: center;
|
|
673
|
+
gap: 16px;
|
|
674
|
+
box-sizing: border-box;
|
|
675
|
+
height: var(--header-height);
|
|
676
|
+
padding: 0 20px;
|
|
677
|
+
container-type: inline-size;
|
|
678
|
+
}
|
|
639
679
|
.prb-context .prb-page-title { margin: 0; }
|
|
680
|
+
/* The reviews and runs toolbars sit over the list they govern, so this row takes the list's own
|
|
681
|
+
gutters (`.prb-shell > .prb-index`) and the search's edges are the cards' edges at every width. */
|
|
682
|
+
.prb-context-secondary {
|
|
683
|
+
--list-gutter: max(24px, calc((100% - 960px) / 2 + 24px));
|
|
684
|
+
padding: 12px var(--list-gutter);
|
|
685
|
+
border-top: 1px solid var(--border);
|
|
686
|
+
}
|
|
640
687
|
/* The controls came up from the top of the page's own column, so the margins that spaced them from
|
|
641
688
|
the content below them belong to that column, not to this bar. */
|
|
642
|
-
.prb-context .prb-index-controls
|
|
643
|
-
.prb-context .prb-settings-back { margin-bottom: 0; }
|
|
644
|
-
/* The reviews toolbar shares the list's column rather than the window's right edge.
|
|
645
|
-
The bar is full-bleed and the list is a 960px column centred in the space beside the rail, so
|
|
646
|
-
right-aligning the controls put them over nothing they govern: the search began past the middle
|
|
647
|
-
of the page while the cards below started far to its left. Centring them in the space the title
|
|
648
|
-
leaves is not the same thing either -- the title eats the left side, the rail shifts the column
|
|
649
|
-
right, and the group lands short of the list by half the rail.
|
|
650
|
-
So the title is given the rail's own width and the group the column's, from the same two numbers
|
|
651
|
-
the layout below already uses. The search spans the column, so its edges are the cards' edges
|
|
652
|
-
at every width wide enough to have a rail. */
|
|
653
|
-
/* Scoped with :has() and not by a body class: all three workspace pages share `prb-index-body`,
|
|
654
|
-
and only this bar holds the list's controls. */
|
|
655
|
-
.prb-context:has(.prb-index-controls) { padding-left: 0; padding-right: 0; column-gap: 0; }
|
|
656
|
-
.prb-context:has(.prb-index-controls) .prb-page-title { flex: none; box-sizing: border-box; width: var(--rail-width); padding-left: 20px; }
|
|
657
|
-
.prb-context .prb-index-controls {
|
|
658
|
-
flex: 1 1 320px;
|
|
659
|
-
box-sizing: border-box;
|
|
660
|
-
max-width: 960px;
|
|
661
|
-
margin: 0 auto;
|
|
662
|
-
padding: 0 24px;
|
|
663
|
-
}
|
|
664
|
-
/* Two rows: the search on its own, the filters below it. Search is how a reviewer finds a review and
|
|
665
|
-
the filters refine what it found, so the search takes the column's whole width rather than
|
|
666
|
-
competing with three dropdowns for it, and the filters sit together under its left edge. */
|
|
689
|
+
.prb-context .prb-index-controls { margin-bottom: 0; }
|
|
667
690
|
.prb-context .prb-index-search { flex: 1 1 100%; padding: 6px 10px; font-size: var(--t-meta); }
|
|
668
691
|
.prb-context-controls {
|
|
669
692
|
display: flex;
|
|
@@ -671,6 +694,22 @@ body[data-restarting] .prb-body { opacity: 0.55; pointer-events: none; }
|
|
|
671
694
|
gap: 12px;
|
|
672
695
|
margin-left: auto;
|
|
673
696
|
}
|
|
697
|
+
.prb-context-controls .prb-index-select { flex: none; }
|
|
698
|
+
/* Where the title row cannot hold the title, the unread line and Mark all read, the line goes and
|
|
699
|
+
the button stays: the button is the action, and the line says what the dot on the bell already
|
|
700
|
+
says. 270px is where "Nothing unread", the longest the line gets, stops fitting (a window under
|
|
701
|
+
about 310px). Visually hidden rather than removed, because it is the live region a screen reader
|
|
702
|
+
hears. */
|
|
703
|
+
@container (max-width: 270px) {
|
|
704
|
+
.prb-context-controls .prb-index-count {
|
|
705
|
+
position: absolute;
|
|
706
|
+
width: 1px;
|
|
707
|
+
height: 1px;
|
|
708
|
+
margin: -1px;
|
|
709
|
+
overflow: hidden;
|
|
710
|
+
clip-path: inset(50%);
|
|
711
|
+
}
|
|
712
|
+
}
|
|
674
713
|
|
|
675
714
|
/* ── Stop-server dialog ── */
|
|
676
715
|
.prb-dialog {
|
|
@@ -938,10 +977,11 @@ a.prb-author:hover .prb-author-name { color: var(--text-primary); }
|
|
|
938
977
|
|
|
939
978
|
/* ── Three-pane body ── */
|
|
940
979
|
.prb-body {
|
|
941
|
-
/* Positioned, for
|
|
980
|
+
/* Positioned, for the assistant's overlay at narrow widths. */
|
|
942
981
|
position: relative;
|
|
943
982
|
display: grid;
|
|
944
983
|
grid-template-columns: var(--rail-width) minmax(0, 1fr) var(--ask-width);
|
|
984
|
+
grid-template-rows: auto minmax(0, 1fr);
|
|
945
985
|
/* Whatever the banners above did not take, and `0` rather than `auto` as the basis: the height
|
|
946
986
|
comes from the space left over, never from the content. With `auto` the browser measures the
|
|
947
987
|
panes first, which is how a pane full of findings ends up deciding how tall the shell is. */
|
|
@@ -957,6 +997,19 @@ a.prb-author:hover .prb-author-name { color: var(--text-primary); }
|
|
|
957
997
|
* `min-height: auto` on a grid item made every pane as tall as its content and the whole page went
|
|
958
998
|
* rigid. `.prb-ask` already carried its own copy of this line, which was the clue. */
|
|
959
999
|
.prb-body > * { min-height: 0; }
|
|
1000
|
+
/* The review's header (its bar and banners) is the first row of the columns right of the rail, as a
|
|
1001
|
+
workspace page's context bar is (see `.prb-shell`): it spans the document and the assistant, and
|
|
1002
|
+
pushes down only them. The rail spans both rows from directly under the strip. The panes take the
|
|
1003
|
+
second row and are placed into its columns in order. Where the rail is not drawn (focus mode, the
|
|
1004
|
+
narrow layout) the body is one column and the header spans it. */
|
|
1005
|
+
.prb-body > .prb-review-head { grid-column: 2 / -1; grid-row: 1; min-width: 0; }
|
|
1006
|
+
.prb-body > .prb-rail { grid-column: 1; grid-row: 1 / -1; }
|
|
1007
|
+
.prb-body > .prb-doc,
|
|
1008
|
+
.prb-body > .prb-ask { grid-row: 2; }
|
|
1009
|
+
/* Buddy AI's edge tab and, at narrow widths, the assistant's overlay are positioned against the
|
|
1010
|
+
panes' row rather than the whole body, so neither covers the header. An absolutely positioned
|
|
1011
|
+
grid child takes the area its lines name as its containing block. */
|
|
1012
|
+
.prb-body > .prb-ask-tab { grid-row: 2; grid-column: 1 / -1; }
|
|
960
1013
|
/* No `data-ask` means "whatever fits" — wide viewports show the assistant, narrow ones do not.
|
|
961
1014
|
The attribute appears only once the reviewer states a preference, and from then on it wins. */
|
|
962
1015
|
.prb-body[data-ask='closed'] { grid-template-columns: var(--rail-width) minmax(0, 1fr) 0; }
|
|
@@ -974,8 +1027,32 @@ a.prb-author:hover .prb-author-name { color: var(--text-primary); }
|
|
|
974
1027
|
overflow-y: auto;
|
|
975
1028
|
padding: 18px 0 18px;
|
|
976
1029
|
}
|
|
977
|
-
/*
|
|
1030
|
+
/* Three parts, in one order on every page: the places, this review's section (review pages only),
|
|
1031
|
+
the foot. The places and the foot keep their size; the section takes what is left and scrolls on
|
|
1032
|
+
its own, so a long review path never pushes Runs or Collapse sidebar out of the window. The rail
|
|
1033
|
+
still scrolls as a whole if the places and the foot alone are taller than it. */
|
|
1034
|
+
.prb-rail-places,
|
|
1035
|
+
.prb-rail-foot { flex: none; }
|
|
978
1036
|
.prb-rail-foot { margin-top: auto; }
|
|
1037
|
+
.prb-rail-context {
|
|
1038
|
+
flex: 1 1 auto;
|
|
1039
|
+
min-height: 0;
|
|
1040
|
+
overflow-y: auto;
|
|
1041
|
+
overscroll-behavior: contain;
|
|
1042
|
+
}
|
|
1043
|
+
.prb-rail-places + .prb-rail-context { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--border); }
|
|
1044
|
+
/* The foot is anchored to the bottom by its auto margin, whatever is above it and however short.
|
|
1045
|
+
The rule between groups sets a fixed margin and is more specific than `.prb-rail-foot`, so it had
|
|
1046
|
+
been winning and leaving the foot wherever the rows above it ended. The gap it kept is now the
|
|
1047
|
+
least space above the foot, held by whatever precedes it, which an auto margin cannot hold. */
|
|
1048
|
+
.prb-rail > .prb-rail-group.prb-rail-foot { margin-top: auto; padding-top: 18px; border-top: 1px solid var(--border); }
|
|
1049
|
+
.prb-rail > :has(+ .prb-rail-foot) { margin-bottom: 22px; }
|
|
1050
|
+
/* The page with no places (the offline preview) starts with the section, with nothing to rule off. */
|
|
1051
|
+
.prb-rail-context-title { margin: 0; }
|
|
1052
|
+
/* KISS, the section's last group, is set apart by space alone: it belongs to this review as much as
|
|
1053
|
+
the rows above it, and a rule would say it did not. The same in every state, so sliding a Compact
|
|
1054
|
+
sidebar out does not move it. */
|
|
1055
|
+
.prb-rail-context > .prb-rail-group { margin-top: 12px; }
|
|
979
1056
|
a.prb-rail-item { text-decoration: none; }
|
|
980
1057
|
.prb-rail-item:disabled { opacity: 0.6; cursor: default; }
|
|
981
1058
|
/* Operational, and it ends every open review rather than this one. It stays quiet — the
|
|
@@ -991,11 +1068,6 @@ a.prb-rail-item { text-decoration: none; }
|
|
|
991
1068
|
color: var(--text-muted);
|
|
992
1069
|
}
|
|
993
1070
|
.prb-rail-group + .prb-rail-group { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--border); }
|
|
994
|
-
/* A group that is only its own row (KISS before anybody has run it) is spaced as tightly as Compact
|
|
995
|
-
spaces every row, and in every state, so sliding the sidebar out does not grow it. A group with
|
|
996
|
-
pages under it keeps the wider spacing in every state, Compact included. */
|
|
997
|
-
.prb-rail-group + .prb-rail-group:has(> .prb-rail-body:empty) { margin-top: 12px; padding-top: 12px; }
|
|
998
|
-
.prb-rail-group:has(> .prb-rail-body:empty) + .prb-rail-group { margin-top: 12px; }
|
|
999
1071
|
|
|
1000
1072
|
/* A group owns everything under it: the row navigates to that review type's summary and the twisty
|
|
1001
1073
|
beside it folds the group away. The twisty is a sibling of the button, not a child, so one click
|
|
@@ -1155,12 +1227,17 @@ a.prb-rail-item { text-decoration: none; }
|
|
|
1155
1227
|
"Review path" and "PR context" wrapped to two lines part-way and every row below dropped. */
|
|
1156
1228
|
:root[data-sidebar-compact][data-sidebar-peek] .prb-rail > * { width: calc(var(--rail-full-width) - 1px); }
|
|
1157
1229
|
|
|
1158
|
-
/* Compact: every row is its icon
|
|
1159
|
-
|
|
1160
|
-
|
|
1161
|
-
|
|
1162
|
-
|
|
1230
|
+
/* Compact: every row is its icon. What has no icon (headings, the numbered review path, the folds,
|
|
1231
|
+
most counts) waits for the sidebar to slide out, which resting the pointer on it or tabbing into
|
|
1232
|
+
it does at once, so a row's name is never shown any other way. It is still the row's name for a
|
|
1233
|
+
screen reader: the label stays in the row, only undrawn. Neither the rail nor its section
|
|
1234
|
+
scrolls in the 56px strip, where a scrollbar would take a third of it. */
|
|
1163
1235
|
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail { overflow: visible; }
|
|
1236
|
+
/* The section keeps the height it has when slid out, so the foot stays on screen however short the
|
|
1237
|
+
window and no row moves when the sidebar slides out. It clips vertically only, which `clip` can do
|
|
1238
|
+
and `hidden` cannot, so the corner marks are never cut at its side, and rows past its end are
|
|
1239
|
+
reached by sliding the sidebar out (pointer or Tab), where it scrolls. */
|
|
1240
|
+
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-context { overflow-x: visible; overflow-y: clip; }
|
|
1164
1241
|
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-item {
|
|
1165
1242
|
position: relative;
|
|
1166
1243
|
justify-content: center;
|
|
@@ -1169,26 +1246,16 @@ a.prb-rail-item { text-decoration: none; }
|
|
|
1169
1246
|
padding: 9px 0;
|
|
1170
1247
|
border-left-width: 0;
|
|
1171
1248
|
}
|
|
1172
|
-
|
|
1249
|
+
/* Undrawn, not removed: the label is still the row's name, and New review's. */
|
|
1250
|
+
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-item .prb-rail-label,
|
|
1251
|
+
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-new-review-label {
|
|
1173
1252
|
position: absolute;
|
|
1174
|
-
|
|
1175
|
-
|
|
1176
|
-
|
|
1177
|
-
|
|
1178
|
-
border-radius: 6px;
|
|
1179
|
-
background: var(--text-primary);
|
|
1180
|
-
color: var(--bg);
|
|
1181
|
-
font-size: var(--t-micro);
|
|
1182
|
-
font-weight: 500;
|
|
1183
|
-
line-height: 1.4;
|
|
1253
|
+
width: 1px;
|
|
1254
|
+
height: 1px;
|
|
1255
|
+
overflow: hidden;
|
|
1256
|
+
clip-path: inset(50%);
|
|
1184
1257
|
white-space: nowrap;
|
|
1185
|
-
opacity: 0;
|
|
1186
|
-
pointer-events: none;
|
|
1187
|
-
z-index: 1;
|
|
1188
1258
|
}
|
|
1189
|
-
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-item .prb-rail-label * { color: inherit; font: inherit; }
|
|
1190
|
-
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-item:hover .prb-rail-label,
|
|
1191
|
-
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-item:focus-visible .prb-rail-label { opacity: 1; transition: opacity 0.1s 0.35s; }
|
|
1192
1259
|
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-count,
|
|
1193
1260
|
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-selected,
|
|
1194
1261
|
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-twisty,
|
|
@@ -1201,39 +1268,59 @@ a.prb-rail-item { text-decoration: none; }
|
|
|
1201
1268
|
strip it would be a line taller than the row it stands in for. */
|
|
1202
1269
|
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-subhead { visibility: hidden; overflow: hidden; }
|
|
1203
1270
|
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-subhead .prb-rail-heading { display: block; white-space: nowrap; }
|
|
1271
|
+
/* The section's heading keeps its height undrawn for the same reason, so the review's icons are
|
|
1272
|
+
already where they will be when the sidebar slides out. */
|
|
1273
|
+
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-heading.prb-rail-context-title { display: block; visibility: hidden; overflow: hidden; white-space: nowrap; }
|
|
1274
|
+
/* The count beside Runs is the one count Compact keeps, as a mark on the icon's corner: work going
|
|
1275
|
+
on is the thing a reader with the sidebar folded most needs to see. Unread has the bell's dot. */
|
|
1276
|
+
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-count.prb-rail-running:not([hidden]) {
|
|
1277
|
+
display: block;
|
|
1278
|
+
position: absolute;
|
|
1279
|
+
top: 3px;
|
|
1280
|
+
left: calc(50% + 2px);
|
|
1281
|
+
min-width: 15px;
|
|
1282
|
+
padding: 0 4px;
|
|
1283
|
+
border: 2px solid var(--bg);
|
|
1284
|
+
border-radius: 999px;
|
|
1285
|
+
background: var(--wordmark-accent);
|
|
1286
|
+
color: var(--bg);
|
|
1287
|
+
font-size: var(--t-pill);
|
|
1288
|
+
line-height: 11px;
|
|
1289
|
+
text-align: center;
|
|
1290
|
+
}
|
|
1291
|
+
/* Issues and Questions keep their indicator too, on the same corner as Runs, but quiet: what is
|
|
1292
|
+
left is a fact about the review, not an alert. The same element as Expanded, so the figure, the
|
|
1293
|
+
zero and the tick are whatever the expanded row says. Absolute, so no icon or row moves. The ring
|
|
1294
|
+
is the row's own background, so it separates the mark from the icon on every row state. */
|
|
1295
|
+
:root[data-sidebar-compact]:not([data-sidebar-peek]) :is([data-view-nav='issues'], [data-view-nav='questions']) .prb-rail-count {
|
|
1296
|
+
display: block;
|
|
1297
|
+
position: absolute;
|
|
1298
|
+
top: 3px;
|
|
1299
|
+
left: calc(50% + 1px);
|
|
1300
|
+
min-width: 13px;
|
|
1301
|
+
padding: 0 2px;
|
|
1302
|
+
border-radius: 999px;
|
|
1303
|
+
background: var(--surface-2);
|
|
1304
|
+
box-shadow: 0 0 0 1px var(--rail-mark-ring, var(--bg));
|
|
1305
|
+
color: var(--text-secondary);
|
|
1306
|
+
font-size: var(--t-pill);
|
|
1307
|
+
font-weight: 600;
|
|
1308
|
+
line-height: 13px;
|
|
1309
|
+
text-align: center;
|
|
1310
|
+
}
|
|
1311
|
+
:root[data-sidebar-compact]:not([data-sidebar-peek]) :is([data-view-nav='issues'], [data-view-nav='questions']) .prb-rail-count-done { color: var(--success); font-weight: 700; }
|
|
1312
|
+
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-item:hover { --rail-mark-ring: var(--surface-hover); }
|
|
1313
|
+
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-item[aria-current='true'] { --rail-mark-ring: var(--brand-muted); }
|
|
1204
1314
|
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-body { margin-left: 0; border-left: 0; }
|
|
1205
1315
|
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-body .prb-rail-item { padding-left: 0; }
|
|
1206
|
-
/* New review is the square + at the top
|
|
1316
|
+
/* New review is the square + at the top; sliding out shows its name and shortcut beside it. */
|
|
1207
1317
|
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-rail-new { padding: 0 10px 10px; }
|
|
1208
|
-
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-new-review {
|
|
1209
|
-
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-new-review-label,
|
|
1318
|
+
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-new-review { justify-content: center; width: 36px; padding: 0; }
|
|
1210
1319
|
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-new-review-key { display: none; }
|
|
1211
|
-
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-new-review[data-tip]::after {
|
|
1212
|
-
content: attr(data-tip);
|
|
1213
|
-
position: absolute;
|
|
1214
|
-
top: 50%;
|
|
1215
|
-
left: calc(100% + 6px);
|
|
1216
|
-
transform: translateY(-50%);
|
|
1217
|
-
padding: 5px 8px;
|
|
1218
|
-
border-radius: 6px;
|
|
1219
|
-
background: var(--text-primary);
|
|
1220
|
-
color: var(--bg);
|
|
1221
|
-
font-size: var(--t-micro);
|
|
1222
|
-
font-weight: 500;
|
|
1223
|
-
line-height: 1.4;
|
|
1224
|
-
white-space: nowrap;
|
|
1225
|
-
opacity: 0;
|
|
1226
|
-
pointer-events: none;
|
|
1227
|
-
z-index: 1;
|
|
1228
|
-
}
|
|
1229
|
-
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-new-review[data-tip]:hover::after,
|
|
1230
|
-
:root[data-sidebar-compact]:not([data-sidebar-peek]) .prb-new-review[data-tip]:focus-visible::after { opacity: 1; transition: opacity 0.1s 0.35s; }
|
|
1231
1320
|
|
|
1232
1321
|
/* Hidden: the strip's square New review stands in, as it does whenever the rail is not drawn. Send
|
|
1233
1322
|
feedback belongs to the sidebar and goes with it; the strip has no copy of it at any width. */
|
|
1234
1323
|
:root[data-sidebar-hidden] .prb-strip .prb-strip-new-review { display: flex; }
|
|
1235
|
-
/* The page title is set in the rail's column, so it keeps its own width while that column narrows. */
|
|
1236
|
-
:root:is([data-sidebar-compact], [data-sidebar-hidden]) .prb-context:has(.prb-index-controls) .prb-page-title { width: auto; }
|
|
1237
1324
|
/* The pages under a review type (Issues, Questions, Files, PR context) and the links at the foot
|
|
1238
1325
|
share the group rows' white, so the grey themes in the review path read as their own list.
|
|
1239
1326
|
Weight still separates these from the group rows above them. Must come after `.prb-rail-item`:
|
|
@@ -2948,6 +3035,7 @@ a.prb-guide-pick { text-decoration: none; }
|
|
|
2948
3035
|
.prb-body:not([data-ask='open']),
|
|
2949
3036
|
.prb-body[data-ask='open'] { grid-template-columns: minmax(0, 1fr); }
|
|
2950
3037
|
.prb-rail { display: none; }
|
|
3038
|
+
.prb-body > .prb-review-head { grid-column: 1 / -1; }
|
|
2951
3039
|
.prb-strip .prb-strip-new-review { display: flex; }
|
|
2952
3040
|
/* No sidebar fits at this width, so Show sidebar would bring back nothing. */
|
|
2953
3041
|
:root[data-sidebar-hidden] .prb-strip .prb-sidebar-restore { display: none; }
|
|
@@ -2966,11 +3054,6 @@ a.prb-guide-pick { text-decoration: none; }
|
|
|
2966
3054
|
width: min(var(--ask-width), 100%);
|
|
2967
3055
|
}
|
|
2968
3056
|
.pr-helper-sidebar.prb-pane { padding: 20px 18px 48px; }
|
|
2969
|
-
/* No rail here, so there is no column beside it for the toolbar to share: the bar goes back to a
|
|
2970
|
-
title and a row of controls, each taking the width it needs. */
|
|
2971
|
-
.prb-context:has(.prb-index-controls) { padding-left: 20px; padding-right: 20px; column-gap: 16px; }
|
|
2972
|
-
.prb-context:has(.prb-index-controls) .prb-page-title { width: auto; padding-left: 0; }
|
|
2973
|
-
.prb-context .prb-index-controls { max-width: none; padding: 0; }
|
|
2974
3057
|
}
|
|
2975
3058
|
|
|
2976
3059
|
/* Phone width. Both bars were one fixed-height row of things that could not shrink, so below about
|
|
@@ -5558,21 +5641,6 @@ span.prb-arch-location:hover { text-decoration: none; }
|
|
|
5558
5641
|
ground the rail and header have. It reuses `.prb-index` for the column and `.prb-field` for the
|
|
5559
5642
|
controls; what is here is only the vertical rhythm of stacked sections and the two things a form
|
|
5560
5643
|
has that no other page in this product has, a save and something to say about it. */
|
|
5561
|
-
/* The way out, where a way out goes: top left of the content, above the first section, rather than
|
|
5562
|
-
among the version and the feedback link where it reads as chrome. The caret is the same one the
|
|
5563
|
-
rail uses for "All reviews", so the two say the same thing in the same shape. */
|
|
5564
|
-
.prb-settings-back {
|
|
5565
|
-
display: inline-block;
|
|
5566
|
-
margin-bottom: 14px;
|
|
5567
|
-
padding: 5px 10px 5px 8px;
|
|
5568
|
-
border: 1px solid var(--border);
|
|
5569
|
-
border-radius: 8px;
|
|
5570
|
-
color: var(--text-secondary);
|
|
5571
|
-
font-size: var(--t-meta);
|
|
5572
|
-
text-decoration: none;
|
|
5573
|
-
}
|
|
5574
|
-
.prb-settings-back:hover { color: var(--text-primary); border-color: var(--border-strong); }
|
|
5575
|
-
.prb-settings-back:focus-visible { outline: 2px solid var(--brand-hover); outline-offset: 2px; }
|
|
5576
5644
|
.prb-settings-section {
|
|
5577
5645
|
padding: 20px 0;
|
|
5578
5646
|
border-bottom: 1px solid var(--border);
|
|
@@ -5869,7 +5937,8 @@ select.prb-addreview-control {
|
|
|
5869
5937
|
|
|
5870
5938
|
/* ── Notifications ── */
|
|
5871
5939
|
|
|
5872
|
-
.prb-rail-unread
|
|
5940
|
+
.prb-rail-unread,
|
|
5941
|
+
.prb-rail-running { color: var(--wordmark-accent); font-weight: 700; }
|
|
5873
5942
|
|
|
5874
5943
|
.prb-notifications {
|
|
5875
5944
|
list-style: none;
|
|
@@ -6016,6 +6085,7 @@ a.prb-notification-open:focus-visible { outline: 2px solid var(--brand-hover); o
|
|
|
6016
6085
|
and without depending on this block staying last. */
|
|
6017
6086
|
body .prb-body[data-focus] { grid-template-columns: minmax(0, 1fr); }
|
|
6018
6087
|
body .prb-body[data-focus] .prb-rail { display: none; }
|
|
6088
|
+
body .prb-body[data-focus] > .prb-review-head { grid-column: 1 / -1; }
|
|
6019
6089
|
/* The rail's New review goes with it, so the strip's square one stands in, as below 860px. */
|
|
6020
6090
|
body:has(.prb-body[data-focus]) .prb-strip .prb-strip-new-review { display: flex; }
|
|
6021
6091
|
/* Focus is left from the pane it expanded, so Show sidebar would bring back nothing here. */
|