bluebey-studio: まぶたを左右の目で個別設定に、目グループにアイコン追加

まぶた（形・太さ・傾き・まつげ・上下の高さ）を目のグループ内に移し、左右別々に設定できるようにした。上まぶたと下まぶたが交差しないようスライダー範囲を相互に制限。両目・左の目・右の目に見分け用アイコンを付けた。

1 files changed, 17 insertions, 3 deletions

diff --git a/public/bluebey-studio/src/ui.js b/public/bluebey-studio/src/ui.js
index b4c7d24..91e852b 100644
--- a/public/bluebey-studio/src/ui.js
+++ b/public/bluebey-studio/src/ui.js
@@ -74,9 +74,6 @@ function tabIcon(d) {
   svg.setAttribute('stroke-width', '1.8');
   svg.setAttribute('stroke-linecap', 'round');
   svg.setAttribute('stroke-linejoin', 'round');
-  svg.setAttribute('aria-hidden', 'true');
-  // Sit the icon on the label's text baseline; the span and the text node keep
-  // the two from touching.
   svg.style.verticalAlign = 'baseline';
   svg.style.flex = '0 0 auto';
   const path = document.createElementNS(SVG_NS, 'path');
@@ -85,6 +82,23 @@ function tabIcon(d) {
   return svg;
 }
 
+/** A small stroke icon built from raw SVG markup (see the icons in panel.js). */
+export function svgIcon(inner, { size = 16, viewBox = '0 0 24 24', className = 'grp-icon' } = {}) {
+  const SVG_NS = 'http://www.w3.org/2000/svg';
+  const svg = document.createElementNS(SVG_NS, 'svg');
+  svg.setAttribute('viewBox', viewBox);
+  svg.setAttribute('width', String(size));
+  svg.setAttribute('height', String(size));
+  svg.setAttribute('fill', 'none');
+  svg.setAttribute('stroke', 'currentColor');
+  svg.setAttribute('stroke-width', '1.8');
+  svg.setAttribute('stroke-linecap', 'round');
+  svg.setAttribute('stroke-linejoin', 'round');
+  svg.setAttribute('class', className);
+  svg.innerHTML = inner;
+  return svg;
+}
+
 function secIcon(d) {
   const svg = tabIcon(d);
   svg.setAttribute('class', 'sec-icon');