refactor: add connected rect component

This commit is contained in:
2 * r + 2 * t 2026-06-07 02:48:11 +10:00
parent c36a2ade54
commit 7489d369fb
4 changed files with 22 additions and 25 deletions

View file

@ -0,0 +1,15 @@
import QtQuick
import Caelestia.Config
import qs.components
import qs.services
StyledRect {
property bool first
property bool last
color: Colours.tPalette.m3surfaceContainer
topLeftRadius: first ? Tokens.rounding.extraLarge : Tokens.rounding.extraSmall
topRightRadius: first ? Tokens.rounding.extraLarge : Tokens.rounding.extraSmall
bottomLeftRadius: last ? Tokens.rounding.extraLarge : Tokens.rounding.extraSmall
bottomRightRadius: last ? Tokens.rounding.extraLarge : Tokens.rounding.extraSmall
}

View file

@ -8,8 +8,8 @@ StyledSwitch {
id: root id: root
property string subtext property string subtext
property bool first property alias first: bg.first
property bool last property alias last: bg.last
readonly property alias bg: bg readonly property alias bg: bg
horizontalPadding: Tokens.padding.largeIncreased horizontalPadding: Tokens.padding.largeIncreased
@ -26,24 +26,13 @@ StyledSwitch {
onPressed: stateLayer.press(stateLayer.mouseX, stateLayer.mouseY) onPressed: stateLayer.press(stateLayer.mouseX, stateLayer.mouseY)
background: StyledRect { background: ConnectedRect {
id: bg id: bg
color: Colours.tPalette.m3surfaceContainer
topLeftRadius: root.first ? Tokens.rounding.extraLarge : Tokens.rounding.extraSmall
topRightRadius: root.first ? Tokens.rounding.extraLarge : Tokens.rounding.extraSmall
bottomLeftRadius: root.last ? Tokens.rounding.extraLarge : Tokens.rounding.extraSmall
bottomRightRadius: root.last ? Tokens.rounding.extraLarge : Tokens.rounding.extraSmall
StateLayer { StateLayer {
id: stateLayer id: stateLayer
manualPressOverride: root.pressed manualPressOverride: root.pressed
topLeftRadius: parent.topLeftRadius
topRightRadius: parent.topRightRadius
bottomLeftRadius: parent.bottomLeftRadius
bottomRightRadius: parent.bottomRightRadius
} }
} }

View file

@ -172,13 +172,10 @@ PageBase {
} }
} }
StyledRect { ConnectedRect {
Layout.fillWidth: true Layout.fillWidth: true
bottomLeftRadius: Tokens.rounding.extraLarge
bottomRightRadius: Tokens.rounding.extraLarge
radius: Tokens.rounding.extraSmall
implicitHeight: pairLayout.implicitHeight + pairLayout.anchors.margins * 2 implicitHeight: pairLayout.implicitHeight + pairLayout.anchors.margins * 2
color: Colours.tPalette.m3surfaceContainer last: true
StateLayer { StateLayer {
disabled: !root.btEnabled disabled: !root.btEnabled

View file

@ -201,14 +201,10 @@ PageBase {
} }
} }
StyledRect { ConnectedRect {
Layout.fillWidth: true Layout.fillWidth: true
bottomLeftRadius: Tokens.rounding.extraLarge
bottomRightRadius: Tokens.rounding.extraLarge
radius: Tokens.rounding.extraSmall
implicitHeight: addNetworkLayout.implicitHeight + addNetworkLayout.anchors.margins * 2 implicitHeight: addNetworkLayout.implicitHeight + addNetworkLayout.anchors.margins * 2
color: Colours.tPalette.m3surfaceContainer last: true
StateLayer {} StateLayer {}