|||
|-|-|-|
| 
| 概要 | Pyx’s Modern Theme は、darkpixlz’s Modern Theme の後継です。|
| 
|プレビュー| Theme Creator |
| : hammer_and_wrench:|リポジトリ| GitHub - pyxfluff/moderntheme: Modern theme for Discourse. |
| 
|インストールガイド|テーマまたはテーマコンポーネントのインストール方法|
| 
|Discourseテーマ初心者の方へ| Discourseテーマ使用の初心者ガイド|
Pyx’s Modern Theme は、Air テーマのフォークであった私の古いテーマ、darkpixlz’s Modern Theme の後継です。約2500行あり、多くの問題があったため、書き直しました！
スクリーンショット
特徴
- 管理インターフェースとレビューパネル全体をサポート
- ほぼすべてのモダンなコア機能（新しいトピックマップ、新しいアップグレードページ、チャットなど）と一部のプラグインをサポート
- カスタマイズ可能な背景画像
- プロファイルでユーザーの背景画像を読み取るための
--user-bg-url プロパティを追加
- 私の古いテーマと比較して、全体的なコード行数が大幅に少なく、デバイスでのレンダリングが容易
既知の問題
- トピックマップが奇妙で、整列していないように見える
リポジトリへのすべての貢献を歓迎します。即日（おそらく）レビューされます。コメントやアイデアはありますか？ここに返信してください。問題がありますか？GitHubでイシューを作成してください。
すべてのスタイルはFirefoxでのみテストしています。Chromiumで問題が発生した場合は、遠慮なくレポートを提出してください。
それでは、テーマをお楽しみください！
「いいね！」 11
Monikas
(JustMonika)
2
コンポーネントがインストールされていない問題があるようで、それが画像のCSSを変更し、多くの画像が長方形になってしまうようです。
はい、これは見落としでした。コンポーネントがこのように画像を追加できることを忘れていました。修正はプッシュされました 
これは意図された動作です。バナーが閉じられていると、少し奇妙に見えるだけかもしれません。何とかしてみます。
Monikas
(JustMonika)
5
アダプティブスケールを追加することは可能でしょうか？右側にサイドバーコンポーネントを配置したいです。
CSS
/* ユーザーのアバター幅を取得し、広告コンテナの最大幅を設定します */
/* 広告コンテナのスタイル */
#list-area {
display: flex; /* Flexboxを使用して広告を配置します */
flex-direction: column; /* 広告を縦方向に表示します */
gap: 0; /* 広告画像間のスペースを削除します */
padding: 0; /* コンテナのパディングを削除します */
margin: 0; /* 広告コンテナの周囲の余分なマージンがないことを確認します */
max-width: 812px; /* 広告コンテナの幅を最大812px（アバター幅：48px）に制限します */
}
/* 広告リンクのスタイル */
.banner-ad {
display: block; /* 広告コンテナをブロック要素にします */
width: 100%; /* 広告コンテナが幅100%を占めるようにします */
max-width: 100%; /* 最大幅を超えないようにします */
margin: 0; /* 広告コンテナ間のスペースを削除します */
}
/* レスポンシブ広告画像のスタイル */
.ad-image {
width: 100%; /* 画像が親要素の全幅を占めるようにします */
height: auto; /* 画像の元の縦横比を維持します */
max-width: 100%; /* 画像がコンテナの最大幅を超えないようにします */
display: block; /* 画像の下の空きスペースの問題を修正します */
margin: 0; /* 画像の周囲の追加スペースを削除します */
}
/* レスポンシブデザイン：大きな画面と小さな画面で広告の表示を調整します */
/* 幅768px未満のデバイスで広告の表示を調整します */
@media (max-width: 768px) {
#list-area {
padding: 0; /* モバイルデバイスでの余分なパディングがないことを確認します */
}
.banner-ad {
width: 100%; /* 小さな画面で広告が全幅を占めるようにします */
}
.ad-image {
width: 100%; /* 画像がコンテナの幅に適合するようにします */
height: auto; /* 画像の縦横比を維持します */
}
}
/* 非常に小さなデバイス（例：縦向きの携帯電話）で広告画像をさらに調整します */
@media (max-width: 480px) {
.ad-image {
width: 100%; /* 画像が携帯電話の画面幅に適合するようにします */
max-width: 100%; /* 最大幅を100%に設定して、大きすぎるのを防ぎます */
height: auto; /* 画像の縦横比を維持します */
}
}
「いいね！」 1
明日、サイドコンポーネントを確認します。広告についてはテストできないため約束できませんが、一般的なスケーリングについては修正できるはずです。
「いいね！」 1
多くの修正と、カテゴリ編集ページおよびその他の管理者エリアのサポートを含むアップデートがプッシュされました！
@Monikas サイドボタンの問題もこれで修正されたはずです。
「いいね！」 2
申し訳ありませんが、今週は体調を崩すことが多く、他にもやるべきことがありました。投稿ストリームをきれいにし、多くのバグを修正し、コンポーザーをフロートさせました！
「いいね！」 1
また、テーマページが古いバージョンに元に戻り、多くの問題が発生していることに気づきました。意図したとおりに表示されるように再追加されると思うので、そこでの修正に労力はかけません。
以下のようなレイアウトは可能でしょうか？
このテーマの美しいレンダリングなどと同様に、以下のようにリーダーボードのサイドバーなども含めることはできますか？
皆さん、こんにちは。最近のアップデート不足をお詫びします！レビューキューとDockerマネージャーのサポートを追加しました。
「いいね！」 1
皆さん、こんにちは。
更新が遅くなり申し訳ありません。先週、タイトルの変更を依頼しましたが、実際にはフォローアップしていませんでした。ローカルサイトでテーマを同期しようとしたところ、ポートの競合について知りました。8時間後、私のホムラボ全体がProxmoxに移行しました。これに加えて、個人的なプロジェクトで過ごした1週間（4000 LOCのフロントエンドとバックエンドを文書化するのは簡単ではありません）を考慮すると、あまり自由な時間がありませんでした 
tl;dr: テーマは「プレビュー」段階を終了しました！ 
ほとんどのサイトで機能し、適切にスタイル設定されると確信しています。この新しい段階では、ここではバグレポートを受け付けません。今後はGitHubの問題を提出してください。
フィードバックをお待ちしています。どんなフィードバックでも歓迎です。遅いかもしれませんが、継続的なサポートに感謝します :3
「いいね！」 1
Den
(Den)
16
いつもながら素晴らしい出来栄えです、ありがとうございます！
「いいね！」 1
皆さん、こんにちは。
数日間、サイト上部に表示されていた非推奨の警告についてお詫び申し上げます 
。修正が完了しました。すべて通常通りに戻るはずです。
さらに良いニュースです！テーマを再度書き直しました。これにより、巨大なcommon.scssファイルではなくなりました。いくつかのマイナーな修正を行った以外は、見た目は変わらないはずです。お楽しみください :3
「いいね！」 3
DevTeVe
(DevTek Ve)
19
テーマはとても気に入りましたが、残念ながら使用を妨げる「アーティファクト」がいくつかあります 
- 「プロフィール」ページには、ヘッダーの後ろに「コンテンツにスキップ」という小さなボタンがあります。
- 別のカラーパレットを選択しようとすると（ユーザーとして、プロフィールで）、ドロップダウン選択が上記で言及した「コンテンツにスキップ」ボタンの近くに表示されます（それでそこにあることに気づきました）。
「いいね！」 1
DevTeVe
(DevTek Ve)
20
@darkpixlz フィードバックが理解しにくいかもしれないと思ったので、動画を録画しました 
