import QtQuick 6
import QtQuick.Controls 6
import QtQuick.Layouts 6

RowLayout{
    anchors.fill: parent
    spacing: 2
    TextField { // look at my field of TextFields
        id: na1
        Layout.fillWidth: true
        Layout.maximumWidth: parent.width / 2.5
        placeholderText: "enter playername"
        background: Rectangle {
            implicitWidth: 175
            implicitHeight: 35
            color: na1.enabled ? "transparent" : "#353637"
            border.color: na1.enabled ? "#87CEEB" : "transparent"
        
        }
    }

    TextField {
        id: bt1
        Layout.fillWidth: true
        Layout.maximumWidth: parent.width / 2.5
        placeholderText: qsTr("Enter bet")
            background: Rectangle {
            implicitWidth: 175
            implicitHeight: 35
            color: bt1.enabled ? "transparent" : "#353637"
            border.color: bt1.enabled ? "#87CEEB" : "transparent"
        
        }
    }

    RoundButton {
        id: p1
        Layout.fillWidth: true
        Layout.fillHeight: true
        Layout.maximumWidth: parent.width / 8
        Layout.maximumHeight: parent.height / 8
        text: "P"
        background: Rectangle {
            implicitHeight: 35
            implicitWidth: 35
            color: p1.down ? "#eddc1c" : "transparent"
            border.color: "#eddc1c"
            border.width: 1
            radius: 180
        }
    }

    RoundButton {
        Layout.fillWidth: true
        Layout.fillHeight: true
        Layout.maximumWidth: parent.width / 8
        Layout.maximumHeight: parent.height / 8
        id: d1
        text: "D"
        background: Rectangle {
            implicitHeight: 35
            implicitWidth: 35
            color: d1.down ? "#7207ed" : "transparent"
            border.color: "#7207ed"
            border.width: 1
            radius: 180
        }
    }

    RoundButton {
        id: w1
        Layout.fillWidth: true
        Layout.fillHeight: true
        Layout.maximumWidth: parent.width / 8
        Layout.maximumHeight: parent.height / 8
        text: "W"
        background: Rectangle{
            implicitHeight: 35
            implicitWidth: 35
            color: w1.down ? "#1dbf32" : "transparent"
            border.color: "#1dbf32"
            border.width: 1
            radius: 180
        }
    }

    RoundButton {
        id: l1
        Layout.fillWidth: true
        Layout.fillHeight: true
        Layout.maximumWidth: parent.width / 8
        Layout.maximumHeight: parent.height / 8
        text: "L"
        background: Rectangle{
            implicitHeight: 35
            implicitWidth: 35
            color: l1.down ? "#e6050c" : "transparent"
            border.color: "#e6050c"
            border.width: 1
            radius: 180
        }
    }
}