ボタンリストコンポーネント

画像とアイコン

アイコンを設定したい場合は、画像フィールドを空にしておく必要があります。

そして、画像/アイコンを右側に配置したい場合は、ボタン画像カスタムスタイル に以下を適用します。

left: auto;
right: .5rem;

DOM構造

ボタンリスト コンポーネントは、HTML DOM構造ではこのように構成されています。

<div style="display: flex; width: 100%"> <!-- カスタムスタイル applies here -->
  <a href="" ...> <!-- ボタンカスタムスタイル applies here-->
    <div
      style="position: absolute; top: .5rem; bottom: .5rem; overflow: hidden; left: .5rem;"
      <!-- ボタン画像カスタムスタイル applies here-->
    >
      {image || icon}
    </div>
    <span>
      {button text}
    </span>
  </a>
  ...
</div>