unitone v4.0.0 の概要

機能追加

• デコレーターブロックに overflow の設定を追加

変更

• デフォルトのカラム幅（--unitone--measure）を広めに変更（38rem → 42rem）
• デフォルトのコンテナー幅（--unitone--container-max-width）を広めに変更（1180px → 1280px）
• デフォルトの余白サイズを広めに変更

不具合の修正

• フレームブロック内の画像がフレームより小さく表示されてしまうことがある不具合を修正
• エディター上でインナーブロック内の最後のブロックにも下マージンが付与される不具合を修正
• スタイルバリエーションを設定しているときに、スマホドロワーナビゲーションの背景色・文字色にスタイルバリエーションの色が反映されない不具合を修正

デフォルトの余白サイズを広めに変更

広めのウィンドウサイズの場合でもバランスが良いデザインになるように、また、全体的にゆったりめのデザインになるように調整を入れました。

• 両端、子ページ一覧、カバー、レイヤー、リール、レスポンシブグリッド、スライダー、スイッチャー、サイドバーの各ブロックのデフォルト gap を --unitone--s1 から --unitone--s2 に変更
• ガターブロックのデフォルト padding を --unitone--s3 から --unitone--s4 に変更
• テキストブロック直下の見出しブロックの上下余白を調整

gap のデフォルト値について

上記の gap はこれまで --unitone--gap: var(--unitone--s1) のように、決め打ちの余白サイズが直接指定されていましたが、各ブロックの gap を一括で変更しやすいように --unitone--global--gap と --unitone--global--text-gap をいう2つの CSS プロパティを追加しました。

gap のデフォルトが --unitone--s2 なブロックは --unitone--global--gap が、--unitone--s1 なブロックは --unitone--global--text-gap が使用されます。

ということで、--unitone--global--gap: var(--unitone--s1) とすればこれまでどおりのデフォルト gap が再現されるということになります。

コンテナーブロックの左右余白について

また、コンテナーブロックの左右余白についても、--unitone--global--gutters という CSS カスタムプロパティを使用するように変更しました。

ブロックパターンの見直し

今回の変更にあわせて、ライセンスキーが有効な場合に使用できるブロックパターンの余白感覚も全て見直しました。既にブロックパターンを使用されていて、アップデートしたらバランスが崩れてしまったという場合は、お手数おかけいたしますが改めてそのブロックパターンを挿入していただき、コンテンツの入れ替えをお願いいたします。