refactor: replaced CollapsibleSection with FontsSection

1 files changed, 2 insertions, 269 deletions

diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml
index d72700f..36028d2 100644
--- a/modules/controlcenter/appearance/AppearancePane.qml
+++ b/modules/controlcenter/appearance/AppearancePane.qml
@@ -744,276 +744,9 @@ Item {
                     rootPane: sidebarFlickable.rootPane
                 }
 
-                CollapsibleSection {
+                FontsSection {
                     id: fontsSection
-                    title: qsTr("Fonts")
-                    showBackground: true
-
-                    CollapsibleSection {
-                        id: materialFontSection
-                        title: qsTr("Material font family")
-                        expanded: true
-                        showBackground: true
-                        nested: true
-
-                        Loader {
-                            id: materialFontLoader
-                            Layout.fillWidth: true
-                            Layout.preferredHeight: item ? Math.min(item.contentHeight, 300) : 0
-                            asynchronous: true
-                            active: materialFontSection.expanded
-
-                            sourceComponent: StyledListView {
-                                id: materialFontList
-                                property alias contentHeight: materialFontList.contentHeight
-
-                                clip: true
-                                spacing: Appearance.spacing.small / 2
-                                model: Qt.fontFamilies()
-
-                                StyledScrollBar.vertical: StyledScrollBar {
-                                    flickable: materialFontList
-                                }
-
-                                delegate: StyledRect {
-                                    required property string modelData
-                                    required property int index
-
-                                    width: ListView.view.width
-
-                                    readonly property bool isCurrent: modelData === rootPane.fontFamilyMaterial
-                                    color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0)
-                                    radius: Appearance.rounding.normal
-                                    border.width: isCurrent ? 1 : 0
-                                    border.color: Colours.palette.m3primary
-
-                                    StateLayer {
-                                        function onClicked(): void {
-                                            rootPane.fontFamilyMaterial = modelData;
-                                            rootPane.saveConfig();
-                                        }
-                                    }
-
-                                    RowLayout {
-                                        id: fontFamilyMaterialRow
-
-                                        anchors.left: parent.left
-                                        anchors.right: parent.right
-                                        anchors.verticalCenter: parent.verticalCenter
-                                        anchors.margins: Appearance.padding.normal
-
-                                        spacing: Appearance.spacing.normal
-
-                                        StyledText {
-                                            text: modelData
-                                            font.pointSize: Appearance.font.size.normal
-                                        }
-
-                                        Item {
-                                            Layout.fillWidth: true
-                                        }
-
-                                        Loader {
-                                            active: isCurrent
-                                            asynchronous: true
-
-                                            sourceComponent: MaterialIcon {
-                                                text: "check"
-                                                color: Colours.palette.m3onSurfaceVariant
-                                                font.pointSize: Appearance.font.size.large
-                                            }
-                                        }
-                                    }
-
-                                    implicitHeight: fontFamilyMaterialRow.implicitHeight + Appearance.padding.normal * 2
-                                }
-                            }
-
-                        }
-                    }
-
-                    CollapsibleSection {
-                        id: monoFontSection
-                        title: qsTr("Monospace font family")
-                        expanded: false
-                        showBackground: true
-                        nested: true
-
-                        Loader {
-                            Layout.fillWidth: true
-                            Layout.preferredHeight: item ? Math.min(item.contentHeight, 300) : 0
-                            asynchronous: true
-                            active: monoFontSection.expanded
-
-                            sourceComponent: StyledListView {
-                                id: monoFontList
-                                property alias contentHeight: monoFontList.contentHeight
-
-                                clip: true
-                                spacing: Appearance.spacing.small / 2
-                                model: Qt.fontFamilies()
-
-                                StyledScrollBar.vertical: StyledScrollBar {
-                                    flickable: monoFontList
-                                }
-
-                                delegate: StyledRect {
-                                    required property string modelData
-                                    required property int index
-
-                                    width: ListView.view.width
-
-                                    readonly property bool isCurrent: modelData === rootPane.fontFamilyMono
-                                    color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0)
-                                    radius: Appearance.rounding.normal
-                                    border.width: isCurrent ? 1 : 0
-                                    border.color: Colours.palette.m3primary
-
-                                    StateLayer {
-                                        function onClicked(): void {
-                                            rootPane.fontFamilyMono = modelData;
-                                            rootPane.saveConfig();
-                                        }
-                                    }
-
-                                    RowLayout {
-                                        id: fontFamilyMonoRow
-
-                                        anchors.left: parent.left
-                                        anchors.right: parent.right
-                                        anchors.verticalCenter: parent.verticalCenter
-                                        anchors.margins: Appearance.padding.normal
-
-                                        spacing: Appearance.spacing.normal
-
-                                        StyledText {
-                                            text: modelData
-                                            font.pointSize: Appearance.font.size.normal
-                                        }
-
-                                        Item {
-                                            Layout.fillWidth: true
-                                        }
-
-                                        Loader {
-                                            active: isCurrent
-                                            asynchronous: true
-
-                                            sourceComponent: MaterialIcon {
-                                                text: "check"
-                                                color: Colours.palette.m3onSurfaceVariant
-                                                font.pointSize: Appearance.font.size.large
-                                            }
-                                        }
-                                    }
-
-                                    implicitHeight: fontFamilyMonoRow.implicitHeight + Appearance.padding.normal * 2
-                                }
-                            }
-                        }
-                    }
-
-                    CollapsibleSection {
-                        id: sansFontSection
-                        title: qsTr("Sans-serif font family")
-                        expanded: false
-                        showBackground: true
-                        nested: true
-
-                        Loader {
-                            Layout.fillWidth: true
-                            Layout.preferredHeight: item ? Math.min(item.contentHeight, 300) : 0
-                            asynchronous: true
-                            active: sansFontSection.expanded
-
-                            sourceComponent: StyledListView {
-                                id: sansFontList
-                                property alias contentHeight: sansFontList.contentHeight
-
-                                clip: true
-                                spacing: Appearance.spacing.small / 2
-                                model: Qt.fontFamilies()
-
-                                StyledScrollBar.vertical: StyledScrollBar {
-                                    flickable: sansFontList
-                                }
-
-                                delegate: StyledRect {
-                                    required property string modelData
-                                    required property int index
-
-                                    width: ListView.view.width
-
-                                    readonly property bool isCurrent: modelData === rootPane.fontFamilySans
-                                    color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0)
-                                    radius: Appearance.rounding.normal
-                                    border.width: isCurrent ? 1 : 0
-                                    border.color: Colours.palette.m3primary
-
-                                    StateLayer {
-                                        function onClicked(): void {
-                                            rootPane.fontFamilySans = modelData;
-                                            rootPane.saveConfig();
-                                        }
-                                    }
-
-                                    RowLayout {
-                                        id: fontFamilySansRow
-
-                                        anchors.left: parent.left
-                                        anchors.right: parent.right
-                                        anchors.verticalCenter: parent.verticalCenter
-                                        anchors.margins: Appearance.padding.normal
-
-                                        spacing: Appearance.spacing.normal
-
-                                        StyledText {
-                                            text: modelData
-                                            font.pointSize: Appearance.font.size.normal
-                                        }
-
-                                        Item {
-                                            Layout.fillWidth: true
-                                        }
-
-                                        Loader {
-                                            active: isCurrent
-                                            asynchronous: true
-
-                                            sourceComponent: MaterialIcon {
-                                                text: "check"
-                                                color: Colours.palette.m3onSurfaceVariant
-                                                font.pointSize: Appearance.font.size.large
-                                            }
-                                        }
-                                    }
-
-                                    implicitHeight: fontFamilySansRow.implicitHeight + Appearance.padding.normal * 2
-                                }
-                            }
-                        }
-                    }
-
-                    SectionContainer {
-                        contentSpacing: Appearance.spacing.normal
-
-                        SliderInput {
-                            Layout.fillWidth: true
-                            
-                            label: qsTr("Font size scale")
-                            value: rootPane.fontSizeScale
-                            from: 0.7
-                            to: 1.5
-                            decimals: 2
-                            suffix: "×"
-                            validator: DoubleValidator { bottom: 0.7; top: 1.5 }
-                            
-                            onValueModified: (newValue) => {
-                                rootPane.fontSizeScale = newValue;
-                                rootPane.saveConfig();
-                            }
-                        }
-                    }
+                    rootPane: sidebarFlickable.rootPane
                 }
 
                 ScalesSection {