ヘッダー

ヘッダー内に配置するコンテンツを定義します。

構成

ヘッダーの構造は、大きく2つの領域によって構成されています。

  1. グローバルヘッダー(上)
  2. [WIP]アプリナビゲーション(下)

ヘッダーの構成

1. グローバルヘッダー

グローバルヘッダーは、システム設定・通知・機能間の移動などのシステム全体の機能への横断的なアクセスを提供します。 この領域を構成する主な要素は次の通りです。

SmartHRロゴ

SmartHRの基本機能のトップページへ遷移するためのボタンです。 すべてのグローバルヘッダーに必ず配置します。 遷移先は、SmartHR基本機能のトップページです。

  • ロゴの表示には、SmartHRLogoを使います。
  • ロゴを使用する際は、基本要素のガイドラインに準拠します。

グローバルヘッダーにSmartHRロゴを配置した例

ヘルプボタン

SmartHRの基本機能と各プラスアプリに対応したヘルプセンターのページへ遷移するためのボタンです。 すべてのグローバルヘッダーに必ず配置します。

  • テキストリンクの左に ヘルプ アイコン(FaQuestionCircleIcon)を配置します。
  • アイコンの色は、テキストの色に準拠してWHITEとします。

ヘルプボタンの構成

遷移先は機能によって異なります。

機能遷移先備考
基本機能ヘルプセンターのトップページ
プラスアプリヘルプセンターのアプリごとに対応したセクションページ例:年末調整のグローバルヘッダーのヘルプボタンをクリックすると、年末調整のヘルプページへ遷移します。