Font Icon - opensource-workshop/connect-cms GitHub Wiki
- fontawesome6.x (> Connect-CMS v1.26.1)
- v6には、v5 アイコン名のエイリアスが含まれているため、v5のコードでも v6 アイコンを表示できます。
- fontawesome5.x (<= Connect-CMS v1.26.0)
- ボタン表示
- 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
- ボタン表示
- fontawesome6.x
<i class="fa-solid fa-xmark"></i> キャンセル
- fontawesome5.x
<i class="fas fa-times"></i> キャンセル
- https://fontawesome.com/icons/times?s=solid
- ボタン表示
- 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
- ボタン表示
- 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
- ボタン表示
- 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
- ボタン表示
- 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」
- ボタン表示
- 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」
- ボタン表示
- 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」
- ボタン表示
- 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
- メッセージ表示
- 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」
- メッセージ表示
- 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」
- fontawesome6.x (> Connect-CMS v1.26.1)
- 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