[kcmkwin/kwineffects] Use new Kirigami ListSectionHeader component

Summary: {F7344129}

Test Plan: Open the {nav Desktop Effects} KCM.

Reviewers: #kwin, #plasma, #vdg, davidedmundson, ngraham

Reviewed By: #kwin, #plasma, #vdg, davidedmundson, ngraham

Subscribers: ngraham, kwin, #vdg, #plasma, #kwin

Tags: #kwin

Differential Revision: https://phabricator.kde.org/D23913

kcmkwin/kwineffects/package/contents/ui/Effect.qml

@@ -67,7 +67,7 @@ Kirigami.SwipeListItem {
             Kirigami.Heading {
                 Layout.fillWidth: true
 
-                level: 4
+                level: 5
                 text: model.NameRole
                 wrapMode: Text.Wrap
             }

kcmkwin/kwineffects/package/contents/ui/main.qml

@@ -22,7 +22,7 @@ import QtQuick.Layouts 1.1
 
 import org.kde.kcm 1.2
 import org.kde.kconfig 1.0
-import org.kde.kirigami 2.8 as Kirigami
+import org.kde.kirigami 2.10 as Kirigami
 import org.kde.private.kcms.kwin.effects 1.0 as Private
 
 ScrollViewKCM {
@@ -98,20 +98,9 @@ ScrollViewKCM {
         }
 
         section.property: "CategoryRole"
-        section.delegate:Kirigami.AbstractListItem {
+        section.delegate: Kirigami.ListSectionHeader {
             width: effectsList.width
-
-            backgroundColor: Kirigami.Theme.backgroundColor
-            Kirigami.Theme.inherit: false
-            Kirigami.Theme.colorSet: Kirigami.Theme.Window
-
-            hoverEnabled: false
-            supportsMouseEvents: false
-
-            Kirigami.Heading {
-                level: 2
-                text: section
-            }
+            text: section
         }
 
         function findButtonGroup(name) {