Merge branch 'develop' into dependabot/npm_and_yarn/rollup/plugin-rep…

…lace-6.0.1
StackExchange · Dec 3, 2024 · eb9be17 · eb9be17
2 parents 8158408 + 112c5df
commit eb9be17
Show file tree

Hide file tree

Showing 9,901 changed files with 4,179 additions and 2,896 deletions.
diff --git a/.eslintignore b/.eslintignore
diff --git a/.eslintrc.js b/.eslintrc.js
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
@@ -1,7 +1,5 @@
 {
     "recommendations": [
-        "dbaeumer.vscode-eslint",
-        "esbenp.prettier-vscode",
         "stylelint.vscode-stylelint"
     ]
-}
+}
diff --git a/docs/_data/badges.json b/docs/_data/badges.json
@@ -219,6 +219,22 @@
           "label": "Staff",
           "labelSm": "Staff",
           "description": "Badge indicating user is staff."
+        },
+        {
+          "title": "AI",
+          "class": "s-badge__ai",
+          "html": "s-badge s-badge__ai",
+          "label": "AI",
+          "labelSm": "AI",
+          "description": "Badge indicating content is AI generated."
+        },
+        {
+          "title": "Bot",
+          "class": "s-badge__bot",
+          "html": "s-badge s-badge__bot",
+          "label": "Bot",
+          "labelSm": "Bot",
+          "description": "Badge indicating user is a bot."
         }
       ]
     }

diff --git a/docs/_includes/annotation.html b/docs/_includes/annotation.html
@@ -0,0 +1,27 @@
+{% comment %}
+    This partial accepts the following arguments:
+    - text (required): The text to display.
+    - range: Whether to display a range line. Default: false.
+    - position: Where to place the text. Options: "top", "bottom". Default: "bottom".
+    - connectorHeight: provide a custom height for the line from the example to the text.
+    - style: Additional styles to add to the wrapper. Generally used to set position and size of the element.
+{% endcomment %}
+
+{% assign computedClasses = "" %}
+{% assign positionClasses = "mt8 fd-column" %}
+{% assign height = 12 %}
+
+{% if position == "top" %}
+  {% assign positionClasses = "mb8 fd-column-reverse" %}
+{% endif %}
+{% if range != true and position != "top" %}
+  {% assign height = "24" %}
+{% endif %}
+
+<div class="d-flex ai-center fc-light fs-caption fs-italic overflow-visible {{computedClasses}} {{positionClasses}} {{classes}}" style="{{style}}" role="presentation">
+    {% if range %}
+        <div class="ba btw0 bc-black-250 h{{connectorHeight | default: height}} w100"></div>
+    {% endif %}
+    <div class="bl bc-black-250 h{{connectorHeight | default: height}} mb2"></div>
+    <div class="ta-center w100">{{text}}</div>
+</div>
diff --git a/docs/_includes/example-row-detail.html b/docs/_includes/example-row-detail.html
diff --git a/docs/product/components/badges.html b/docs/product/components/badges.html
@@ -372,6 +372,12 @@
 <span class="s-badge s-badge__staff">Staff</span>
 <span class="s-badge s-badge__staff s-badge__sm">Staff</span>
 <span class="s-badge s-badge__staff s-badge__xs">Staff</span>
+<span class="s-badge s-badge__bot">Bot</span>
+<span class="s-badge s-badge__bot s-badge__sm">Bot</span>
+<span class="s-badge s-badge__bot s-badge__xs">Bot</span>
+<span class="s-badge s-badge__ai">AI</span>
+<span class="s-badge s-badge__ai s-badge__sm">AI</span>
+<span class="s-badge s-badge__ai s-badge__xs">AI</span>
 {% endhighlight %}
         <div class="stacks-preview--example">
             <div class="overflow-x-auto" tabindex="0">

diff --git a/docs/product/components/popovers.html b/docs/product/components/popovers.html
@@ -580,39 +580,42 @@ <h1 class="s-page-title--header" role="presentation">Lorem ipsum</h1>
 
     <div class="stacks-preview">
 {% highlight html %}
