import QtQuick 2.0

Item {
    id: delegateRoot
    property alias numberLabel: numberLabel.text
    property alias sideLabel: sideLabel.text
    property alias tStatusLabel: tStatusLabel.text
    property alias dStatusLabel: dStatusLabel.text

    property alias numberColumnWidth: numberColumn.width
    property alias sideColumnWidth: sideColumn.width
    property alias tStatusColumnWidth: tStatusColumn.width
    property alias dStatusColumnWidth: dStatusColumn.width

    height: 40
    width: 345

    Rectangle {
        id: delegateFrame
        anchors.fill: parent
        color: "black"
        border.width: 0

        Row {
            anchors.fill: parent
            spacing: 2

            Rectangle {
                id: numberColumn
                width: 50
                y: 6
                height: parent.height - 12
                anchors.margins: 3
                border.width: 1
                border.color: Qt.lighter( numberColumn.color )
                color: "#505050"
                radius: 3

                Text {
                    id: numberLabel
                    anchors.centerIn: parent
                    color: "white"
                }
            }

            Rectangle {
                id: sideColumn
                width: 50
                y: 6
                height: parent.height - 12
                anchors.margins: 3
                border.width: 1
                border.color: Qt.lighter( sideColumn.color )
                color: "#505050"
                radius: 3

                Text {
                    id: sideLabel
                    anchors.centerIn: parent
                    color: "white"
                }
            }


            Rectangle {
                id: tStatusColumn
                width: 120
                y: 6
                height: parent.height - 12
                anchors.margins: 3
                border.width: 1
                border.color: Qt.lighter( tStatusColumn.color )
                color: "#505050"
                radius: 3

                Text {
                    id: tStatusLabel
                    anchors.centerIn: parent
                    color: "white"
                }
            }

            Rectangle {
                id: dStatusColumn
                width: 120
                y: 6
                height: parent.height - 12
                anchors.margins: 3
                border.width: 1
                border.color: Qt.lighter( dStatusColumn.color )
                color: "#505050"
                radius: 3

                Text {
                    id: dStatusLabel
                    anchors.centerIn: parent
                    color: "white"
                }
            }
        }
    }
}