ヘッダー
ヘッダー内に配置するコンテンツを定義します。
構成
ヘッダーの構造は、大きく2つの領域によって構成されています。
- グローバルヘッダー(上)
- [WIP]アプリナビゲーション(下)
1. グローバルヘッダー
グローバルヘッダーは、システム設定・通知・機能間の移動などのシステム全体の機能への横断的なアクセスを提供します。 この領域を構成する主な要素は次の通りです。
SmartHRロゴ
SmartHRの基本機能のトップページへ移動するためのボタンです。 すべてのグローバルヘッダーに必ず配置します。 移動先は、SmartHR基本機能のトップページです。
- ロゴの表示には、SmartHRLogoを使います。
- ロゴを使用する際は、基本要素のガイドラインに準拠します。
ヘルプボタン
SmartHRの基本機能と各オプション機能に対応したヘルプセンターのページへ移動するためのボタンです。 すべてのグローバルヘッダーに必ず配置します。
- テキストリンクの左に ヘルプ アイコン(
FaQuestionCircleIcon
)を配置します。 - アイコンの色は、テキストの色に準拠して
WHITE
とします。
移動先は機能によって異なります。
機能 | 移動先 | 備考 |
---|---|---|
基本機能 | ヘルプセンターのトップページ | |
オプション機能 | ヘルプセンターのアプリごとに対応したセクションページ | 例:年末調整のグローバルヘッダーのヘルプボタンをクリックすると、年末調整のヘルプページへ移動します。 |