@anyblades/blades 3.1.0-beta.2 → 3.1.0-beta.5

package/src/blades/components/_modal-modern.css

@@ -0,0 +1,26 @@
+/*<!--section:docs-->
+
+A `<dialog>` opened with `dialog.showModal()` fades in and its `<article>` zooms in, without JS classes.
+Pico's modal JS (`.modal-is-open`, `.modal-is-opening`, `.modal-is-closing`) still works on top of it.
+
+- `dialog.close()` closes it at once, as before.
+- `<dialog open>` in markup and non-modal `dialog.show()` aren't animated.
+- Browsers without `@starting-style`, and reduced motion, open it at once.
+
+<!--section:code-->```css */
+dialog:modal {
+  transition: opacity var(--pico-transition);
+
+  > article {
+    transition: transform var(--pico-transition);
+  }
+}
+@starting-style {
+  dialog:modal {
+    opacity: 0;
+
+    > article {
+      transform: scale(0.96);
+    }
+  }
+}

package/src/blades.css

@@ -5,4 +5,3 @@
  */
 @import "./pico/_index";
 @import "./blades/_index";
-@import "./_compact";

package/src/float-label.css

@@ -1 +1 @@
-@import "./blades/float-label/_index";
+@import "./blades/forms/float-label/_index";

package/src/ninja/LICENSE

@@ -0,0 +1,22 @@
+The MIT License (MIT)
+
+Copyright (c) 2015 Anton Staroverov
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+

package/src/ninja/README.md

@@ -0,0 +1 @@
+# Ninja CSS add-ons for Blades CSS

package/src/ninja/_index.css

@@ -6,7 +6,7 @@
 
 /* Layout */
 @import "./_container-breakout";
-@import "./_page-anchors";
+@import "./_scroll-to";
 
 /* Content */
 @import "./_heading-anchor";

package/src/pico/components/_loading.css

@@ -10,7 +10,11 @@
   --pico-loading-spinner-opacity: 0.5;
 }
 
-[aria-busy="true"]:not(input, select, textarea, html, form) {
+[aria-busy="true"]:not(input, select, textarea, html, form):not(
+    :where(button, [type="submit"], [type="button"], [type="reset"], [role="button"])
+  ) {
+  /* :where() zeroes the specificity of the button list inside :not(), so this rule stays
+   * low-specificity and doesn't override the more specific button rules below */
   white-space: nowrap;
 }
 [aria-busy="true"]:not(input, select, textarea, html, form)::before {
@@ -38,3 +42,25 @@ button[aria-busy="true"],
 a[aria-busy="true"] {
   pointer-events: none;
 }
+
+/* Buttons keep their size: the label stays in place but hidden, the spinner sits on top */
+button,
+[type="submit"],
+[type="button"],
+[type="reset"],
+[role="button"] {
+  &[aria-busy="true"]:not(:empty) {
+    position: relative;
+    color: transparent;
+
+    > * {
+      opacity: 0;
+    }
+
+    &::before {
+      position: absolute;
+      inset: 0;
+      margin: auto;
+    }
+  }
+}

package/_includes/blades/links.liquid

@@ -1,21 +0,0 @@
-{% comment %}<!--section:code-->```liquid{% endcomment %}
-<ul>
-  {%- for link in links %}
-    <li>
-      {% # prettier-ignore %}
-      <a href="{{ link.url }}" {% if link.url == current_url %}aria-current="page"{% endif %}>
-        {{- link.title -}}
-      </a>
-    </li>
-  {%- endfor %}
-</ul>
-{% # prettier-ignore %}
-{% comment %}```
-<!--section:docs-->
-Usage example for https://www.11ty.dev/docs/plugins/navigation/#bring-your-own-html-render-the-menu-items-manually:
-
-```liquid
-{% assign links = collections.all | eleventyNavigation %}
-{% render blades/links, links: links, current_url: page.url %}
-```
-<!--section-->{% endcomment %}

package/_includes/blades/links.njk

@@ -1,9 +0,0 @@
-<ul>
-  {%- for link in links %}
-    <li>
-      <a href="{{ link.url }}" {% if link.url == current_url %}aria-current="page"{% endif %}>
-        {{- link.title | safe -}}
-      </a>
-    </li>
-  {%- endfor %}
-</ul>

package/_includes/blades/links.twig

@@ -1,18 +0,0 @@
-{# <!--section:code-->```twig #}
-<ul>
-  {%- for link in links %}
-    <li>
-      <a href="{{ link.url }}" {% if link.url == current_url %}aria-current="page"{% endif %}>
-        {{- link.title -}}
-      </a>
-    </li>
-  {%- endfor %}
-</ul>
-{#```
-<!--section:docs-->
-Pass the links and the current URL explicitly so nothing else leaks into scope:
-
-```twig
-{% include 'blades/links.twig' with { links: menu, current_url: app.request.pathInfo } only %}
-```
-<!--section--> #}