-<button class="s-btn" role="button"
-        aria-describedby="tooltip-example"
-        aria-expanded="false"
-        data-controller="s-tooltip"
-        data-s-tooltip-placement="top-start">
+<button
+    class="s-btn"
+    role="button"
+    aria-describedby="tooltip-example"
+    aria-expanded="false"
+    data-controller="s-tooltip">
     …
 </button>
-<div class="s-popover s-popover__tooltip"
-     id="tooltip-example"
-     role="tooltip"
-     aria-hidden="true">
+<div
+    class="s-popover s-popover__tooltip"
+    id="tooltip-example"
+    role="tooltip">
     <div class="s-popover--arrow"></div>
     <div class="s-popover--content">
         …
     </div>
 </div>
 {% endhighlight %}
         <div class="stacks-preview--example bg-black-100">
-            <button class="s-btn s-btn__filled" role="button"
-                    aria-describedby="tooltip-example"
-                    data-controller="s-tooltip"
-                    data-s-tooltip-placement="top-start">
+            <button
+                class="s-btn s-btn__filled"
+                role="button"
+                aria-describedby="tooltip-example"
+                aria-expanded="false"
+                data-controller="s-tooltip">
                 Hover tooltip popover
             </button>
-            <div class="s-popover s-popover__tooltip"
+            <div
+                class="s-popover s-popover__tooltip"
                 id="tooltip-example"
-                role="tooltip"
-                aria-hidden="true">
+                role="tooltip">
                 <div class="s-popover--arrow"></div>
                 <div class="s-popover--content">
                     <div class="s-empty-state wmx2">
                         {% spot "EmptyLg", "mb12" %}
-                        <p class="mb0">There’s no data associated with your account yet. Please check back tomorrow.</p>
+                        <p class="mb0">There’s no data associated with your account yet. Please visit our <a href="#" class="s-link">help page</a> for more information.</p>
                     </div>
                 </div>
             </div>

diff --git a/docs/product/components/sidebar-widgets.html b/docs/product/components/sidebar-widgets.html
@@ -492,10 +492,10 @@ <h2 class="s-sidebarwidget--header" role="presentation">
 {% highlight html %}
 <div class="s-sidebarwidget">
     <h2 class="s-sidebarwidget--header">
+        Watched Tags
         <a class="s-sidebarwidget--action" href="…">
             Edit
         </a>
-        Watched Tags
     </h2>
     <div class="s-sidebarwidget--content">
         <div class="d-flex g4">
@@ -510,10 +510,10 @@ <h2 class="s-sidebarwidget--header">
             <div class="d-flex g16 ai-start md:fd-column">
                 <div class="flex--item s-sidebarwidget">
                     <h2 class="s-sidebarwidget--header" role="presentation">
+                        Watched tags
                         <a class="s-sidebarwidget--action" href="#">
                             Edit
                         </a>
-                        Watched tags
                     </h2>
                     <div class="s-sidebarwidget--content">
                         <div class="d-flex g4">
@@ -523,10 +523,10 @@ <h2 class="s-sidebarwidget--header" role="presentation">
                         </div>
                     </div>
                     <h2 class="s-sidebarwidget--header" role="presentation">
+                        Ignored tags
                         <a class="s-sidebarwidget--action" href="#">
                             Edit
                         </a>
-                        Ignored tags
                     </h2>
                     <div class="s-sidebarwidget--content">
                         <div class="d-flex g4">
@@ -539,10 +539,10 @@ <h2 class="s-sidebarwidget--header" role="presentation">
 
                 <div class="flex--item s-sidebarwidget">
                     <h2 class="s-sidebarwidget--header s-sidebarwidget__small-bold-text" role="presentation">
+                        2 Recent searches
                         <a class="s-sidebarwidget--action" href="#">
                             Clear
                         </a>
