第6章 Red Hat Developer Hub の追加のカスタマイズ


このセクションでは、Red Hat Developer Hub に適用できる追加のカスタマイズオプションについて説明します。

タブのツールチップのカスタマイズ

タブのツールチップをカスタマイズするには、次の内容を app-config-rhdh.yaml ファイルに追加します。

app:
  title: My custom developer hub
Developer Hub インスタンスのブランディングのカスタマイズ

Developer Hub インスタンスのブランディングをカスタマイズするには、次の内容を app-config-rhdh.yaml ファイルに追加します。

app:
  branding:
    fullLogo: ${BASE64_EMBEDDED_FULL_LOGO}
    iconLogo: ${BASE64_EMBEDDED_ICON_LOGO}
    theme:
      light:
        primaryColor: ${PRIMARY_LIGHT_COLOR}
        headerColor1: ${HEADER_LIGHT_COLOR_1}
        headerColor2: ${HEADER_LIGHT_COLOR_2}
        navigationIndicatorColor: ${NAV_INDICATOR_LIGHT_COLOR}
      dark:
        primaryColor: ${PRIMARY_DARK_COLOR}
        headerColor1: ${HEADER_DARK_COLOR_1}
        headerColor2: ${HEADER_DARK_COLOR_2}
        navigationIndicatorColor: ${NAV_INDICATOR_DARK_COLOR}

上記の設定の各部分について説明します。

  • fullLogo は、展開された (固定された) サイドバー上のロゴであり、base64 でエンコードされた画像を想定しています。
  • iconLogo は、折りたたまれた (固定されていない) サイドバーのロゴであり、base64 でエンコードされた画像を想定しています。
  • primaryColor は、リンクとほとんどのボタンの色を、入力された色に設定します。primaryColor でサポートされている形式は次のとおりです。

    • #nnn
    • #nnnnnn
    • rgb()
    • rgba()
    • hsl()
    • hsla()
    • color()
  • headerColor1 (バナーの左側) と headerColor2 (バナーの右側) は、各ページのヘッダーバナーの色と、テンプレートカードのバナーの色を変更します。headerColor1headerColor2 でサポートされている形式は次のとおりです。

    • #nnn
    • #nnnnnn
    • rgb()
    • rgba()
    • hsl()
    • hsla()
    • color()
  • navigationIndicatorColor は、現在どのタブにいるかを示すサイドバーのインジケーターの色を変更します。navigationIndicatorColor でサポートされている形式は次のとおりです。

    • #nnn
    • #nnnnnn
    • rgb()
    • rgba()
    • hsl()
    • hsla()
    • color()
Red Hat logoGithubRedditYoutubeTwitter

詳細情報

試用、購入および販売

コミュニティー

Red Hat ドキュメントについて

Red Hat をお使いのお客様が、信頼できるコンテンツが含まれている製品やサービスを活用することで、イノベーションを行い、目標を達成できるようにします。

多様性を受け入れるオープンソースの強化

Red Hat では、コード、ドキュメント、Web プロパティーにおける配慮に欠ける用語の置き換えに取り組んでいます。このような変更は、段階的に実施される予定です。詳細情報: Red Hat ブログ.

会社概要

Red Hat は、企業がコアとなるデータセンターからネットワークエッジに至るまで、各種プラットフォームや環境全体で作業を簡素化できるように、強化されたソリューションを提供しています。

© 2024 Red Hat, Inc.