Borders: optim/simplification of scaled borders

This commit is contained in:
ItsLemmy
2025-10-21 13:52:19 -04:00
parent 65db92e4fc
commit c9bbaf4c91
45 changed files with 74 additions and 74 deletions
+3 -3
View File
@@ -37,9 +37,9 @@ Singleton {
property int screenRadius: Math.round(20 * Settings.data.general.screenRadiusRatio)
// Border
property int borderS: Math.round(1 * uiScaleRatio)
property int borderM: Math.round(2 * uiScaleRatio)
property int borderL: Math.round(3 * uiScaleRatio)
property int borderS: Math.max(1, Math.round(1 * uiScaleRatio))
property int borderM: Math.max(1, Math.round(2 * uiScaleRatio))
property int borderL: Math.max(1, Math.round(3 * uiScaleRatio))
// Margins (for margins and spacing)
property int marginXXS: Math.round(2 * uiScaleRatio)
@@ -54,7 +54,7 @@ ColumnLayout {
Layout.preferredHeight: deviceLayout.implicitHeight + (Style.marginM * 2)
radius: Style.radiusM
color: Color.mSurface
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
border.color: getContentColor(Color.mOutline)
RowLayout {
+1 -1
View File
@@ -88,7 +88,7 @@ PopupWindow {
anchors.fill: parent
color: Color.mSurface
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: Style.radiusM
}
+7 -7
View File
@@ -79,9 +79,9 @@ NPanel {
visible: NetworkService.lastError.length > 0
Layout.fillWidth: true
Layout.preferredHeight: errorRow.implicitHeight + (Style.marginM * 2)
color: Qt.rgba(Color.mError.r, Color.mError.g, Color.mError.b, 0.1)
color: Qt.alpha(Color.mError, 0.1)
radius: Style.radiusS
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
border.color: Color.mError
RowLayout {
@@ -218,7 +218,7 @@ NPanel {
opacity: (NetworkService.disconnectingFrom === modelData.ssid || NetworkService.forgettingNetwork === modelData.ssid) ? 0.6 : 1.0
color: modelData.connected ? Qt.rgba(Color.mPrimary.r, Color.mPrimary.g, Color.mPrimary.b, 0.05) : Color.mSurface
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
border.color: modelData.connected ? Color.mPrimary : Color.mOutline
// Smooth opacity animation
@@ -339,7 +339,7 @@ NPanel {
visible: modelData.cached && !modelData.connected && NetworkService.forgettingNetwork !== modelData.ssid && NetworkService.disconnectingFrom !== modelData.ssid
color: Color.transparent
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: height * 0.5
width: savedText.implicitWidth + (Style.marginS * 2)
height: savedText.implicitHeight + (Style.marginXXS * 2)
@@ -415,7 +415,7 @@ NPanel {
height: passwordRow.implicitHeight + Style.marginS * 2
color: Color.mSurfaceVariant
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: Style.radiusS
RowLayout {
@@ -430,7 +430,7 @@ NPanel {
radius: Style.radiusXS
color: Color.mSurface
border.color: pwdInput.activeFocus ? Color.mSecondary : Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
TextInput {
id: pwdInput
@@ -497,7 +497,7 @@ NPanel {
height: forgetRow.implicitHeight + Style.marginS * 2
color: Color.mSurfaceVariant
radius: Style.radiusS
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
border.color: Color.mOutline
RowLayout {
+1 -1
View File
@@ -30,7 +30,7 @@ NBox {
imagePath: Settings.preprocessPath(Settings.data.general.avatarImage)
fallbackIcon: "person"
borderColor: Color.mPrimary
borderWidth: Math.max(1, Style.borderM)
borderWidth: Style.borderM
}
ColumnLayout {
+1 -1
View File
@@ -289,7 +289,7 @@ Variants {
color: Qt.alpha(Color.mSurface, Settings.data.dock.backgroundOpacity)
anchors.centerIn: parent
radius: Style.radiusL
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
border.color: Qt.alpha(Color.mOutline, Settings.data.dock.backgroundOpacity)
MouseArea {
+1 -1
View File
@@ -210,7 +210,7 @@ PopupWindow {
color: Color.mSurfaceVariant
radius: Style.radiusS
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
// Single MouseArea to handle both auto-close and menu interactions
MouseArea {
+1 -1
View File
@@ -690,7 +690,7 @@ Loader {
fallbackIcon: "disc"
fallbackIconSize: Style.fontSizeM
borderColor: Color.mOutline
borderWidth: Math.max(1, Style.borderS)
borderWidth: Style.borderS
}
}
+1 -1
View File
@@ -186,7 +186,7 @@ Variants {
radius: Style.radiusL
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
color: Color.mSurface
// Optimized progress bar container
@@ -145,7 +145,7 @@ NPanel {
radius: Style.radiusM
color: Color.mSurfaceVariant
border.color: Qt.alpha(Color.mOutline, Style.opacityMedium)
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
Behavior on height {
enabled: !Settings.data.general.animationDisabled
@@ -44,7 +44,7 @@ Popup {
color: Color.mSurface
radius: Style.radiusL
border.color: Color.mPrimary
border.width: Math.max(1, Style.borderM)
border.width: Style.borderM
}
contentItem: ColumnLayout {
@@ -181,7 +181,7 @@ ColumnLayout {
color: Color.mSurfaceVariant
radius: Style.radiusM
border.color: Color.mSecondary
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
Behavior on border.color {
ColorAnimation {
@@ -100,7 +100,7 @@ ColumnLayout {
anchors.margins: Style.marginXS
color: Color.transparent // Make background transparent
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: Style.radiusS
visible: model.rule !== undefined && model.rule !== "" // Only visible if rule exists
}
+2 -2
View File
@@ -362,7 +362,7 @@ NPanel {
Layout.alignment: Qt.AlignTop
color: Color.mSurfaceVariant
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: Style.radiusM
MouseArea {
@@ -464,7 +464,7 @@ NPanel {
radius: Style.radiusM
color: Color.mSurfaceVariant
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
ColumnLayout {
id: contentLayout
+1 -1
View File
@@ -194,7 +194,7 @@ ColumnLayout {
anchors.margins: Style.marginXS
fallbackIcon: "person"
borderColor: contributorArea.containsMouse ? Color.mOnTertiary : Color.mPrimary
borderWidth: Math.max(1, Style.borderM)
borderWidth: Style.borderM
Behavior on borderColor {
ColorAnimation {
+1 -1
View File
@@ -297,7 +297,7 @@ ColumnLayout {
// Visuals
color: Qt.alpha(Color.mOnSurface, 0.125)
border.color: Qt.alpha(Color.mOnSurface, Style.opacityLight)
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
// Content
RowLayout {
+3 -3
View File
@@ -334,10 +334,10 @@ ColumnLayout {
Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter
height: 50
height: 50 * Style.uiScaleRatio
radius: Style.radiusS
color: root.getSchemeColor(schemeName, "mSurface")
border.width: Math.max(1, Style.borderL)
border.width: Style.borderL
border.color: {
if (Settings.data.colorSchemes.predefinedScheme === schemeName) {
return Color.mSecondary
@@ -421,7 +421,7 @@ ColumnLayout {
height: 20
radius: width * 0.5
color: Color.mSecondary
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
border.color: Color.mOnSecondary
NIcon {
+1 -1
View File
@@ -67,7 +67,7 @@ ColumnLayout {
radius: Style.radiusM
color: Color.mSurfaceVariant
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
property var brightnessMonitor: BrightnessService.getMonitorForScreen(modelData)
+1 -1
View File
@@ -26,7 +26,7 @@ ColumnLayout {
imagePath: Settings.preprocessPath(Settings.data.general.avatarImage)
fallbackIcon: "person"
borderColor: Color.mPrimary
borderWidth: Math.max(1, Style.borderM)
borderWidth: Style.borderM
Layout.alignment: Qt.AlignTop
}
+1 -1
View File
@@ -59,7 +59,7 @@ ColumnLayout {
radius: Style.radiusM
color: Color.mSurfaceVariant
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
implicitHeight: contentCol.implicitHeight + Style.marginL * 2
ColumnLayout {
+1 -1
View File
@@ -417,7 +417,7 @@ ColumnLayout {
height: 50
radius: Style.radiusS
color: root.cacheVersion >= 0 ? root.getSchemeColor(schemeName, "mSurface") : root.getSchemeColor(schemeName, "mSurface")
border.width: Math.max(1, Style.borderL)
border.width: Style.borderL
border.color: itemMouseArea.containsMouse ? Color.mTertiary : (Settings.data.colorSchemes.predefinedScheme === schemeName ? Color.mSecondary : Color.mOutline)
RowLayout {
+1 -1
View File
@@ -393,7 +393,7 @@ PopupWindow {
anchors.fill: parent
color: Color.mSurface
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: Style.radiusS
// Only show content when we have text
+3 -3
View File
@@ -140,7 +140,7 @@ NPanel {
background: Rectangle {
color: screenTabBar.currentIndex === index ? Color.mSecondary : Color.transparent
radius: Style.radiusS
border.width: screenTabBar.currentIndex === index ? 0 : Math.max(1, Style.borderS)
border.width: screenTabBar.currentIndex === index ? 0 : Style.borderS
border.color: Color.mOutline
Behavior on color {
@@ -417,7 +417,7 @@ NPanel {
radius: width / 2
color: Color.mSecondary
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
visible: isSelected
NIcon {
@@ -476,7 +476,7 @@ NPanel {
color: Color.mSurface
radius: Style.radiusM
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
visible: (filteredWallpapers.length === 0 && !WallpaperService.scanning) || WallpaperService.scanning
Layout.fillWidth: true
Layout.preferredHeight: 130
+1 -1
View File
@@ -14,5 +14,5 @@ Rectangle {
color: Color.mSurfaceVariant
radius: Style.radiusM
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
}
+1 -1
View File
@@ -45,7 +45,7 @@ Rectangle {
return outlined ? Color.transparent : backgroundColor
}
border.width: outlined ? Math.max(1, Style.borderS) : 0
border.width: outlined ? Style.borderS : 0
border.color: {
if (!enabled)
return Color.mOutline
+1 -1
View File
@@ -40,7 +40,7 @@ RowLayout {
radius: Style.radiusXS
color: root.checked ? root.activeColor : Color.mSurface
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
Behavior on color {
ColorAnimation {
+1 -1
View File
@@ -22,7 +22,7 @@ Rectangle {
color: flat ? Color.transparent : Color.mSurface
radius: Style.radiusS
border.color: flat ? Color.transparent : Color.mSurfaceVariant
border.width: flat ? 0 : Math.max(1, Style.borderS)
border.width: flat ? 0 : Style.borderS
// Repaint gauge when the bound value changes
onValueChanged: gauge.requestPaint()
+2 -2
View File
@@ -29,7 +29,7 @@ ColumnLayout {
// Subtle border
border.color: root.expanded ? Color.mOnSecondary : Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
// Smooth color transitions
Behavior on color {
@@ -151,7 +151,7 @@ ColumnLayout {
color: Color.mSurface
radius: Style.radiusL
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
// Dynamic height based on content
Layout.preferredHeight: visible ? contentLayout.implicitHeight + (Style.marginL * 2) : 0
+2 -2
View File
@@ -18,7 +18,7 @@ Rectangle {
radius: Style.radiusM
color: Color.mSurface
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
// Minimized Look
MouseArea {
@@ -53,7 +53,7 @@ Rectangle {
radius: Layout.preferredWidth * 0.5
color: root.selectedColor
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
}
NText {
+2 -2
View File
@@ -114,7 +114,7 @@ Popup {
color: Color.mSurface
radius: Style.radiusS
border.color: Color.mPrimary
border.width: Math.max(1, Style.borderM)
border.width: Style.borderM
}
contentItem: NScrollView {
@@ -166,7 +166,7 @@ Popup {
radius: Style.radiusS
color: root.selectedColor
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
ColumnLayout {
spacing: 0
+2 -2
View File
@@ -76,7 +76,7 @@ RowLayout {
implicitHeight: preferredHeight
color: Color.mSurface
border.color: combo.activeFocus ? Color.mSecondary : Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: Style.radiusM
Behavior on border.color {
@@ -177,7 +177,7 @@ RowLayout {
background: Rectangle {
color: Color.mSurfaceVariant
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: Style.radiusM
}
}
+1 -1
View File
@@ -22,7 +22,7 @@ Popup {
background: Rectangle {
color: Color.mSurfaceVariant
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: Style.radiusM
}
+2 -2
View File
@@ -7,7 +7,7 @@ Rectangle {
id: root
color: Color.mSurface
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: Style.radiusM
property date sampleDate: new Date() // Dec 25, 2023, 2:30:45.123 PM
@@ -296,7 +296,7 @@ Rectangle {
color: tokenMouseArea.containsMouse ? Color.mPrimary : Color.mOnSurfaceVariant
radius: Style.radiusS
border.color: tokenMouseArea.containsMouse ? Color.mPrimary : Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
Behavior on color {
ColorAnimation {
+1 -1
View File
@@ -6,7 +6,7 @@ import qs.Services
Rectangle {
width: parent.width
height: Math.max(1, Style.borderS)
height: Style.borderS
gradient: Gradient {
orientation: Gradient.Horizontal
GradientStop {
+6 -6
View File
@@ -147,7 +147,7 @@ Popup {
color: Color.mSurfaceVariant
radius: Style.radiusL
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
}
Rectangle {
@@ -244,7 +244,7 @@ Popup {
color: Color.mSurfaceVariant
radius: Style.radiusS
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
RowLayout {
anchors.left: parent.left
@@ -371,7 +371,7 @@ Popup {
color: Color.mSurface
radius: Style.radiusM
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
FolderListModel {
id: folderModel
@@ -493,7 +493,7 @@ Popup {
color: Color.transparent
radius: parent.radius
border.color: isSelected ? Color.mSecondary : Color.mSurface
border.width: Math.max(1, Style.borderL)
border.width: Style.borderL
Behavior on color {
ColorAnimation {
duration: Style.animationFast
@@ -506,7 +506,7 @@ Popup {
color: (mouseArea.containsMouse && !isSelected) ? Color.mTertiary : Color.transparent
radius: parent.radius
border.color: (mouseArea.containsMouse && !isSelected) ? Color.mTertiary : Color.transparent
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
Behavior on color {
ColorAnimation {
duration: Style.animationFast
@@ -592,7 +592,7 @@ Popup {
radius: width / 2
color: Color.mSecondary
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
visible: isSelected
NIcon {
icon: "filepicker-check"
+1 -1
View File
@@ -38,7 +38,7 @@ Rectangle {
color: root.enabled && root.hovering ? colorBgHover : colorBg
radius: width * 0.5
border.color: root.enabled && root.hovering ? colorBorderHover : colorBorder
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
Behavior on color {
ColorAnimation {
+1 -1
View File
@@ -62,7 +62,7 @@ Rectangle {
}
radius: width * 0.5
border.color: root.enabled && root.hovering ? colorBorderHover : colorBorder
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
Behavior on color {
ColorAnimation {
+3 -3
View File
@@ -198,7 +198,7 @@ Loader {
color: panelBackgroundColor
radius: Style.radiusL
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
// Dragging support
property bool draggable: root.draggable
property bool isDragged: false
@@ -457,7 +457,7 @@ Loader {
anchors.margins: 0
color: Color.transparent
border.color: Color.mPrimary
border.width: Math.max(2, Style.borderL)
border.width: Style.borderL
radius: parent.radius
visible: panelBackground.isDragged && dragHandler.active
opacity: 0.8
@@ -469,7 +469,7 @@ Loader {
anchors.margins: 0
color: Color.transparent
border.color: Color.mPrimary
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: parent.radius
opacity: 0.3
}
+1 -1
View File
@@ -15,7 +15,7 @@ RadioButton {
radius: width * 0.5
color: Color.transparent
border.color: root.checked ? Color.mPrimary : Color.mOnSurface
border.width: Math.max(1, Style.borderM)
border.width: Style.borderM
anchors.verticalCenter: parent.verticalCenter
Rectangle {
+1 -1
View File
@@ -195,7 +195,7 @@ Item {
radius: Style.radiusXS
color: delegateItem.enabled ? root.activeColor : Color.mSurface
border.color: delegateItem.required ? root.activeColor : Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
opacity: delegateItem.required ? 0.7 : 1.0
Behavior on color {
+2 -2
View File
@@ -126,7 +126,7 @@ RowLayout {
implicitHeight: preferredHeight
color: Color.mSurface
border.color: combo.activeFocus ? Color.mSecondary : Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: Style.radiusM
Behavior on border.color {
@@ -272,7 +272,7 @@ RowLayout {
background: Rectangle {
color: Color.mSurfaceVariant
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
radius: Style.radiusM
}
}
+2 -2
View File
@@ -177,7 +177,7 @@ NBox {
radius: Style.radiusL
color: root.getWidgetColor(modelData)[0]
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
// Store the widget index for drag operations
property int widgetIndex: index
@@ -332,7 +332,7 @@ NBox {
radius: Style.radiusL
color: Color.transparent
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
opacity: 0.7
visible: flowDragArea.dragStarted
z: 2000
+2 -2
View File
@@ -33,7 +33,7 @@ Slider {
radius: height / 2
color: Qt.alpha(Color.mSurface, 0.5)
border.color: Qt.alpha(Color.mOutline, 0.5)
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
// A container composite shape that puts a semicircle on the end
Item {
@@ -119,7 +119,7 @@ Slider {
radius: width / 2
color: root.pressed ? Color.mTertiary : Color.mSurface
border.color: Color.mPrimary
border.width: Math.max(1, Style.borderL)
border.width: Style.borderL
anchors.centerIn: parent
Behavior on color {
+1 -1
View File
@@ -54,7 +54,7 @@ ColumnLayout {
radius: Style.radiusM
color: Color.mSurface
border.color: input.activeFocus ? Color.mSecondary : Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
Behavior on border.color {
ColorAnimation {
+2 -2
View File
@@ -34,7 +34,7 @@ RowLayout {
radius: height * 0.5
color: root.checked ? Color.mPrimary : Color.mSurface
border.color: Color.mOutline
border.width: Math.max(1, Style.borderS)
border.width: Style.borderS
Behavior on color {
ColorAnimation {
@@ -55,7 +55,7 @@ RowLayout {
radius: height * 0.5
color: root.checked ? Color.mOnPrimary : Color.mPrimary
border.color: root.checked ? Color.mSurface : Color.mSurface
border.width: Math.max(1, Style.borderM)
border.width: Style.borderM
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 0
x: root.checked ? switcher.width - width - 3 : 3