Lyrics Card Generator v4.3.4 リリースノート

リリース日：2026-07-06

このバージョンでは「歌詞サンプル」をモーダルではなく、メイン編集画面の上にある空間レイヤーとして表示するようにしました。サンプルを開くと編集画面が下へ退き、アプリ内ヘッダーが下部に移動して戻るためのアンカーになり、サンプルカードはメインウィンドウ幅に合わせて並び替わります。

主な更新

ExamplesDialog のモーダルを ExamplesFloor の上部レイヤーに置き換え、オーバーレイ、Modal、Portal を使わない構成にしました。
ヘッダーの「サンプル」をクリックすると、サンプルレイヤーが上から入り、編集画面が下へ移動し、ヘッダーが下部にドッキングします。
下部ヘッダーは通常のヘッダー構造を再利用し、元の「サンプル」ボタン位置だけをコンパクトな X 戻るボタンに置き換えます。
サンプルカードはメインウィンドウ幅に応じて 1 列、2 列、3 列に切り替わり、小さなウィンドウでも横スクロールを避けます。
サンプルレイヤー下部にはヘッダー分の余白を確保し、最後のカード行が隠れないようにしました。
Escape で編集画面へ戻れ、任意のサンプルを読み込んだ後も自動的に編集画面へ戻ります。
アニメーションはより落ち着いた spring 曲線に変更し、reduced motion が有効な場合は大きな移動を抑えます。

検証

npm run typecheck
npm run core:test
npm run build
1280px、900px、520px のブラウザ幅で、列数、X 戻る、Escape 戻る、サンプル読み込み後の戻り、下部余白を確認しました。