// A number and its name. The figure is set in the display serif, which is what
// makes a screen of statistics read like a page rather than a readout.
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts

import ".."

ColumnLayout {
    property string label: ""
    property string value: "—"
    property string caption: ""
    property color accent: Theme.ink
    property int size: 30

    spacing: 2
    Layout.fillWidth: true

    Label {
        text: label.toUpperCase()
        color: Theme.muted
        font.pixelSize: 10
        font.letterSpacing: 1.2
        font.weight: Font.DemiBold
        font.family: Theme.sansFamily
    }
    Label {
        text: value
        color: accent
        font.pixelSize: size
        font.family: Theme.displayFamily
        font.letterSpacing: -0.5
    }
    Label {
        visible: caption !== ""
        text: caption
        color: Theme.faint
        font.pixelSize: 11
        font.family: Theme.sansFamily
        Layout.fillWidth: true
        elide: Text.ElideRight
        wrapMode: Text.WordWrap
    }
}