@stackoverflow/stacks 1.6.0 → 1.6.2

package/lib/css/components/badges.less

@@ -195,6 +195,7 @@
     }
 
     // CHILD ELEMENTS
+    &--image, // Included with no base class to account for usage in .s-progress__badge
     & &--image {
         display: inline-flex;
         align-self: center;

package/lib/css/components/buttons.less

@@ -387,8 +387,17 @@
     & &--number {
         color: var(--_bu-number-fc);
     }
-    &--radio { // This lives alongside a .s-btn element
-        .v-visible-sr;
+    &--radio { // This lives alongside a .s-btn element. These styles are the equivelent of `.v-visible-sr`
+        border: 0;
+        clip-path: inset(50%);
+        clip: rect(1px, 1px, 1px, 1px);
+        height: 1px;
+        margin: -1px;
+        overflow-wrap: normal;
+        overflow: hidden;
+        padding: 0;
+        position: absolute;
+        width: 1px;
     }
 
     // INTERACTION

package/lib/css/components/notices.less

@@ -152,6 +152,10 @@
         background: var(--_no-code-bg, transparent);
     }
     & &--btn {
+        // TODO: decouple .s-notice--btn from .s-btn
+        &:not(:focus) {
+            box-shadow: none; // This will prevent default .s-btn box-shadow from showing
+        }
         &:focus,
         &:hover {
             background: var(--_no-btn-bg-focus);

package/lib/css/components/prose.less

@@ -24,6 +24,9 @@
     --_pr-spacing: 1.1em;
     --_pr-spacing-condensed: calc(var(--_pr-spacing) / 2); // Reduce the base spacing by half in the context of lists, etc.
     --_pr-spoiler-transition: opacity 0.1s ease-in-out;
+    // TEMP HOT FIX FOR .s-editor [1]
+    --s-prose-spacing: var(--_pr-spacing); // TODO remove once addressed in StackExchange/Stacks-Editor
+    --s-prose-spacing-condensed: var(--_pr-spacing-condensed); // TODO remove once addressed in StackExchange/Stacks-Editor
 
     // CONDITIONAL STYLES
     .dark-mode({
@@ -164,6 +167,7 @@
         quotes: none;
     }
     dd,
+    div,
     dl,
     .s-table-container,
     .s-link-preview {
@@ -371,7 +375,7 @@
         color: var(--black-800);
         min-height: var(--su-static48); // TODO: Let's find a solution that doesn't have a magic number
     }
-    .youtube-embed { // [1]
+    .youtube-embed { // [2]
         > div {
             iframe {
                 height: 100%;
@@ -395,7 +399,10 @@
     overflow-wrap: break-word;
 }
 
-// [1] The outer div enforces a max-width of 640px. The inner div has a height of 35 pixels, and a
+// [1]  StackExchange/Stacks-Editor references `--s-prose-spacing` and `--s-prose-spacing-condensed`.
+// Going forward, it shouldn't but for now, I've introduced a hotfix to define those custom properties.
+
+// [2] The outer div enforces a max-width of 640px. The inner div has a height of 35 pixels, and a
 // padding-bottom of 56.25%. Padding percentages, even for top/bottom, are always relative
 // to the *width*, so the padding always has an aspect ratio of 1/0.5625, or 16/9. Thus in total,
 // the iframe has a height of 35 + width * 9/16. 35 pixels is the height of youtube's player controls,

package/package.json

@@ -5,7 +5,7 @@
     "type": "git",
     "url": "https://github.com/StackExchange/Stacks.git"
   },
-  "version": "1.6.0",
+  "version": "1.6.2",
   "files": [
     "dist",
     "lib"