Font Icon

Font icon used（使用するフォントアイコン）

• fontawesome6.x (> Connect-CMS v1.26.1)
  • v6には、v5 アイコン名のエイリアスが含まれているため、v5のコードでも v6 アイコンを表示できます。
• fontawesome5.x (<= Connect-CMS v1.26.0)

ボタン表示

Commit changes（変更の確定）

• ボタン表示
  • ex. Save, Delete（登録、変更、削除を確定する際に使用）
• fontawesome6.x
  • <i class="fa-solid fa-check"></i> 変更確定
• fontawesome5.x
  • <i class="fas fa-check"></i> 変更確定
• https://fontawesome.com/icons/check?s=solid

Cancel（キャンセル）

• ボタン表示
• fontawesome6.x
  • <i class="fa-solid fa-xmark"></i> キャンセル
• fontawesome5.x
  • <i class="fas fa-times"></i> キャンセル
• https://fontawesome.com/icons/times?s=solid

Temporary save（一時保存）

• ボタン表示
• fontawesome6.x
  • <i class="fa-regular fa-floppy-disk"></i> 一時保存
• fontawesome5.x
  • <i class="far fa-save"></i> 一時保存
• https://fontawesome.com/icons/save?f=classic&s=regular

Delete（削除）

• ボタン表示
• fontawesome6.x
  • <i class="fa-solid fa-trash-can"></i> 削除
• fontawesome5.x
  • <i class="fas fa-trash-alt"></i> 削除
• https://fontawesome.com/icons/trash-alt?s=solid

Edit（編集）

• ボタン表示
• fontawesome6.x
  • <i class="fa-regular fa-pen-to-square"></i> 編集
• fontawesome5.x
  • <i class="far fa-edit"></i> 編集
• https://fontawesome.com/icons/edit?f=classic&s=regular

Send（確認画面へ）

• ボタン表示
  • fontawesome6.xにfacebook-messengerの対応するアイコンは無かったため、似たようなアイコンfa-commentに変更
• fontawesome6.x
  • <i class="fa-solid fa-comment"></i> 確認画面へ
• fontawesome5.x
  • <i class="fab fa-facebook-messenger"></i> 確認画面へ
• https://fontawesome.com/icons/comment?f=classic&s=solid
• https://fontawesome.com/icons/facebook-messenger?s=brands
• Connect-CMSの使用箇所「fa-comment」

Add options（選択肢追加）

• ボタン表示
• fontawesome6.x
  • <i class="fa-solid fa-plus"></i> <span class="d-none d-sm-inline">追加</span>
• fontawesome5.x
  • <i class="fas fa-plus"></i> <span class="d-none d-sm-inline">追加</span>
• https://fontawesome.com/icons/plus?s=solid
• Connect-CMSの使用箇所「-plus」

List（一覧）

• ボタン表示
• fontawesome6.x
  • <i class="fa-solid fa-list"></i> 一覧へ
• fontawesome5.x
  • <i class="fas fa-list"></i> 一覧へ
• https://fontawesome.com/icons/list?s=solid
• Connect-CMSの使用箇所「fa-list」

Download（ダウンロード）

• ボタン表示
• fontawesome6.x
  • <i class="fa-solid fa-file-arrow-down"></i> ダウンロード
• fontawesome5.x
  • <i class="fas fa-file-download"></i> ダウンロード
• https://fontawesome.com/icons/file-download?s=solid

メッセージ表示

Information（通知）

• メッセージ表示
• fontawesome6.x
  • <i class="fa-solid fa-circle-exclamation"></i> ブログ設定を変更します。
• fontawesome5.x
  • <i class="fas fa-exclamation-circle"></i> ブログ設定を変更します。
• https://fontawesome.com/icons/exclamation-circle?s=solid
• Connect-CMSの使用箇所「exclamation-circle」

Error（エラー）

• メッセージ表示
• fontawesome6.x
  • <i class="fa-solid fa-triangle-exclamation"></i> 500 internal server error. （システムでエラーが発生しました）
• fontawesome5.x
  • <i class="fas fa-exclamation-triangle"></i> 500 internal server error. （システムでエラーが発生しました）
• https://fontawesome.com/icons/exclamation-triangle?s=solid
• Connect-CMSの使用箇所「fa-exclamation-triangle」

All Icons

• https://fontawesome.com/search

Connect-cms lib path

• fontawesome6.x (> Connect-CMS v1.26.1)
  • public/css/app.css
• fontawesome5.x (<= Connect-CMS v1.26.0)
  • public/fontawesome/css/all.min.css

参考リンク

• Full Style Names < What's Changed | Font Awesome Docs
  • （機械翻訳）変更点＞下位互換性
    https://docs.fontawesome.com/web/setup/upgrade/whats-changed#backward-compatibility

    • v4/v5 アイコン名のエイリアスを追加 | バージョン 6 で名前が変更されたアイコンは、古い名前で参照されると、期待どおりに機能し、レンダリングされます

• [アイコン] fortawesome5→6へアップグレード OW-2522 #2137