nosignal/nosignal-shell
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

controlcenter: 1px issue and radii uniform issues fixed

Browse source
This commit is contained in:
ATMDA 2025-11-16 12:36:50 -05:00
parent d184f8d673
commit 1ce7422838
1 changed files with 58 additions and 79 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

137
modules/controlcenter/appearance/AppearancePane.qml
View file

@ -1899,7 +1899,6 @@ RowLayout {
bottomMargin: 0 bottomMargin: 0
model: Wallpapers.list model: Wallpapers.list
clip: true
// Disable GridView's own scrolling - let parent handle it // Disable GridView's own scrolling - let parent handle it
interactive: false interactive: false
@ -1914,14 +1913,16 @@ RowLayout {
height: wallpaperGrid.cellHeight height: wallpaperGrid.cellHeight
readonly property bool isCurrent: modelData.path === Wallpapers.actualCurrent readonly property bool isCurrent: modelData.path === Wallpapers.actualCurrent
readonly property real itemMargin: Appearance.spacing.normal / 2
readonly property real itemRadius: Appearance.rounding.normal
StateLayer { StateLayer {
anchors.fill: parent anchors.fill: parent
anchors.leftMargin: Appearance.spacing.normal / 2 anchors.leftMargin: itemMargin
anchors.rightMargin: Appearance.spacing.normal / 2 anchors.rightMargin: itemMargin
anchors.topMargin: Appearance.spacing.normal / 2 anchors.topMargin: itemMargin
anchors.bottomMargin: Appearance.spacing.normal / 2 anchors.bottomMargin: itemMargin
radius: Appearance.rounding.normal radius: itemRadius
function onClicked(): void { function onClicked(): void {
Wallpapers.setWallpaper(modelData.path); Wallpapers.setWallpaper(modelData.path);
@ -1932,13 +1933,15 @@ RowLayout {
id: image id: image
anchors.fill: parent anchors.fill: parent
anchors.leftMargin: Appearance.spacing.normal / 2 anchors.leftMargin: itemMargin
anchors.rightMargin: Appearance.spacing.normal / 2 anchors.rightMargin: itemMargin
anchors.topMargin: Appearance.spacing.normal / 2 anchors.topMargin: itemMargin
anchors.bottomMargin: Appearance.spacing.normal / 2 anchors.bottomMargin: itemMargin
color: Colours.tPalette.m3surfaceContainer color: Colours.tPalette.m3surfaceContainer
radius: Appearance.rounding.normal radius: itemRadius
antialiasing: true antialiasing: true
layer.enabled: true
layer.smooth: true
CachingImage { CachingImage {
id: cachingImage id: cachingImage
@ -1949,6 +1952,7 @@ RowLayout {
cache: true cache: true
visible: opacity > 0 visible: opacity > 0
antialiasing: true antialiasing: true
smooth: true
// Show when ready // Show when ready
opacity: status === Image.Ready ? 1 : 0 opacity: status === Image.Ready ? 1 : 0
@ -1972,6 +1976,7 @@ RowLayout {
cache: true cache: true
visible: opacity > 0 visible: opacity > 0
antialiasing: true antialiasing: true
smooth: true
opacity: status === Image.Ready && cachingImage.status !== Image.Ready ? 1 : 0 opacity: status === Image.Ready && cachingImage.status !== Image.Ready ? 1 : 0
@ -1992,78 +1997,19 @@ RowLayout {
running: cachingImage.status === Image.Loading || cachingImage.status === Image.Null running: cachingImage.status === Image.Loading || cachingImage.status === Image.Null
onTriggered: triggered = true onTriggered: triggered = true
} }
}
// Border overlay that doesn't affect image size // Gradient overlay for filename - positioned inside image container for perfect alignment
Rectangle {
anchors.fill: parent
anchors.leftMargin: Appearance.spacing.normal / 2
anchors.rightMargin: Appearance.spacing.normal / 2
anchors.topMargin: Appearance.spacing.normal / 2
anchors.bottomMargin: Appearance.spacing.normal / 2
color: "transparent"
radius: Appearance.rounding.normal
border.width: isCurrent ? 2 : 0
border.color: Colours.palette.m3primary
antialiasing: true
Behavior on border.width {
NumberAnimation {
duration: 150
easing.type: Easing.OutQuad
}
}
MaterialIcon {
anchors.right: parent.right
anchors.top: parent.top
anchors.margins: Appearance.padding.small
visible: isCurrent
text: "check_circle"
color: Colours.palette.m3primary
font.pointSize: Appearance.font.size.large
}
// Gradient overlay for filename with rounded bottom corners
Rectangle { Rectangle {
id: filenameOverlay id: filenameOverlay
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.leftMargin: isCurrent ? 2 : 0
anchors.rightMargin: isCurrent ? 2 : 0
anchors.bottomMargin: isCurrent ? 2 : 0
implicitHeight: filenameText.implicitHeight + Appearance.padding.normal * 1.5 implicitHeight: filenameText.implicitHeight + Appearance.padding.normal * 1.5
// Only round bottom corners // No rounded corners - clipped by parent's rounded corners
topLeftRadius: 0 radius: 0
topRightRadius: 0
bottomLeftRadius: Appearance.rounding.normal
bottomRightRadius: Appearance.rounding.normal
Behavior on anchors.leftMargin {
NumberAnimation {
duration: 150
easing.type: Easing.OutQuad
}
}
Behavior on anchors.rightMargin {
NumberAnimation {
duration: 150
easing.type: Easing.OutQuad
}
}
Behavior on anchors.bottomMargin {
NumberAnimation {
duration: 150
easing.type: Easing.OutQuad
}
}
gradient: Gradient { gradient: Gradient {
GradientStop { GradientStop {
@ -2091,19 +2037,52 @@ RowLayout {
Colours.palette.m3surfaceContainer.b, 0.95) Colours.palette.m3surfaceContainer.b, 0.95)
} }
} }
opacity: 0
Behavior on opacity {
NumberAnimation {
duration: 1000
easing.type: Easing.OutCubic
}
}
Component.onCompleted: {
opacity = 1;
}
} }
}
opacity: 0 // Border overlay that doesn't affect image size
Rectangle {
anchors.fill: parent
anchors.leftMargin: itemMargin
anchors.rightMargin: itemMargin
anchors.topMargin: itemMargin
anchors.bottomMargin: itemMargin
color: "transparent"
radius: itemRadius + border.width
border.width: isCurrent ? 2 : 0
border.color: Colours.palette.m3primary
antialiasing: true
smooth: true
Behavior on opacity { Behavior on border.width {
NumberAnimation { NumberAnimation {
duration: 1000 duration: 150
easing.type: Easing.OutCubic easing.type: Easing.OutQuad
} }
} }
Component.onCompleted: { MaterialIcon {
opacity = 1; anchors.right: parent.right
anchors.top: parent.top
anchors.margins: Appearance.padding.small
visible: isCurrent
text: "check_circle"
color: Colours.palette.m3primary
font.pointSize: Appearance.font.size.large
} }
} }