From 507703af1883ef161458a78dbe16ebc8705e9d6f Mon Sep 17 00:00:00 2001
From: Pascal Precht <pascal.precht@gmail.com>
Date: Thu, 17 Jun 2021 15:04:18 +0200
Subject: [PATCH] feat(Components): introduce `StatusListSectionHeadline`

Usage:

```qml
import StatusQ.Components 0.1

StatusListSectionHeadline {
    text: "Settings"
}
```

Closes #164
---
 sandbox/main.qml                                      | 10 +++++-----
 sandbox/qml.qrc                                       |  1 -
 .../StatusQ/Components/StatusListSectionHeadline.qml  | 11 +++++++----
 src/StatusQ/Components/qmldir                         |  1 +
 statusq.qrc                                           |  1 +
 5 files changed, 14 insertions(+), 10 deletions(-)
 rename sandbox/NavigationHeader.qml => src/StatusQ/Components/StatusListSectionHeadline.qml (56%)

diff --git a/sandbox/main.qml b/sandbox/main.qml
index 3dd596ef..757c16d7 100644
--- a/sandbox/main.qml
+++ b/sandbox/main.qml
@@ -118,21 +118,21 @@ StatusWindow {
                         anchors.horizontalCenter: parent.horizontalCenter
                         spacing: 0
 
-                        NavigationHeader { text: "StatusQ.Core" }
+                        StatusListSectionHeadline { text: "StatusQ.Core" }
                         StatusNavigationListItem { 
                             title: "Icons" 
                             selected: page.sourceComponent == iconsComponent
                             onClicked: page.sourceComponent = iconsComponent
                         }
 
-                        NavigationHeader { text: "StatusQ.Layout" }
+                        StatusListSectionHeadline { text: "StatusQ.Layout" }
                         StatusNavigationListItem { 
                             title: "Layouts" 
                             selected: page.sourceComponent == layoutComponent
                             onClicked: page.sourceComponent = layoutComponent
                         }
 
-                        NavigationHeader { text: "StatusQ.Controls" }
+                        StatusListSectionHeadline { text: "StatusQ.Controls" }
                         StatusNavigationListItem { 
                             title: "Buttons" 
                             selected: page.sourceComponent == buttonsComponent
@@ -143,7 +143,7 @@ StatusWindow {
                             selected: page.sourceComponent == controlsComponent
                             onClicked: page.sourceComponent = controlsComponent
                         }
-                        NavigationHeader { text: "StatusQ.Components" }
+                        StatusListSectionHeadline { text: "StatusQ.Components" }
                         StatusNavigationListItem { 
                             title: "List Items"
                             selected: page.sourceComponent == listItemsComponent
@@ -159,7 +159,7 @@ StatusWindow {
                             selected: page.sourceComponent == othersComponent
                             onClicked: page.sourceComponent = othersComponent
                         }
-                        NavigationHeader { text: "StatusQ.Popup" }
+                        StatusListSectionHeadline { text: "StatusQ.Popup" }
                         StatusNavigationListItem { 
                             title: "StatusPopupMenu"
                             selected: page.sourceComponent == popupMenuComponent
diff --git a/sandbox/qml.qrc b/sandbox/qml.qrc
index 17e3f93e..082eb1dc 100644
--- a/sandbox/qml.qrc
+++ b/sandbox/qml.qrc
@@ -9,7 +9,6 @@
         <file>ListItems.qml</file>
         <file>StatusChatInfoToolBarPage.qml</file>
         <file>StatusPopupMenuPage.qml</file>
-        <file>NavigationHeader.qml</file>
         <file>ThemeSwitch.qml</file>
         <file>Layout.qml</file>
     </qresource>
diff --git a/sandbox/NavigationHeader.qml b/src/StatusQ/Components/StatusListSectionHeadline.qml
similarity index 56%
rename from sandbox/NavigationHeader.qml
rename to src/StatusQ/Components/StatusListSectionHeadline.qml
index f4803ce0..6965c29e 100644
--- a/sandbox/NavigationHeader.qml
+++ b/src/StatusQ/Components/StatusListSectionHeadline.qml
@@ -4,15 +4,18 @@ import StatusQ.Core 0.1
 import StatusQ.Core.Theme 0.1
 
 Item {
-    height: 34
-    width: 176
+    implicitHeight: 34
+    implicitWidth: 176
+
     property alias text: label.text
 
     StatusBaseText {
-        anchors.verticalCenter: parent.verticalCenter
+        anchors.left: parent.left
+        anchors.bottom: parent.bottom
+        anchors.bottomMargin: 4
+        anchors.leftMargin: 16
         id: label
         font.pixelSize: 15
         color: Theme.palette.baseColor1
     }
 }
-
diff --git a/src/StatusQ/Components/qmldir b/src/StatusQ/Components/qmldir
index 1c1d2a61..5f51052a 100644
--- a/src/StatusQ/Components/qmldir
+++ b/src/StatusQ/Components/qmldir
@@ -11,6 +11,7 @@ StatusChatToolBar 0.1 StatusChatToolBar.qml
 StatusDescriptionListItem 0.1 StatusDescriptionListItem.qml
 StatusLetterIdenticon 0.1 StatusLetterIdenticon.qml
 StatusListItem 0.1 StatusListItem.qml
+StatusListSectionHeadline 0.1 StatusListSectionHeadline.qml
 StatusLoadingIndicator 0.1 StatusLoadingIndicator.qml
 StatusNavigationListItem 0.1 StatusNavigationListItem.qml
 StatusNavigationPanelHeadline 0.1 StatusNavigationPanelHeadline.qml
diff --git a/statusq.qrc b/statusq.qrc
index 95d6180b..34446da7 100644
--- a/statusq.qrc
+++ b/statusq.qrc
@@ -26,6 +26,7 @@
         <file>src/StatusQ/Components/StatusRoundedImage.qml</file>
         <file>src/StatusQ/Components/StatusRoundIcon.qml</file>
         <file>src/StatusQ/Components/StatusListItem.qml</file>
+        <file>src/StatusQ/Components/StatusListSectionHeadline.qml</file>
         <file>src/StatusQ/Components/StatusDescriptionListItem.qml</file>
         <file>src/StatusQ/Components/StatusBadge.qml</file>
         <file>src/StatusQ/Components/StatusLetterIdenticon.qml</file>