unitone v19.7.0 の概要

機能追加

• 「サイドバー」「サイドバー（区切りあり）」ブロックに「枠線」「オーバーフロー」の設定を追加
• 「サイドバー」「サイドバー（区切りあり）」の子ブロックに「コンテンツの垂直配置」「背景色」「パディング」の設定を追加
• 「クラスター（区切りあり）」「フレックス（区切りあり）」「グリッド（区切りあり）」「レスポンシブグリッド（区切りあり）」「スタック（区切りあり）」ブロックの子ブロックに「背景色」「パディング」の設定を追加
• 「コンテンツの垂直配置（align-content）」の設定項目に stretch を追加

変更

• 「クラスター（区切りあり）」「フレックス（区切りあり）」ブロックから「項目の垂直配置（align-items）」の設定を削除

不具合の修正

• グローバルインサーターから「カバー」ブロックを挿入しようとするとエディターがクラッシュする不具合を修正
• 「このブロックの水平配置（justify-self）」「このブロックの垂直配置（align-self）」の設定 UI に不要な余白がある不具合を修正

「サイドバー」「サイドバー（区切りあり）」ブロックの機能強化

例えば、下記のようなレイアウトを実装するとき。

これまでであればデコレーターブロックや何やらを入れ子にして、枠線や背景色を追加したり、それぞれの中身を縦中央にしたりしていたのですが、今回のアップデートで、サイドバーブロック単体で実現できるようになりました。

注意点として、サイドバーブロックの子ブロック（メイン・サブ）の HTML 構造が変更されます。アップデートした時点では既存のコンテンツに影響はありませんが、編集画面を開いた段階で最新の HTML 構造に変更されます。サイドバーブロックの子ブロックを CSS でカスタマイズしている場合はレイアウトに影響がでる可能性がありますのでご注意ください。

「クラスター（区切りあり）」「フレックス（区切りあり）」「グリッド（区切りあり）」「レスポンシブグリッド（区切りあり）」「スタック（区切りあり）」ブロックの機能強化

これらもデザインのための入れ子をなるべく減らしたいなと思い、背景色とパディングの設定を追加しています。

下記は「レスポンシブグリッド（区切りあり）」でレイアウトしたサンプルです。これまでであればデコレーターブロックを入れて背景色やパディングを設定する必要がありましたが、単体で実現できるようになりました。