-                        2 Recent searches
                     </h2>
                     <table class="s-sidebarwidget--content s-sidebarwidget__items">
                         <tbody>
@@ -584,10 +584,10 @@ <h2 class="s-sidebarwidget--header s-sidebarwidget__small-bold-text" role="prese
                 aria-label="toggle recent searches"
                 data-controller="s-expandable-control"
                 tabindex="0">
+        2 Recent Searches
         <a class="s-sidebarwidget--action" href="…">
             Clear
         </a>
-        2 Recent Searches
     </h2>
     <div class="s-expandable" id="recent-searches">
         <div class="s-expandable--content">
@@ -619,10 +619,10 @@ <h2 class="s-sidebarwidget--header s-sidebarwidget__small-bold-text" role="prese
                             data-controller="s-expandable-control"
                             tabindex="0"
                             role="presentation">
+                    2 Recent searches
                     <a class="s-sidebarwidget--action" href="#">
                         Clear
                     </a>
-                    2 Recent searches
                 </h2>
                 <div class="s-expandable" id="recent-searches">
                     <div class="s-expandable--content">

diff --git a/docs/product/foundation/accessibility.html b/docs/product/foundation/accessibility.html
@@ -106,10 +106,10 @@
                     role="presentation">
                     {% icon "Pencil" %} Button
                 </button>
-                {% render 'example-row-detail.html',
+                {% render 'annotation.html',
                     text: group.description,
-                    style: "margin-left: 50%;",
-                    customHeight: 16
+                    classes: "mx-auto",
+                    connectorHeight: 16
                 %}
             </div>
         {% endfor %}
@@ -133,10 +133,10 @@
                     {% icon "Pencil" %}
                     Button
                 </button>
-                {% render 'example-row-detail.html',
+                {% render 'annotation.html',
                     text: group.description,
-                    style: "margin-left: 50%;",
-                    customHeight: 16
+                    classes: "mx-auto",
+                    connectorHeight: 16
                 %}
             </div>
         {% endfor %}
@@ -158,10 +158,10 @@
                     <input class="s-toggle-switch {{group.classes | default: ""}}" type="checkbox" role="presentation">
                 {% endif %}
 
-                {% render 'example-row-detail.html',
+                {% render 'annotation.html',
                     text: group.description,
-                    style: "margin-left: 50%;",
-                    customHeight: 16
+                    classes: "mx-auto",
+                    connectorHeight: 16
                 %}
             </div>
         {% endfor %}
@@ -197,10 +197,10 @@
                     </div>
                 {% endif %}
 
-                {% render 'example-row-detail.html',
+                {% render 'annotation.html',
                     text: group.description,
-                    style: "margin-left: 50%;",
-                    customHeight: 16
+                    classes: "mx-auto",
+                    connectorHeight: 16
                 %}
             </div>
         {% endfor %}
@@ -232,10 +232,10 @@
                     </div>
                 {% endif %}
 
-                {% render 'example-row-detail.html',
+                {% render 'annotation.html',
                     text: group.description,
-                    style: "margin-left: 50%;",
-                    customHeight: 16
+                    classes: "mx-auto",
+                    connectorHeight: 16
                 %}
             </div>
         {% endfor %}
@@ -284,10 +284,10 @@
                     </div>
                 {% endif %}
 
-                {% render 'example-row-detail.html',
+                {% render 'annotation.html',
                     text: group.description,
-                    style: "margin-left: 50%;",
-                    customHeight: 16
+                    classes: "mx-auto",
+                    connectorHeight: 16
                 %}
             </div>
         {% endfor %}
@@ -306,10 +306,10 @@
                     </button>
                 {% endif %}
 
-                {% render 'example-row-detail.html',
+                {% render 'annotation.html',
                     text: group.description,
-                    style: "margin-left: 50%;",
-                    customHeight: 16
+                    classes: "mx-auto",
+                    connectorHeight: 16
                 %}
             </div>
         {% endfor %}