aerolith 1.2.0 → 1.3.0

package/LICENSE

@@ -21,9 +21,9 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
 
 The rendered sprite images in library/dist/ are covered by the same license.
-The fonts in library/dist/fonts/ are not: they are under the SIL Open Font
-License 1.1 (Istok Web, Aerolith Text, which is derived from Selawik, and
+The fonts in library/dist/fonts/ and fonts/ are not: they are under the SIL
+Open Font License 1.1 (Aerolith Text, which is derived from Selawik, and
 Aerolith Display, which is derived from Istok Web). Their license files are in
-that folder.
+those folders.
 Bryce is a trademark of its respective owner. This project is not affiliated
 with or endorsed by it, and contains no part of the Bryce software.

package/README.md

@@ -39,7 +39,7 @@ example of every component. Self-hosting: keep `sprites/` and `fonts/` next to `
 | GitHub Packages | `npm i @immineal/aerolith --registry=https://npm.pkg.github.com` | same |
 | Composer | `composer require immineal/aerolith` | serve `vendor/immineal/aerolith/library/dist/` |
 | PyPI | `pip install aerolith` | `aerolith.static_dir()`; Django: add `"aerolith"` to `INSTALLED_APPS` |
-| CDN | jsDelivr, unpkg, esm.sh | or `cdn.jsdelivr.net/gh/immineal/aerolith@v1.2.0/library/dist/aerolith.css` |
+| CDN | jsDelivr, unpkg, esm.sh | or `cdn.jsdelivr.net/gh/immineal/aerolith@v1.3.0/library/dist/aerolith.css` |
 
 React, Vue, Svelte, Astro: import the CSS once in your entry file and use the classes
 (`className` in JSX). Content added after load needs `window.Aerolith.init(container)`.
@@ -49,7 +49,7 @@ React, Vue, Svelte, Astro: import the CSS once in your entry file and use the cl
 | Class | On | States |
 |---|---|---|
 | `.aer-button` (+ `.aer-secondary`, `.aer-quiet`; `.aer-s`, `.aer-l`) | `<button>`, `<a>` | hover, pressed, `aria-pressed`, disabled |
-| `.aer-iconbtn` (+ `.aer-quiet`) | `<button>` with an `.aer-icon` | hover, pressed |
+| `.aer-iconbtn` (+ `.aer-quiet`) | `<button>` with an `.aer-icon` | hover, pressed, `aria-pressed` (`data-aer-toggle` flips it on click; a heart turns to its outline when off) |
 | `.aer-icon .aer-icon-<name>` (+ `.aer-s`, `.aer-pearl`) | `<span aria-hidden="true">` | 35 glyphs, 24/16 px |
 | `.aer-toggle` (+ `.aer-theme`) | `<input type="checkbox" role="switch">` | on, disabled |
 | `.aer-check`, `.aer-radio` | checkbox, radio | checked, mixed, disabled |
@@ -81,10 +81,13 @@ React, Vue, Svelte, Astro: import the CSS once in your entry file and use the cl
 
 Aerolith Display is a colour font of rendered gel letters, so titles stay real, selectable text.
 Use it from 32 px up. Each material is about 0.6 MB, loaded only where used. Browsers without
-colour fonts show heavy Istok.
+colour fonts show plain heavy letters.
 
 Body text is **Aerolith Text**, Selawik (an open Segoe UI stand-in) with a kern table, because Selawik
-ships without kerning. `data-aer-type="istok"` switches to **Istok Web**. Dark mode follows the system; `data-theme="dark"` or `"light"` on `<html>` forces it,
+ships without kerning. Both fonts are also in [`fonts/`](fonts/) as TTF files for your computer
+([download](https://github.com/immineal/aerolith/releases/latest/download/aerolith-fonts.zip)).
+
+Dark mode follows the system; `data-theme="dark"` or `"light"` on `<html>` forces it,
 and the sun/moon switch (`input[data-aer-theme]`) sets that for you.
 
 ## Accessibility
@@ -138,8 +141,7 @@ Setup: [harness/README.md](harness/README.md). Design rules:
 
 ## License
 
-MIT for code and sprites ([LICENSE](LICENSE)). Fonts in `library/dist/fonts/` are SIL OFL 1.1:
-Istok Web (Andrey V. Panov) unmodified; Aerolith Text, derived from Selawik (Microsoft) with a kern
-table added and renamed because the OFL reserves "Selawik"; Aerolith Display, derived from
-Istok Web Bold. Bryce is a trademark of its owner; Aerolith is not affiliated and contains no
+MIT for code and sprites ([LICENSE](LICENSE)). The fonts in `library/dist/fonts/` and `fonts/` are
+SIL OFL 1.1: Aerolith Text, derived from Selawik (Microsoft) with a kern table added and renamed
+because the OFL reserves "Selawik"; Aerolith Display, derived from Istok Web Bold (Andrey V. Panov). Bryce is a trademark of its owner; Aerolith is not affiliated and contains no
 Bryce code.

package/library/dist/aerolith.css

@@ -21,7 +21,7 @@
   --aer-target-gap: var(--aer-space-2);
 
   /* type: modular scale 1.2 */
-  --aer-font-ui: "Aerolith Text", "Selawik", "Segoe UI", "Istok Web", "Myriad Pro", Tahoma, system-ui, sans-serif;  /* bundled: type.css */
+  --aer-font-ui: "Aerolith Text", "Selawik", "Segoe UI", "Myriad Pro", Tahoma, system-ui, sans-serif;  /* bundled: type.css */
   --aer-font-text: var(--aer-font-ui);
   --aer-font-mono: "Consolas", "Lucida Console", ui-monospace, monospace;
   --aer-text-xs: 0.833rem;
@@ -107,21 +107,11 @@
 
 /* ---- type.css ---- */
 /* Aerolith type.
-   Text: Aerolith Text (default; Selawik with a kern table, renamed because the OFL reserves "Selawik")
-   or Istok Web (data-aer-type="istok"), both bundled, both SIL OFL 1.1.
+   Text: Aerolith Text, Selawik with a kern table (renamed because the OFL reserves "Selawik"), SIL OFL 1.1.
    Titles: Aerolith Display, gel letters rendered in Bryce and packed into colour fonts. Each
    material comes as OpenType-SVG (Firefox, Safari) and sbix (Chromium); tech() makes a browser
    download only the file it can draw. The fonts keep outlines, so a browser without colour-font
-   support still shows the title, in plain heavy Istok. */
-
-@font-face { font-family: "Istok Web"; src: url(fonts/istok-web-regular.woff2) format("woff2");
-  font-weight: 400; font-style: normal; font-display: swap; }
-@font-face { font-family: "Istok Web"; src: url(fonts/istok-web-italic.woff2) format("woff2");
-  font-weight: 400; font-style: italic; font-display: swap; }
-@font-face { font-family: "Istok Web"; src: url(fonts/istok-web-bold.woff2) format("woff2");
-  font-weight: 700; font-style: normal; font-display: swap; }
-@font-face { font-family: "Istok Web"; src: url(fonts/istok-web-bold-italic.woff2) format("woff2");
-  font-weight: 700; font-style: italic; font-display: swap; }
+   support still shows the title as plain heavy letters. */
 
 @font-face { font-family: "Aerolith Text"; src: url(fonts/aerolith-text-light.woff2) format("woff2");
   font-weight: 300; font-display: swap; }
@@ -145,10 +135,6 @@
   src: url(fonts/aerolith-display-pearl.svg.woff2) format("woff2") tech(color-SVG),
        url(fonts/aerolith-display-pearl.bmp.woff2) format("woff2") tech(color-sbix); }
 
-[data-aer-type="istok"], .aer-type-istok {
-  --aer-font-ui: "Istok Web", "Aerolith Text", "Segoe UI", Tahoma, system-ui, sans-serif;
-}
-
 /* Big titles only: the letters are rendered at about 80 px per em and read best from 32 px up.
    Weight 700 picks the bold text face while the font loads; the colour face itself has one weight and is
    never synthesised. */
@@ -1607,6 +1593,8 @@ a.aer-card:hover, button.aer-card:hover, .aer-card[data-interactive]:hover {
   --_n: var(--aer-iconbtn-glass-active); --_o: var(--aer-iconbtn-glass-active-outset);
 }
 .aer-iconbtn:disabled { opacity: 0.5; filter: saturate(0.2); cursor: not-allowed; }
+/* A toggle that is not pressed shows the heart as an outline. */
+[aria-pressed="false"] > .aer-icon-heart { --_i: 1; }
 
 /* ------------------------------------------------------------------ segmented control / tab bar
    <div class="aer-segmented" role="radiogroup" aria-label="View">

package/library/dist/aerolith.js

@@ -7,6 +7,7 @@
 //     data-aer-drag makes it movable
 //   - menus: popovers drop down from their button; [data-aer-menu] opens one at the pointer
 //   - segmented: the selected chip slides between items
+//   - toggle: [data-aer-toggle] flips aria-pressed on click (a heart icon inside turns to outline)
 //   - preload: sprites of closed dialogs and popovers load with the page
 (function () {
   "use strict";
@@ -376,6 +377,13 @@
         applyTheme(t);
       });
     });
+    root.querySelectorAll("[data-aer-toggle]").forEach(function (b) {
+      if (!once(b, "aerToggle")) return;
+      if (!b.hasAttribute("aria-pressed")) b.setAttribute("aria-pressed", "false");
+      b.addEventListener("click", function () {
+        b.setAttribute("aria-pressed", b.getAttribute("aria-pressed") === "true" ? "false" : "true");
+      });
+    });
     root.querySelectorAll(".aer-lens").forEach(function (el) { if (once(el, "aerBound")) lens(el); });
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aerolith",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "Tactile UI for the web, rendered in Bryce 2 and laid over plain HTML.",
   "keywords": [
     "tactile", "css", "ui", "ui-library", "design-system", "skeuomorphism", "glassmorphism",

package/library/dist/fonts/OFL-Istok-Web.txt

@@ -1,94 +0,0 @@
-Copyright (c) 2008-2012, 2014, Andrey V. Panov (panov@canopus.iacp.dvo.ru),
-with Reserved Font Name Istok.
-
-This Font Software is licensed under the SIL Open Font License, Version 1.1.
-This license is copied below, and is also available with a FAQ at:
-http://scripts.sil.org/OFL
-
-
------------------------------------------------------------
-SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
------------------------------------------------------------
-
-PREAMBLE
-The goals of the Open Font License (OFL) are to stimulate worldwide
-development of collaborative font projects, to support the font creation
-efforts of academic and linguistic communities, and to provide a free and
-open framework in which fonts may be shared and improved in partnership
-with others.
-
-The OFL allows the licensed fonts to be used, studied, modified and
-redistributed freely as long as they are not sold by themselves. The
-fonts, including any derivative works, can be bundled, embedded, 
-redistributed and/or sold with any software provided that any reserved
-names are not used by derivative works. The fonts and derivatives,
-however, cannot be released under any other type of license. The
-requirement for fonts to remain under this license does not apply
-to any document created using the fonts or their derivatives.
-
-DEFINITIONS
-"Font Software" refers to the set of files released by the Copyright
-Holder(s) under this license and clearly marked as such. This may
-include source files, build scripts and documentation.
-
-"Reserved Font Name" refers to any names specified as such after the
-copyright statement(s).
-
-"Original Version" refers to the collection of Font Software components as
-distributed by the Copyright Holder(s).
-
-"Modified Version" refers to any derivative made by adding to, deleting,
-or substituting -- in part or in whole -- any of the components of the
-Original Version, by changing formats or by porting the Font Software to a
-new environment.
-
-"Author" refers to any designer, engineer, programmer, technical
-writer or other person who contributed to the Font Software.
-
-PERMISSION & CONDITIONS
-Permission is hereby granted, free of charge, to any person obtaining
-a copy of the Font Software, to use, study, copy, merge, embed, modify,
-redistribute, and sell modified and unmodified copies of the Font
-Software, subject to the following conditions:
-
-1) Neither the Font Software nor any of its individual components,
-in Original or Modified Versions, may be sold by itself.
-
-2) Original or Modified Versions of the Font Software may be bundled,
-redistributed and/or sold with any software, provided that each copy
-contains the above copyright notice and this license. These can be
-included either as stand-alone text files, human-readable headers or
-in the appropriate machine-readable metadata fields within text or
-binary files as long as those fields can be easily viewed by the user.
-
-3) No Modified Version of the Font Software may use the Reserved Font
-Name(s) unless explicit written permission is granted by the corresponding
-Copyright Holder. This restriction only applies to the primary font name as
-presented to the users.
-
-4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
-Software shall not be used to promote, endorse or advertise any
-Modified Version, except to acknowledge the contribution(s) of the
-Copyright Holder(s) and the Author(s) or with their explicit written
-permission.
-
-5) The Font Software, modified or unmodified, in part or in whole,
-must be distributed entirely under this license, and must not be
-distributed under any other license. The requirement for fonts to
-remain under this license does not apply to any document created
-using the Font Software.
-
-TERMINATION
-This license becomes null and void if any of the above conditions are
-not met.
-
-DISCLAIMER
-THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
-EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
-MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
-OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
-COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
-INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
-DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
-FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
-OTHER DEALINGS IN THE FONT SOFTWARE.