モバイル版のカテゴリ背景を変更するには？

[Vsekraski (Андрей)]

こんにちは。カテゴリの背景を変更できません。これを行う方法はありますか？

[Lilly (Lillian)]

これは Horizon で行うのが難しいかもしれません^[1]が、テーマコンポーネントでは以下のような方法で動作します。色は使用する変数によって異なります（例：ダークモード/ライトモード用のカラーパレットから --tertiary-low など）。独自の变量を作成して、さらに複雑にすることも可能です。

テーマコンポーネントのカスタム CSS では：

@use "lib/viewport";

//** 特定のカテゴリの ID をターゲットにする **//

.category-box[data-category-id="4"] {

// ** モバイルのみ適用 ** //

  @include viewport.until(md) {
    .category-box-inner {
       background: var(--tertiary-low);
    }
  }
}

現在お使いのサイトのカラーパレットを使用した場合：

ライトモード：

ダークモード：

---

1. Horizon はカスタマイズが面倒だと感じます ↩︎

[Lilly (Lillian)]

ダークモードとライトモードで切り替わるパレットに含まれていない特定の色を使用したい場合は、同じコンポーネント内の「Color Definitions」タブをご利用ください。

$bg-light: aqua;
$bg-dark: blueviolet;

:root {
  --category-id-4-background: #{dark-light-choose($bg-light, $bg-dark)};
}

[chapoi]

補足ですが：

Horizon はカスタマイズを前提としていません。

カスタマイズを行いたい場合は、公式の推奨として「Foundation」から開始し、それをベースとして利用することになっています。

詳しくは こちら をご覧ください。

@Discourse

カスタマイズを検討されているサイトでは、代わりに Foundation テーマを使用することを推奨します。

[Lilly (Lillian)]

それは残念ですね。管理者はサイトをカスタマイズしたいと考えているからです。Discourse の魅力の一つはそこにあるんですよ。

[chapoi]

はい、調整できるなら、もちろん進めてください。「いいえ」は「できない」という意味です。

ただし、それは本来そういうものではないため、簡単にカスタマイズすることを想定して設計されていません。技術に詳しくない人のための、すぐに使えるテーマとして作られています。