ヘッダー

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

構成

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

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

ヘッダーの構成

1. グローバルヘッダー

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

SmartHRロゴ

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

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

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

ヘルプボタン

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

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

ヘルプボタンの構成

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

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