<@U10EJRH2L> i'm going to put up a web version of ...

# tornadofx

[carlw]

@Ruckus i'm going to put up a web version of the above program. do you have any stylesheets handy that could dress up the stock ListCell I'm using? I have a pair of Labels assigned to the graphic. There's an hbox added for aligning the times

[Ruckus]

Not on hand, but I could try to throw something together if you want.

[carlw]

if you have time. looking for something dark and Discord-like to spruce up the video, but i'll take anything

not looking to demo css

[Ruckus]

Alright, here's a quick shot (not super clean, but it works)

class Styles : Stylesheet() {
    companion object {
        val progressBox by cssclass()
        val message by cssclass()
        val messageText by cssclass()
        val messageTime by cssclass()
    }

    init {
        root {
            baseColor = Color.BLACK
        }
        listView {
            backgroundColor += Color.gray(0.2)

            label {
                textFill = Color.WHITE
            }

            s(listCell, listCell and even, listCell and odd) {
                backgroundColor += Color.TRANSPARENT
            }
            message {
                padding = box(5.px)
                borderWidth += box(0.px, 0.px, 1.px, 0.px)
                borderColor += box(Color.gray(1.0, 0.1))
                messageText {
                    padding = box(0.px, 0.px, 5.px, 0.px)
                }
                messageTime {
                    fontSize = 0.75.em
                    opacity = 0.5
                }
            }
        }
    }
}

I had to make a couple changes to your cell format graphic to get it to line up:

placeholder = label("Drag to fetch messages...")
cellFormat {
    text = null
    graphic = hbox {
        addClass(Styles.message)
        label(it.data).addClass(Styles.messageText)
        pane().hgrow = Priority.ALWAYS
        label(it.ts.format(DateTimeFormatter.ofPattern("hh:mm:ss"))).addClass(Styles.messageTime)
        alignment = Pos.BASELINE_CENTER
    }
}

(I also added a placeholder for the hey of it)