@stackoverflow/stacks 3.0.0-beta.19 → 3.0.0-beta.20

package/dist/css/stacks.css

@@ -708,7 +708,8 @@ body.theme-highcontrast .s-avatar .s-avatar--letter {
 .s-badge.s-badge__moderator,
 .s-badge.s-badge__staff,
 .s-badge.s-badge__ai,
-.s-badge.s-badge__bot {
+.s-badge.s-badge__bot,
+.s-badge.s-badge__new {
   --_ba-bl: var(--su4);
   --_ba-bg: var(--black-150);
   --_ba-fc: var(--black-600);
@@ -748,6 +749,29 @@ body.theme-highcontrast .s-avatar .s-avatar--letter {
 .s-badge.s-badge__bot {
   --_ba-bc: var(--black-400);
 }
+.s-badge.s-badge__new {
+  --_ba-bg: var(--purple-100);
+  --_ba-fc: var(--purple-500);
+  --_ba-sq-bg: var(--purple-200);
+  --_ba-bc: var(--purple-400);
+  --_ba-gap: var(--su2);
+  --_ba-before-h: calc(var(--su12) + var(--su2));
+  --_ba-before-w: calc(var(--su12) + var(--su2));
+  --_ba-before-icon: url("data:image/svg+xml;,%3Csvg width='14' height='14' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 1a7 7 0 1 1 0 14A7 7 0 0 1 8 1m0 1.25a5.75 5.75 0 1 0 0 11.5 5.75 5.75 0 0 0 0-11.5m1 10.06H7V10.6h2zM8.14 4c1.78 0 2.77.96 2.77 2.5 0 1.79-2.1 2.2-2.1 3.25h-1.6c0-2 2-2.08 2-3.26 0-.54-.27-.96-1.02-.96-.7 0-1.03.46-1.1 1.23H5.4A2.75 2.75 0 0 1 8.13 4' fill='%23fff'/%3E%3C/svg%3E");
+}
+.s-badge.s-badge__new:before {
+  height: var(--_ba-before-h);
+  margin-top: 0;
+  margin-left: var(--sun2);
+  width: var(--_ba-before-w);
+  content: "";
+  display: inline-block;
+  background-color: var(--_ba-bc);
+  -webkit-mask: var(--_ba-before-icon) no-repeat center;
+  mask: var(--_ba-before-icon) no-repeat center;
+  -webkit-mask-size: contain;
+  mask-size: contain;
+}
 .s-badge.s-badge__info {
   --_ba-bg: var(--blue-100);
   --_ba-fc: var(--blue-500);
@@ -5628,6 +5652,15 @@ body.theme-highcontrast .s-tag:not(body.theme-highcontrast .s-tag__moderator):no
 .s-tag.s-tag__watched {
   --_ta-before-icon: url("data:image/svg+xml;,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='12' viewBox='0 0 14 12'%3E%3Cpath d='M7.05 1C2.63 1 0 6.5 0 6.5S2.63 12 7.05 12C11.38 12 14 6.5 14 6.5S11.37 1 7.05 1ZM7 10.17A3.59 3.59 0 0 1 3.5 6.5 3.6 3.6 0 0 1 7 2.83c1.94 0 3.5 1.65 3.5 3.67A3.57 3.57 0 0 1 7 10.17Zm0-1.84c.97 0 1.75-.81 1.75-1.83S7.97 4.67 7 4.67s-1.75.81-1.75 1.83S6.03 8.33 7 8.33Z'/%3E%3C/svg%3E");
 }
+.s-tag a {
+  color: var(--_ta-fc) !important;
+  margin: calc(var(--_ta-pt) * -1) calc(var(--_ta-pr) * -1) calc(var(--_ta-pb) * -1) calc(var(--_ta-pl) * -1);
+  padding: var(--_ta-pt) var(--_ta-pr) var(--_ta-pb) var(--_ta-pl);
+}
+.s-tag a:focus-visible {
+  box-shadow: 0 0 0 var(--su-static2) var(--focus-neutral), 0 0 0 var(--su-static4) var(--focus-theme);
+  outline: var(--su-static2) solid transparent !important;
+}
 .s-tag:has( > .s-tag--dismiss) {
   --_ta-pr: var(--su2);
 }
@@ -6437,6 +6470,12 @@ body.theme-highcontrast .s-uploader .s-uploader--preview-thumbnail {
   --_uc-group-gap: var(--su4);
   --_uc-row-gap: var(--su6);
   --_uc-username-fs: unset;
+  --_uc-username-p: unset;
+  --_uc-username-bl: unset;
+  --_uc-username-bg: unset;
+  --_uc-username-fc: unset;
+  --_uc-username-d: unset;
+  --_uc-username-ai: unset;
   align-items: var(--_uc-ai);
   color: var(--black-500);
   display: flex;
@@ -6459,6 +6498,9 @@ body.theme-highcontrast .s-uploader .s-uploader--preview-thumbnail {
 .s-user-card.s-user-card__lg .s-user-card--group:has(> .s-user-card--rep) {
   margin-top: calc(var(--su2) * -1);
 }
+.s-user-card.s-user-card__deleted {
+  --_uc-username-fc: var(--black-400);
+}
 .s-user-card .s-user-card--bio {
   display: -webkit-box;
   -webkit-line-clamp: 3;
@@ -6473,6 +6515,10 @@ body.theme-highcontrast .s-uploader .s-uploader--preview-thumbnail {
 .s-user-card .s-user-card--recognition a {
   color: var(--theme-primary);
 }
+.s-user-card .s-user-card--recognition-additional-bling,
+.s-user-card .s-user-card--recognition-additional-bling a {
+  color: var(--theme-primary);
+}
 .s-user-card .s-user-card--rep {
   color: var(--black-600);
   font-weight: 600;
@@ -6481,12 +6527,28 @@ body.theme-highcontrast .s-uploader .s-uploader--preview-thumbnail {
   color: var(--black-400);
 }
 .s-user-card .s-user-card--username {
+  align-items: var(--_uc-username-ai);
+  background-color: var(--_uc-username-bg);
+  border-left: var(--_uc-username-bl);
+  color: var(--_uc-username-fc);
+  display: var(--_uc-username-d);
   font-size: var(--_uc-username-fs);
   font-weight: 500;
   min-width: 0;
   overflow-wrap: break-word;
+  padding: var(--_uc-username-p);
   word-break: break-all;
 }
+.s-user-card--username__op {
+  --_uc-username-p: calc(var(--su4) - var(--su1)) var(--su4) calc(var(--su4) - var(--su1)) var(--su4);
+  --_uc-username-bg: var(--blue-100);
+  --_uc-username-bl: var(--su4) solid var(--blue-300);
+  --_uc-username-d: flex;
+  --_uc-username-ai: center;
+}
+.s-user-card__sm .s-user-card--username__op {
+  --_uc-username-p: 0 var(--su4);
+}
 .s-user-card .s-user-card--column {
   align-items: flex-start;
   display: flex;