イオンSvelteコンポーネント

Icon Svelteコンポーネントは、Icon要素を表します。カスタムアイコン、Framework7 Icons、Material Iconsと一緒に使用することができます。

アイコンコンポーネント

以下のコンポーネントが含まれています。

Icon (アイコン)

アイコンのプロパティ

Prop	Type	Default	Description
size	number string		アイコンのサイズ（px
icon	string		カスタムアイコンクラス
f7	string		F7アイコンのフォントアイコン名
material	string		マテリアルアイコンの名称フォントアイコン
ios	string		iOSテーマを使用している場合に使用されるアイコンです。アイコンファミリーとアイコン名をコロンで区切ったものです。
md	string		Materialテーマを使用した場合のアイコンです。アイコンファミリーとアイコンの名前をコロンで区切ったもので構成されます。
aurora	string		Auroraテーマの場合に使用されるアイコンです。アイコンファミリーとアイコンの名前をコロンで区切ったもので構成されます。
tooltip	string		アイコン tooltip アイコンが押されたときに表示されるテキストです。
tooltipTrigger	string	hover	どのようにしてツールチップを開くかを定義します。hover`,` click`,` manual` のいずれかです。

例

<!--  デフォルトのバックアイコン -->
<Icon icon="icon-back" />

<!--  カスタムアイコン -->
<Icon icon="icon-home" />

<!--  F7アイコンのフォントアイコン -->
<Icon f7="house" />

<!--  マテリアルアイコンのフォントアイコン -->
<Icon material="home" />

<!--  F7アイコンのフォントアイコン（サイズと色をカスタマイズ -->
<Icon f7="house" size="44px" color="blue" />

<!--  条件付きアイコン -->
<Icon ios="f7:house" aurora="f7:house" md="material:home" />