リストアイテムにタイムスタンプを正しく配置する方法は？

Question

通常の受信トレイメッセージのように見えるリストアイテムを作成しようとしています。

components docsに示すデモは、タイムスタンプがion-noteとして添加されるが、設けられてマークアップで欠落して示しています。

デモHTMLを調べると、item-innerとinput-wrapperのようなクラスが使用されているようです。私はどこにでも彼らの情報を見つけることができないようです。

これらの問題を解決するために私自身のCSSを書いていますか、これを行うための正しい方法がありますか？

Answer 1

私はそれをしばらく前に理解しましたが、自分の質問に答えることはできませんでした。ここにあります。

マイion-itemマークアップ：右にイオン性の道を配置するitem-right属性を使用している間

<ion-item text-wrap> 
    <ion-avatar item-left> 
    <img src="http://i.pravatar.cc/80?u=judywong"> 
    </ion-avatar> 
    <h2>Jane Doe</h2> 
    <ion-note item-right>4:00 pm</ion-note> 
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor…</p> 
</ion-item> 

その後、私が一番上に配置するためにCSSを使用しています。

ion-note { 
    align-self: flex-start; 
    line-height: 1.8rem; 
    position: absolute; 
    top: 0; 
    right: $item-ios-padding-right/2; 
} 

はまた、タイムスタンプをクリアするh2にいくつかの右のパディングを追加しました。