MD トピックリストモバイルコンポーネント

デスクトップのトピック一覧ページのちょっとしたリデザイン作業の後、モバイル版についても少し作業を行いました。トピックのタイトルを大きく表示するスペースを確保したり、2 行目にさらに詳しい情報を追加したり、最後の投稿専用の列を設けたりするなど、いくつかの似たアイデアを取り入れました。


互換性

このテーマコンポーネントは、タグ機能、フィーチャーされたリンク機能、および 元のトピック一覧バージョン で利用可能なすべての機能と互換性があります。カテゴリスタイルの表示(箇条書き、バー、ボックス)はすべて、このコンポーネントと動作します。

このテーマコンポーネントは、いくつかの色パレットでテストされており、ライト、ニュートラル、ダークのどのテーマでも動作します。

残念ながら、トピック一覧の表示を変更する既存のプラグイン(トピック一覧プレビューなど)とは互換性がない可能性があります。

問題があればお気軽にお知らせください!

「いいね!」 21

Nice Plugin. Though a general Reccommendation can we have Theme & Components list min Discourse version? I am on Stable branch but do have a test sandbox for 2.5beta. @codinghorror?

I just did a specific branch for older versions.

When installing, use the link https://github.com/iunctis/md-topic-list-mobile the advanced options and add older-discourse

You’ll know if it works if the avatars on the right column works fine. In a few weeks, when the avatars will be broken, you’ll just have to reinstall the component without using the advanced option

「いいね!」 2

A direct comparison:

Default / Component

I like the fact that the last poster avatar is on the right.
On the default mobile layout, the big avatar just on the left of the topic title screams “author”.

Just out of curiosity, I looked at the scss file, any reason for which you didn’t use nested syntax provided by scss?

「いいね!」 7

Tried the advanced option. Still says disabled req 2.5 beta2

Mostly because I make more mistakes with nested syntax on css :grimacing:

But I could rewrite it in a few weeks when I’m more confident with the topic list design

@Heliosurge I edited the about.json file, it should be ok now

「いいね!」 3

Thank you for your awesome work. :beers::sunglasses::+1::sparkles:

「いいね!」 2

I pushed a little upgrade just now. No new feature but I added the compatibility with the new thumbnails functions.

The theme component is now fully compatible with these components:

「いいね!」 4

I love it, so clean. @Steven I was wondering if its possible too add with CSS this native feature when you click in total replies?

Not with css but the template can be corrected.

I personally only use this feature to access the first post but I shouldn’t impose my way of navigating to everyone. I’ll see if I can reinstore the feature

「いいね!」 2

I upgraded the component to reinstore this feature, I tested on two supports but if there’s any issue let me know

「いいね!」 2

@Steven さん、新しいメッセージの通知が 2 回表示されているようです。1 つはトピックタイトルの右側に、もう 1 つは返信カウンターが表示される代わりに表示されています。これはバグでしょうか、それとも何か見落としているのでしょうか?

ちなみに、モバイルのトピック表示は非常に素晴らしいです。私のユーザーも気に入っています。

「いいね!」 1

それはトピックの入り口ボタンを含む最後のアップデートからのものであるはずです。以前のバージョンに戻す方がよいと思います。コンポーネントにあまり適していません。

数分後にアップグレードします

編集:今すぐアップグレードしました。よくなったか教えてください。

「いいね!」 1

はい、今は完璧に動作しています。ありがとうございます。迅速に対応していただき、ありがとうございます :slight_smile:

「いいね!」 1

タグリストの前に追加したタグの絵文字を削除したほうがいいと思います:

OSによって表示が異なります:

image

フォーラムのデザインに合わない可能性があります。デフォルトではアイコンが表示されないデスクトップのデザイン選択を尊重すべきです。

もし実際に tag icons component でタグアイコンを追加する場合、以下のように表示されます:

image

そのため、CSSで絵文字を非表示にしましたが、そもそもここにあるべきではないと思います :slight_smile:

私のフォーラムでの現在の表示:

image

.md-tlm .discourse-tags::before {
    display: none;
}
.md-tlm .tl-replies {
    margin-right: 8px;
}
「いいね!」 1

フィードバックありがとうございます。インターネットの接続に大きな問題があり、Discourse の作業が少し遅れています。

タグのアイコンや絵文字のアイデアは気に入っていますが、おそらく2つのテーマコンポーネントを d-icon タグに変更する予定です。同時に、タグアイコンコンポーネントとの互換性を保つため、アイコンを含まないブランチも作成します。

「いいね!」 1

スティーブンさん!

Discourse の現在のバージョンで、いくつかのレイアウトの問題があるようです。

空のテーマを作成し、MD Topic List Mobile Component のみを含めたところ、これが問題であることが判明しました。

以下はモバイルビューです。

マージン/パディングに何か奇妙な点があります。

「いいね!」 2

ありがとうございます。すぐに確認します。

コアの再設計が進んでいることを考えると、カスタムクラスを最大限削除するようにテンプレートを書き直してみます。

編集:新しいコミットです。将来的に更新しやすくするために、テンプレートとスタイルシートを書き直しました。

何か問題があればお知らせください @Canapin

「いいね!」 4

完璧のようです。ありがとうございます!

「いいね!」 1

返信数と並べて、トピックの合計いいね数と閲覧数を追加できますか?

「いいね!」 2