Extended Bootstrap5 SCSS
Bootstrap5 SCSS を含むカラージェネレーターを搭載した強力なSCSSを搭載しています。
RFS (Responsive Font Sizes)に対応しています。
Pure Components
use-bootstrap はコンポーネントに設定されたプロパティで構成されており、Class 属性や Data 属性に設定された値で構成される Bootstrap5 とは異なります。
Class属性は、あらゆる値を受け入れ可能であるため 煩雑で可読性が低く、値の検証が不可能です。
コンポーネントのプロパティは明瞭で、値の検証が可能です。
出力結果は Bootstrap5 と同一になることを目指しています。
様々なBootstrap5 テンプレートのSCSSをそのまま利用できます。
Bootstrap5 JavaScript や Popper.js は利用しておらず、インクルード不要です。
コンポーネントの明確なプロパティ定義や親子関係は JSONなどのデータを主体とした動的レンダリング システムや CMS 、WYSIWYG コンポーネントを用いる際にも重要な意味を持つことになります。
柔軟なプロパティ指定
プロパティ属性は、v-bindによる値や式の指定の他、文字列での指定が可能です。
文字列として、数値、配列 (空白区切り)、オブジェクト(カンマ区切り)が可能です。 空属性による指定をサポートしています。
UnoCss 対応
un-プリフィクスを付与したclass属性値を利用することで、UnoCss に対応します。
nuxt-link 対応
to属性を利用することで、nuxt-link に対応します。
nuxt-image , nuxt-icon , nuxt-font , VueUse にも対応します.
Animation support
アニメーション効果をサポートしています。 動作を確認するために、OSやブラウザの視覚効果、アニメーション効果の設定を確認してください。
適度な抽象化 及び 自動化
Bootstrap5 と同様に 自由なレイアウトを可能とするため コンポーネントの高度な抽象化は行いません。 適度な抽象化のみを行っています。
コンポーネントのIDは省略可能です。必要な場合、自動的に付与されます。 手動で設定した場合は 子孫要素以外からのイベントを受け入れ可能になります。
role属性や area属性は可能な限り自動的に付与されます。
スクリプト無しテンプレート
ExtendコンポーネントやIntegration機能により、データ連携アプリケーションなど高度なサイトでもスクリプトを記載することなく構成することができます。