public/bluebey-studio: ポーズ追加・シーンタブ新設・タブのアイコン化

- ポーズ例に「きおつけ」を追加し、おじぎ／ふかくおじぎを両手下げに、
  くびかしげは左足を接地させたままにするよう補正、「てをふる」の動き
  を追加、全身の移動スライダーの範囲を拡大
- 「表情」タブを「顔」に改名し、「背景」「舞台」「セリフ」「画面・光」
  「画面の情報」をまとめた「シーン」タブを新設
- 各タブをアイコンのみの表示にし、タブらしい見た目に変更（名前はツール
  チップと読み上げラベルに）
- 起動時の注意書きと /bluebey/ ページの禁止事項を「イメージを損なう
  ような利用（たとえば、攻撃的・差別的・性的・過激な利用、誹謗中傷
  など）」に変更
- これまでの未コミット分（背景の追加とWebP化、眼鏡・サングラス、ほっぺ
  ・頭の模様、缶詰、看板、集中線、輪郭線のズーム追従、スマホ対応、
  共有など）を反映
- タッチ用の操作案内の <p> の閉じ位置を修正

1 files changed, 11 insertions, 6 deletions

diff --git a/public/bluebey-studio/src/ui.js b/public/bluebey-studio/src/ui.js
index 71f79b4..e184f5e 100644
--- a/public/bluebey-studio/src/ui.js
+++ b/public/bluebey-studio/src/ui.js
@@ -84,8 +84,9 @@ function tabIcon(d) {
 }
 
 /**
- * Tabbed container: returns the per-tab panels to fill in. Each definition may
- * carry an `icon` (an SVG path `d`); the label stays visible next to it.
+ * Tabbed container: returns the per-tab panels to fill in. When a definition
+ * carries an `icon` (an SVG path `d`) the tab shows only that icon, and the
+ * label becomes its tooltip and accessible name; without one the label shows.
  */
 export function tabs(parent, definitions) {
   const bar = h('div', { class: 'tabs' });
@@ -101,10 +102,14 @@ export function tabs(parent, definitions) {
   };
 
   for (const definition of definitions) {
-    const button = h('button', { type: 'button', class: 'tab' },
-      definition.icon ? tabIcon(definition.icon) : null,
-      definition.icon ? ' ' : null,
-      h('span', { class: 'tab-label', text: definition.label }));
+    const button = h('button', { type: 'button', class: 'tab' });
+    if (definition.icon) {
+      button.append(tabIcon(definition.icon));
+      button.title = definition.label;
+      button.setAttribute('aria-label', definition.label);
+    } else {
+      button.append(h('span', { class: 'tab-label', text: definition.label }));
+    }
     button.addEventListener('click', () => select(definition.id));
     buttons.set(definition.id, button);
     bar.append(button);