Tab
Tabは、関連するコンテンツをグループ化し、ユーザーがそれらのコンテンツ間を切り替えることで、ページを離れることなく表示を切り替えられるようにするUIです。Tabは、水平に配置された一連のタブ(ボタンやリンク)から成り、各タブには対応するコンテンツが関連付けられています。ユーザーが特定のタ
Tabは、関連するコンテンツをグループ化し、ユーザーがそれらのコンテンツ間を切り替えることで、ページを離れることなく表示を切り替えられるようにするUIです。Tabは、水平に配置された一連のタブ(ボタンやリンク)から成り、各タブには対応するコンテンツが関連付けられています。ユーザーが特定のタ
Headlineは見出しです。ページのコンテンツにおいて見出しの役割をします。Title with Buttonsはページ全体の見出し、Title with subTitleはコンポーネントやUIの固まりに対する見出しとして使用できます。設計の原則見出しレベルは、見た目の大きさではなく、文
折りたたんだり展開したりできるコンテンツ領域です。Accordionスタイルでは、一度につき一つのPanelのみ展開する事ができます。オープン時に表示される領域.Panelの中身は、Swap Instanceで他のコンポーネントに変更する事ができます。使用例Pro
通知があることやステータスをユーザーに知らせるためのパーツです。バッジは通常、目を引く魅力的な通知、またはユーザー アバターの近くに表示され、Numberは未読メッセージ数を表示します。Properties(振る舞いの設定)Component Propertiesで設定され
Inputは、ユーザーがコンテンツやデータを操作したり入力したりすることが可能なコンポーネントです。Form Setに入れてLabelやHelper Textとセットで使用します。設計の原則コンテナーの横幅は、言葉の長さに合わせて調整しましょう。ラベルテキストは端的に表現してください。入力
日付を選択または入力するためのUIです。入力する日付が当日に近い場合に有効なコンポーネントであり、生年月日などある程度遡って入力する必要がある場合にはプルダウンを使用してください。設計の原則Inputユーザーが入力する日付が1日の場合はDefault、期間を入力する場合はRangeを使用し
Pagenationは、大量のコンテンツやデータを複数のページに分割し、次のページや前のページに移動するためのコントロールとして使用します。種類Paginationは、以下3種類を利用可能です。Pagination Basic:Paginationの基本機能のみPagination
ページの上部、または上下に配置され、階層内の現在の場所を表示します。選択した項目の階層の上位の状態に戻ることができます。Properties(振る舞いの設定)Component Propertiesで設定されている内容。カラートークンStateToken
Buttonはユーザーに処理(アクション)をさせるために使用する要素です。選択すると、対応するビジネスロジックが作動します。FDSでは以下の3タイプのボタンを用意しています。Containedメインアクションに使用します。1つのセクションに最大で1つのContained Buttonを