トピックテキストの前にアバターの位置を反転させる方法

サポート
2

Discourseへようこそ！

これは見かけによらず難しいことです。テーブル要素を使用しており、実際のHTML構造を変更せずに順序を変更するのは簡単ではありません。構造を変更することは、基本的にコンポーネントを独自のテンプレートに置き換えることを意味しますが、それは全くお勧めしません。

試しにやってみましたが、純粋なCSSである程度可能ですが、あまり堅牢な実装ではありません。

試したい場合は、以下を使用してください。

.topic-list-item {
    position:relative;
}

.topic-list .posters {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    max-width: 150px;
    overflow: hidden;
    display: block;
    box-sizing: border-box;
    height: auto;
}

.topic-list .topic-list-data:first-of-type {
    padding-inline-start: 150px;
}

デスクトップにスコープすることをお勧めします！

「いいね！」 1