@stackoverflow/stacks 2.5.8 → 2.7.0

package/dist/css/stacks.css

@@ -803,6 +803,15 @@ body.theme-highcontrast .s-badge__new {
   --_ba-bg: var(--orange-200);
   --_ba-fc: var(--orange-600);
 }
+.s-badge.s-badge__ai {
+  --_ba-bc: var(--_ba-fc);
+  --_ba-bg: var(--black-050);
+  --_ba-fc: var(--orange-500);
+  --_ba-tt: uppercase;
+}
+.s-badge.s-badge__bot {
+  --_ba-bc: var(--black-300);
+}
 .s-badge.s-badge__danger.s-badge__filled,
 .s-badge.s-badge__muted.s-badge__filled {
   --_ba-bc: transparent;
@@ -1245,7 +1254,6 @@ body.theme-highcontrast .s-breadcrumbs .s-breadcrumbs--divider {
 body.theme-highcontrast .s-btn {
   --_bu-bc: currentColor;
   --_bu-outlined-bc: var(--_bu-bc);
-  --_bu-bc-selected: var(--_bu-bc);
   --_bu-fc-selected: var(--white);
   --_bu-outlined-fc-selected: var(--white);
   --_bu-badge-o: 0.8;
@@ -1478,6 +1486,7 @@ p .s-btn.s-btn__link {
   --_bu-p: 0.7em;
 }
 body.theme-highcontrast .s-btn.s-btn__danger,
+body.theme-highcontrast .s-btn.s-btn__featured,
 body.theme-highcontrast .s-btn.s-btn__muted {
   --_bu-filled-bc: transparent;
 }
@@ -1506,6 +1515,31 @@ body.theme-highcontrast .s-btn.s-btn__muted {
   --_bu-number-fc: var(--white);
   --_bu-number-fc-filled: var(--black);
 }
+.s-btn.s-btn__featured {
+  --_bu-bg-active: var(--purple-300);
+  --_bu-bg-hover: var(--purple-200);
+  --_bu-bg-selected: var(--purple-300);
+  --_bu-fc: var(--purple-500);
+  --_bu-fc-active: var(--_bu-fc);
+  --_bu-fc-hover: var(--purple-500);
+  --_bu-fc-selected: var(--purple-600);
+  --_bu-filled-bc: transparent;
+  --_bu-filled-bc-selected: var(--_bu-filled-bc);
+  --_bu-filled-bg: var(--purple-400);
+  --_bu-filled-bg-active: var(--purple-500);
+  --_bu-filled-bg-hover: var(--purple-500);
+  --_bu-filled-bg-selected: var(--purple-600);
+  --_bu-filled-fc: var(--white);
+  --_bu-filled-fc-active: var(--_bu-filled-fc);
+  --_bu-filled-fc-hover: var(--_bu-filled-fc);
+  --_bu-filled-fc-selected: var(--_bu-filled-fc);
+  --_bu-outlined-bc: var(--purple-400);
+  --_bu-outlined-bc-selected: var(--purple-500);
+  --_bu-outlined-bg-selected: var(--_bu-bg-selected);
+  --_bu-outlined-fc-selected: var(--_bu-fc-selected);
+  --_bu-number-fc: var(--white);
+  --_bu-number-fc-filled: var(--black);
+}
 .s-btn.s-btn__muted {
   --_bu-bc-hover: var(--black-300);
   --_bu-bg-active: var(--black-150);
@@ -1536,6 +1570,7 @@ body.theme-highcontrast .s-btn.s-btn__muted {
   --_bu-number-fc-focus: var(--black-500);
 }
 body.theme-highcontrast .s-btn.s-btn__muted {
+  --_bu-bc-hover: currentColor;
   --_bu-bg-hover: var(--black-225);
   --_bu-filled-bg: var(--black-400);
   --_bu-filled-bg-active: var(--black-500);
@@ -1543,6 +1578,7 @@ body.theme-highcontrast .s-btn.s-btn__muted {
   --_bu-filled-bg-selected: var(--black-500);
   --_bu-filled-fc: var(--white);
   --_bu-filled-fc-selected: var(--_bu-filled-fc);
+  --_bu-bc-selected: currentColor;
   --_bu-fc-selected: var(--black);
   --_bu-number-fc: var(--white);
   --_bu-number-fc-filled: var(--black);
@@ -1628,19 +1664,19 @@ body.theme-highcontrast .s-btn.s-btn__github {
   border-color: var(--_bu-filled-bc-hover);
   color: var(--_bu-filled-fc-hover);
 }
-.s-btn:not(.s-btn--radio:checked + label):not(.s-btn__link):not(.s-btn__unset):not(.s-btn__facebook):not(.s-btn__github):not(.s-btn__google):not(.is-selected):hover:not(.s-btn__outlined) {
+.s-btn:not(.s-btn--radio:checked + label):not(.s-btn__link):not(.s-btn__unset):not(.s-btn__facebook):not(.s-btn__github):not(.s-btn__google):not(.is-selected):hover:not(.s-btn__outlined):not(.s-btn__filled) {
   border-color: var(--_bu-bc-hover);
 }
-.s-btn:not(.s-btn--radio:checked + label):not(.s-btn__link):not(.s-btn__unset):not(.s-btn__facebook):not(.s-btn__github):not(.s-btn__google):not(.is-selected):hover:visited:not(:active):not(:focus) {
-  background-color: var(--_bu-bg);
-  border-color: var(--_bu-bc);
-  color: var(--_bu-fc);
-}
 .s-btn:not(.s-btn--radio:checked + label):not(.s-btn__link):not(.s-btn__unset):not(.s-btn__facebook):not(.s-btn__github):not(.s-btn__google):not(.is-selected):hover:visited:not(:active):not(:focus).s-btn__filled {
   background-color: var(--_bu-filled-bg);
   border-color: var(--_bu-filled-bc);
   color: var(--_bu-filled-fc);
 }
+.s-btn:not(.s-btn--radio:checked + label):not(.s-btn__link):not(.s-btn__unset):not(.s-btn__facebook):not(.s-btn__github):not(.s-btn__google):not(.is-selected):hover:visited:not(:active):not(:focus):not(.s-btn__outlined) {
+  background-color: var(--_bu-bg);
+  border-color: var(--_bu-bc);
+  color: var(--_bu-fc);
+}
 .s-btn:not(.s-btn--radio:checked + label):not(.s-btn__link):not(.s-btn__unset):not(.s-btn__facebook):not(.s-btn__github):not(.s-btn__google):not(.is-selected):active {
   background-color: var(--_bu-bg-active);
   border-color: var(--_bu-bc-active);
@@ -3377,10 +3413,11 @@ body.theme-highcontrast .s-notice__warning.s-notice__important {
 .s-page-title .s-breadcrumbs {
   margin-bottom: var(--_pt-breadcrums-mb);
 }
-.s-pagination {
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--su4);
+.s-pagination ul,
+ul.s-pagination {
+  list-style: none;
+  margin: 0;
+  padding: 0;
 }
 .s-pagination .s-pagination--item {
   --_pa-item-bg: transparent;
@@ -3395,6 +3432,7 @@ body.theme-highcontrast .s-notice__warning.s-notice__important {
   border: 1px solid var(--_pa-item-bc);
   color: var(--_pa-item-fc);
   border-radius: var(--br-sm);
+  display: inline-block;
   font-size: var(--fs-body1);
   line-height: var(--lh-xl);
   padding: 0 var(--su8);
@@ -3434,6 +3472,12 @@ body.theme-highcontrast .s-pagination .s-pagination--item {
   background-color: var(--_pa-item-bg-focus);
   color: var(--_pa-item-fc-focus);
 }
+.s-pagination,
+.s-pagination ul {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--su4);
+}
 .s-popover {
   --_po-bg: var(--white);
   --_po-bc: var(--bc-medium);
@@ -4917,18 +4961,14 @@ body.theme-highcontrast .is-readonly .s-select > select {
 }
 .s-sidebarwidget {
   --_sw-bc: var(--bc-medium);
-  --_sw-after-bc: var(--_sw-bc);
-  --_sw-content-bc: var(--bc-light);
-  --_sw-header-bc: var(--_sw-content-bc);
   background-color: var(--white);
   border: var(--su-static1) solid var(--_sw-bc);
-  border-radius: var(--br-sm);
+  border-radius: var(--br-md);
   font-size: var(--fs-body1);
-  position: relative;
 }
-.s-sidebarwidget:not(.s-anchors) a:not(.button):not(.post-tag):not(.s-btn):not(.s-sidebarwidget--action):not(.s-user-card--link),
-.s-sidebarwidget:not(.s-anchors) a:not(.button):not(.post-tag):not(.s-btn):not(.s-sidebarwidget--action):not(.s-user-card--link):visited {
-  color: var(--black-400);
+.s-sidebarwidget:not(.s-anchors) a:not(.button):not(.s-tag):not(.post-tag):not(.s-btn):not(.s-sidebarwidget--action):not(.s-user-card--link),
+.s-sidebarwidget:not(.s-anchors) a:not(.button):not(.s-tag):not(.post-tag):not(.s-btn):not(.s-sidebarwidget--action):not(.s-user-card--link):visited {
+  color: var(--black-600);
 }
 .s-sidebarwidget.s-sidebarwidget__blue {
   --_sw-bc: var(--blue-300);
@@ -4939,12 +4979,11 @@ body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__blue {
   --_sw-bc: var(--blue-500);
 }
 .s-sidebarwidget.s-sidebarwidget__blue:after,
-.s-sidebarwidget.s-sidebarwidget__blue .s-sidebarwidget--content,
+.s-sidebarwidget.s-sidebarwidget__blue .s-sidebarwidget--content + .s-sidebarwidget--content,
 .s-sidebarwidget.s-sidebarwidget__blue .s-sidebarwidget--header {
   border-color: var(--_sw-bc);
 }
 .s-sidebarwidget.s-sidebarwidget__blue .s-sidebarwidget--header {
-  background-color: var(--blue-200);
   color: var(--fc-medium);
 }
 .s-sidebarwidget.s-sidebarwidget__yellow {
@@ -4956,12 +4995,11 @@ body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__yellow {
   --_sw-bc: var(--yellow-500);
 }
 .s-sidebarwidget.s-sidebarwidget__yellow:after,
-.s-sidebarwidget.s-sidebarwidget__yellow .s-sidebarwidget--content,
+.s-sidebarwidget.s-sidebarwidget__yellow .s-sidebarwidget--content + .s-sidebarwidget--content,
 .s-sidebarwidget.s-sidebarwidget__yellow .s-sidebarwidget--header {
   border-color: var(--_sw-bc);
 }
 .s-sidebarwidget.s-sidebarwidget__yellow .s-sidebarwidget--header {
-  background-color: var(--yellow-200);
   color: var(--fc-medium);
 }
 .s-sidebarwidget.s-sidebarwidget__green {
@@ -4973,32 +5011,32 @@ body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__green {
   --_sw-bc: var(--green-500);
 }
 .s-sidebarwidget.s-sidebarwidget__green:after,
-.s-sidebarwidget.s-sidebarwidget__green .s-sidebarwidget--content,
+.s-sidebarwidget.s-sidebarwidget__green .s-sidebarwidget--content + .s-sidebarwidget--content,
 .s-sidebarwidget.s-sidebarwidget__green .s-sidebarwidget--header {
   border-color: var(--_sw-bc);
 }
 .s-sidebarwidget.s-sidebarwidget__green .s-sidebarwidget--header {
-  background-color: var(--green-200);
   color: var(--fc-medium);
 }
 .s-sidebarwidget .s-sidebarwidget--action {
   color: var(--blue-400);
-  float: right;
-  font-size: var(--fs-fine);
-  line-height: calc(var(--fs-body1) * 1.5);
-  margin: 0 0 var(--su4) var(--su8);
+  font-size: var(--fs-body1);
+  font-weight: normal;
+  margin-left: auto;
 }
 .s-sidebarwidget .s-sidebarwidget--content {
-  border-top: var(--su-static1) solid var(--_sw-content-bc);
   margin: 0;
-  padding: var(--su16) calc(var(--su16) - var(--su1));
+  padding: var(--su16);
 }
 .s-sidebarwidget .s-sidebarwidget--content:not(table):not(.s-sidebarwidget__items),
 .s-sidebarwidget .s-sidebarwidget--content:not(table):not(.s-sidebarwidget__block-items) .s-sidebarwidget--item {
   display: flex;
 }
+.s-sidebarwidget .s-sidebarwidget--content + .s-sidebarwidget--content {
+  border-top: var(--su-static1) solid var(--bc-light);
+}
 .s-sidebarwidget .s-sidebarwidget--content.s-sidebarwidget__items {
-  padding: calc(var(--su16) - var(--su12)) calc(var(--su16) - var(--su1));
+  padding: var(--su6) var(--su16);
 }
 .s-sidebarwidget .s-sidebarwidget--content.s-sidebarwidget__items,
 .s-sidebarwidget .s-sidebarwidget--content.s-sidebarwidget__items.s-sidebarwidget__block-items .s-sidebarwidget--item {
@@ -5008,17 +5046,22 @@ body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__green {
   outline: none;
 }
 .s-sidebarwidget .s-sidebarwidget--header {
-  background: var(--black-100);
-  border-top: var(--su-static1) solid var(--_sw-header-bc);
-  color: var(--black-500);
+  align-items: center;
+  border-top: var(--su-static1) solid var(--bc-light);
+  color: var(--black-600);
+  display: flex;
   font-size: var(--fs-body2);
-  font-weight: normal;
+  font-weight: bold;
+  justify-content: flex-start;
+  line-height: var(--lh-xs);
   margin: 0;
-  padding: var(--su12) calc(var(--su16) - var(--su1));
+  padding: var(--su16) var(--su16) 0;
 }
 .s-sidebarwidget .s-sidebarwidget--header:first-child {
-  border-top-left-radius: var(--br-sm);
-  border-top-right-radius: var(--br-sm);
+  border-top: none;
+}
+.s-sidebarwidget .s-sidebarwidget--header + .s-expandable:not(.is-expanded) {
+  margin-bottom: var(--su16);
 }
 .s-sidebarwidget .s-sidebarwidget--header.s-sidebarwidget__expanding-control {
   cursor: pointer;
@@ -5066,10 +5109,10 @@ body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__green {
   border-left-style: solid;
   border-left-width: calc(var(--su-static1) * 3);
   content: '';
-  height: calc(100% + var(--su12));
+  height: calc(100% + var(--su16));
   left: 0;
-  margin-left: calc(calc(var(--su16) - var(--su1)) * -1 - var(--su-static1));
-  margin-top: calc(var(--su12) / 2 * -1);
+  margin-left: calc(var(--su16) * -1 - var(--su-static1));
+  margin-top: calc(var(--su16) / 2 * -1);
   position: absolute;
 }
 .s-sidebarwidget .s-sidebarwidget--item[aria-current="true"] a,
@@ -5109,8 +5152,8 @@ body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__green {
 }
 .s-sidebarwidget table.s-sidebarwidget--content.s-sidebarwidget__items {
   border-collapse: separate;
-  border-spacing: var(--su12);
-  padding: calc(var(--su16) - var(--su12)) calc(calc(var(--su16) - var(--su1)) - var(--su12));
+  border-spacing: var(--su16) var(--su12);
+  padding: var(--su6) 0 0;
 }
 .s-sidebarwidget table.s-sidebarwidget--content.s-sidebarwidget__items tr.s-sidebarwidget--item {
   display: table-row;
@@ -5118,23 +5161,6 @@ body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__green {
 .s-sidebarwidget table.s-sidebarwidget--content.s-sidebarwidget__items tr.s-sidebarwidget--item td {
   padding: 0;
 }
-.s-sidebarwidget:before {
-  content: '';
-  display: block;
-  margin-top: calc(var(--su-static1) * -1);
-}
-.s-sidebarwidget:after {
-  border: var(--su-static1) solid var(--_sw-after-bc);
-  border-radius: var(--br-sm);
-  clip-path: polygon(0% 0%, 100% 0%, 100% 50%, 0% 50%);
-  content: '';
-  height: calc(var(--su-static2) + var(--br-sm));
-  left: calc(var(--su-static1) * -1);
-  pointer-events: none;
-  position: absolute;
-  right: calc(var(--su-static1) * -1);
-  top: calc(var(--su-static1) * -1);
-}
 .s-spinner {
   --_sp-baw: calc(var(--su-static1) * 3);
   --_sp-size: var(--su-static24);
@@ -5323,7 +5349,7 @@ body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__green {
 }
 .s-table.s-table__sortable thead th a,
 .s-table.s-table__sortable thead th button {
-  color: inherit;
+  color: inherit !important;
 }
 .s-table.s-table__sortable thead th button {
   appearance: none;
@@ -6650,8 +6676,8 @@ body {
   --s-step: calc(var(--s-full) / 12);
 }
 body {
-  --_o-disabled: 0.5;
-  --_o-disabled-static: 0.5;
+  --_o-disabled: 0.55;
+  --_o-disabled-static: 0.55;
   --_black-static: hsl(0, 0%, 0%);
   --_white-static: hsl(0, 0%, 100%);
 }
@@ -7160,7 +7186,7 @@ body.theme-highcontrast.theme-system .theme-light__forced {
   --purple-100: hsl(237, 83%, 98%);
   --purple-200: hsl(237, 83%, 98%);
   --purple-300: hsl(237, 55%, 57%);
-  --purple-400: hsl(237, 55%, 57%);
+  --purple-400: hsl(237, 52%, 48%);
   --purple-500: hsl(237, 50%, 32%);
   --purple-600: hsl(237, 50%, 32%);
   --gold-100: hsl(46, 100%, 91%);