diff --git a/ui/StatusQ/sandbox/controls/Buttons.qml b/ui/StatusQ/sandbox/controls/Buttons.qml index cb444984aa..daae58f102 100644 --- a/ui/StatusQ/sandbox/controls/Buttons.qml +++ b/ui/StatusQ/sandbox/controls/Buttons.qml @@ -17,6 +17,24 @@ Column { horizontalItemAlignment: Grid.AlignHCenter + // Primary + StatusButton { + text: "Button" + type: StatusBaseButton.Type.Primary + } + + StatusButton { + text: "Button" + enabled: false + type: StatusBaseButton.Type.Primary + } + + StatusButton { + text: "Button" + loading: true + type: StatusBaseButton.Type.Primary + } + // Large StatusButton { text: "Button" diff --git a/ui/StatusQ/src/StatusQ/Controls/StatusBaseButton.qml b/ui/StatusQ/src/StatusQ/Controls/StatusBaseButton.qml index 29d48d9def..beabab6b8a 100644 --- a/ui/StatusQ/src/StatusQ/Controls/StatusBaseButton.qml +++ b/ui/StatusQ/src/StatusQ/Controls/StatusBaseButton.qml @@ -15,7 +15,8 @@ Rectangle { enum Type { Normal, - Danger + Danger, + Primary } property StatusIconSettings icon: StatusIconSettings { @@ -145,7 +146,7 @@ Rectangle { color: d.textColor } // Text - } // Ro + } // Row onPressed: { @@ -172,5 +173,4 @@ Rectangle { } } } // Sensor - } diff --git a/ui/StatusQ/src/StatusQ/Controls/StatusButton.qml b/ui/StatusQ/src/StatusQ/Controls/StatusButton.qml index b1317474b1..094ed3801b 100644 --- a/ui/StatusQ/src/StatusQ/Controls/StatusButton.qml +++ b/ui/StatusQ/src/StatusQ/Controls/StatusButton.qml @@ -5,13 +5,18 @@ import StatusQ.Core.Theme 0.1 StatusBaseButton { id: statusButton - normalColor: type === StatusBaseButton.Type.Normal ? Theme.palette.primaryColor3 - : Theme.palette.dangerColor3 - hoverColor: type === StatusBaseButton.Type.Normal ? Theme.palette.primaryColor2 - : Theme.palette.dangerColor2 + normalColor: type === StatusBaseButton.Type.Primary ? Theme.palette.primaryColor1 : + type === StatusBaseButton.Type.Normal ? Theme.palette.primaryColor3 + : Theme.palette.dangerColor3 + hoverColor: type === StatusBaseButton.Type.Primary ? Theme.palette.hoverColor(normalColor) : + type === StatusBaseButton.Type.Normal ? Theme.palette.primaryColor2 + : Theme.palette.dangerColor2 disaledColor: Theme.palette.baseColor2 - textColor: type === StatusBaseButton.Type.Normal ? Theme.palette.primaryColor1 - : Theme.palette.dangerColor1 + textColor: type === StatusBaseButton.Type.Primary ? Theme.palette.white : + type === StatusBaseButton.Type.Normal ? Theme.palette.primaryColor1 + : Theme.palette.dangerColor1 disabledTextColor: Theme.palette.baseColor1 + + font.weight: type === StatusBaseButton.Type.Primary ? Font.Medium : Font.Normal } diff --git a/ui/StatusQ/src/StatusQ/Core/Theme/ThemePalette.qml b/ui/StatusQ/src/StatusQ/Core/Theme/ThemePalette.qml index 4bb020dfdc..c3cbea55eb 100644 --- a/ui/StatusQ/src/StatusQ/Core/Theme/ThemePalette.qml +++ b/ui/StatusQ/src/StatusQ/Core/Theme/ThemePalette.qml @@ -100,6 +100,10 @@ QtObject { property color dropShadow: getColor('black', 0.12) property color backdropColor: getColor('black', 0.4) + function hoverColor(normalColor) { + return theme.name === "light" ? Qt.darker(normalColor, 1.1) : Qt.lighter(normalColor, 1.1) + } + property color baseColor1 property color baseColor2 property color baseColor3