WaterLevelSensor/SettingsBarIcon.qml

import QtQuick
import QtQuick.Effects
import QtQuick.Controls
import QtQuick.Controls.Material

Rectangle {
    id: settings_rect
    signal open;
    property color accent_color: "#00000000"
    property int font_enlarged_text_size: 20
    property string text: "⚙"
    Behavior on color {
        ColorAnimation {
            duration: 200
        }
    }
    Text {
        id: settings_text
        text: settings_rect.text
        anchors.centerIn: parent
        horizontalAlignment: Text.AlignHCenter
        verticalAlignment: Text.AlignVCenter
        color: settings_rect.accent_color
        font.pointSize: settings_rect.font_enlarged_text_size
    }

    MouseArea {
        id: settings_button_area
        anchors.fill: parent
        hoverEnabled: true
        property color settings_rect_pressed_prev: "#00000000"
        property color settings_rect_entered_prev: "#00000000"
        onEntered:  {
            settings_rect_entered_prev = settings_rect.color
            settings_rect.color = "#5A1F1F1F"
        }
        onExited: {
            settings_rect.color = settings_rect_entered_prev
        }
        onPressed: {
            settings_rect_pressed_prev = settings_rect.color
            settings_rect.color = "#5A1F4F1F"
            settings_rect.open();
        }
        onReleased: {
            settings_rect.color = settings_rect_pressed_prev
        }
    }
}