@anyblades/blades 2.3.0 → 2.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (15) hide show
  1. package/README.md +21 -17
  2. package/_includes/blades/html.twig +52 -0
  3. package/_includes/blades/links.twig +18 -0
  4. package/_includes/blades/sitemap.xml.twig +23 -0
  5. package/blades.gemspec +1 -1
  6. package/css/blades.css +3038 -501
  7. package/css/blades.standalone.core.css +28 -28
  8. package/css/blades.standalone.css +37 -37
  9. package/css/blades.standalone.theme.css +9 -9
  10. package/css/breakout.css +9 -9
  11. package/css/float-label.core.css +2 -2
  12. package/css/float-label.css +2 -2
  13. package/css/link-icon.css +4 -4
  14. package/css/responsive-table.css +6 -6
  15. package/package.json +3 -2
package/README.md CHANGED
@@ -18,7 +18,7 @@ Includes [Float labels](//blades.ninja/css/float-label/), [Breakout layout](//bl
18
18
 
19
19
  There are 4 ways to get started:
20
20
 
21
- ### Install manually
21
+ ### <mark>A.</mark> Install manually
22
22
 
23
23
  [Download *Bl*ades](https://github.com/anyblades/blades/archive/refs/heads/main.zip) and link `css/blades.css` in the `<head>` of your website.
24
24
 
@@ -26,7 +26,7 @@ There are 4 ways to get started:
26
26
  <link rel="stylesheet" href="css/blades.css" />
27
27
  ```
28
28
 
29
- ### Usage from CDN
29
+ ### <mark>B.</mark> Usage from CDN
30
30
 
31
31
  Alternatively, you can use [jsDelivr CDN](https://cdn.jsdelivr.net/npm/@anyblades/blades@2/):
32
32
 
@@ -37,7 +37,7 @@ Alternatively, you can use [jsDelivr CDN](https://cdn.jsdelivr.net/npm/@anyblade
37
37
  "/>
38
38
  ```
39
39
 
40
- ### Install with NPM
40
+ ### <mark>C.</mark> Install with NPM
41
41
 
42
42
  ```sh
43
43
  npm install @anyblades/pico # or other CSS framework
@@ -51,7 +51,18 @@ Then, import [Pico] and *Bl*ades into your CSS:
51
51
  @import "@anyblades/blades";
52
52
  ```
53
53
 
54
- A live example using <i class="fa-brands fa-tailwind-css"></i> Tailwind: https://github.com/anyblades/buildawesome-starters/blob/main/site-tailwind/styles.css
54
+ Live example using <i class="fa-brands fa-tailwind-css"></i> Tailwind: https://github.com/anyblades/buildawesome-starters/blob/main/site-tailwind/styles.css
55
+
56
+ ### <mark>D.</mark> Starter projects
57
+
58
+ - https://subtle.blades.ninja/ 11ty micro-starter
59
+ - https://github.com/anyblades/buildawesome-starters 11ty Tailwind CLI starter(s)
60
+ - https://github.com/getgrav/grav-theme-quark2 for Grav CMS v2
61
+ - https://jekyll.blades.ninja/ starter <!--{.faded}-->
62
+
63
+ ### Standalone version
64
+
65
+ https://blades.ninja/css/standalone/
55
66
 
56
67
  ### Starter HTML template <!-- from index.html -->
57
68
 
@@ -73,13 +84,6 @@ A live example using <i class="fa-brands fa-tailwind-css"></i> Tailwind: https:/
73
84
  </html>
74
85
  ```
75
86
 
76
- ### More ways to get started
77
-
78
- - https://blades.ninja/css/standalone/ version
79
- - https://subtle.blades.ninja/ 11ty micro-starter
80
- - https://tw.11ty.blades.ninja/ Tailwind CLI starter
81
- - https://jekyll.blades.ninja/ starter <!--{.faded}-->
82
-
83
87
  <!--section:gh-only-->
84
88
 
85
89
  ## Documentation
@@ -162,17 +166,17 @@ A live example using <i class="fa-brands fa-tailwind-css"></i> Tailwind: https:/
162
166
 
163
167
  <!--section:info-->
164
168
 
165
- ## <sup>Featured by</sup><!--awesome,sites,social/Z-A-->
169
+ ## <sup>Featured by</sup><!--projects,awesome,sites,social/Z-A-->
166
170
 
171
+ - https://github.com/getgrav/grav-theme-quark2 🚀
172
+ - [minform](https://github.com/johnheenan/minform#css-and-performance)
167
173
  - https://github.com/uhub/awesome-css
168
- - [classless-css](https://github.com/dbohdan/classless-css#components:~:text=float%20label) [#float-label](//blades.ninja/css/float-label/)<!--{.faded}-->
169
- - [awesome-css-frameworks-and-ui-libraries](https://github.com/gabrielizalo/awesome-css-frameworks-and-ui-libraries/tree/master/Lightweight)
170
- - [awesome-11ty-build-awesome](https://github.com/anyblades/awesome-11ty-build-awesome)
174
+ - [awesome-css-frameworks](https://github.com/gabrielizalo/awesome-css-frameworks-and-ui-libraries/tree/master/Lightweight)
175
+ - [awesome-11ty](https://github.com/anyblades/awesome-11ty-buildawesome)
171
176
  - https://dummy.my/frameworks/
172
177
  - [sveltiacms.app](https://sveltiacms.app/en/docs/start#starter-templates)
173
- - [https://trendshift.io/](https://trendshift.io/repositories/29875) [#pico-fork](//blades.ninja/css/pico/)<!--{.faded}-->
174
178
  - [@pauleveritt](https://fosstodon.org/@pauleveritt/116387278969347700)
175
- - [@githubsignals](https://www.youtube.com/shorts/FxtvnBCse8w)
179
+ - [@githubsignals](https://www.youtube.com/shorts/FxtvnBCse8w) + [ ](https://www.instagram.com/reel/DXOSTpajG4f/)<!--{.faded}-->
176
180
 
177
181
  <!--{.markerless .columns}-->
178
182
 
package/_includes/blades/html.twig ADDED
@@ -0,0 +1,52 @@
1
+ {# <!--section:code-->```twig #}
2
+ <!doctype html>
3
+ <html lang="{{ site.lang|default('en') }}">
4
+ <head>
5
+ <meta charset="utf-8" />
6
+ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, viewport-fit=cover" />
7
+ <link rel="icon" href="{{ site.favicon|default('/favicon.svg') }}" />
8
+ {% if site.favicon_alt %}
9
+ <link rel="alternate icon" href="{{ site.favicon_alt }}" type="image/png" />
10
+ {% endif %}
11
+ <title>
12
+ {{- title ? title|striptags ~ ' | ' -}}
13
+ {{- site.title -}}
14
+ </title>
15
+ <meta name="description" content="{{ description|striptags }}" />
16
+
17
+ {%- for href in site.styles %}
18
+ <link rel="stylesheet" href="{{ href }}" />
19
+ {%- endfor %}
20
+ <style>
21
+ {{ site.inline_styles|default([])|join('\n')|raw }}
22
+ </style>
23
+
24
+ {%- for src in site.scripts %}
25
+ <script src="{{ src }}" defer></script>
26
+ {%- endfor %}
27
+ <script type="module">
28
+ {{ site.inline_scripts|default([])|join('\n')|raw }}
29
+ </script>
30
+
31
+ {{ content_for_header|default('')|raw }}
32
+ </head>
33
+
34
+ <body>
35
+ {% block body %}
36
+ {% endblock %}
37
+ </body>
38
+ </html>
39
+ {#```
40
+ - `title ? …` renders the prefix only when a title is set, mirroring the Nunjucks `if title` guard.
41
+
42
+ <!--section:docs-->
43
+ Usage in Twig layout:
44
+
45
+ ```twig
46
+ {% extends 'blades/html.twig' %}
47
+
48
+ {% block body %}...{% endblock %}
49
+ ```
50
+
51
+ Pass `site`, `title` and `description` via the render context.
52
+ <!--section--> #}
package/_includes/blades/links.twig ADDED
@@ -0,0 +1,18 @@
1
+ {# <!--section:code-->```twig #}
2
+ <ul>
3
+ {%- for link in links %}
4
+ <li>
5
+ <a href="{{ link.url }}" {% if link.url == current_url %}aria-current="page"{% endif %}>
6
+ {{- link.title -}}
7
+ </a>
8
+ </li>
9
+ {%- endfor %}
10
+ </ul>
11
+ {#```
12
+ <!--section:docs-->
13
+ Pass the links and the current URL explicitly so nothing else leaks into scope:
14
+
15
+ ```twig
16
+ {% include 'blades/links.twig' with { links: menu, current_url: app.request.pathInfo } only %}
17
+ ```
18
+ <!--section--> #}
package/_includes/blades/sitemap.xml.twig ADDED
@@ -0,0 +1,23 @@
1
+ {#- Based on https://github.com/11ty/eleventy-base-blog/blob/main/content/sitemap.xml.njk
2
+ <!--section:code-->```twig -#}
3
+ <?xml version="1.0" encoding="utf-8"?>
4
+ <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml">
5
+ {%- for page in collections.all %}
6
+ {% if page.data.permalink != false %}
7
+ <url>
8
+ <loc>{{ site.base }}{{ page.url }}</loc>
9
+ <lastmod>{{ page.date|date('c') }}</lastmod>
10
+ </url>
11
+ {% endif %}
12
+ {%- endfor %}
13
+ </urlset>
14
+ {#```
15
+ <!--section:docs-->
16
+ Render from a standalone route/template that outputs `application/xml`:
17
+
18
+ ```twig
19
+ {% include 'blades/sitemap.xml.twig' %}
20
+ ```
21
+
22
+ `date('c')` emits an ISO-8601 `lastmod`, which is what the sitemap spec expects.
23
+ <!--section--> #}
package/blades.gemspec CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Gem::Specification.new do |spec|
4
4
  spec.name = "blades"
5
- spec.version = "2.3.0"
5
+ spec.version = "2.3.1"
6
6
  spec.authors = ["Anton Staroverov"]
7
7
 
8
8
  spec.summary = "Fully compatible and actively maintained successor to Pico CSS."