9 files changed, 51 insertions, 7 deletions

diff --git a/framework/qml/ConversationListView.qml b/framework/qml/ConversationListView.qml
index 65f5bd02..dcb5e3a4 100644
--- a/framework/qml/ConversationListView.qml
+++ b/framework/qml/ConversationListView.qml
@@ -148,7 +148,7 @@ FocusScope {
             forwardWheelEvents: true
         }
 
-        ScrollBar.vertical: ScrollBar {}
+        ScrollBar.vertical: Kube.ScrollBar {}
 
     }
 }
diff --git a/framework/qml/ListView.qml b/framework/qml/ListView.qml
index 56ba1e37..eafa428d 100644
--- a/framework/qml/ListView.qml
+++ b/framework/qml/ListView.qml
@@ -26,7 +26,7 @@ ListView {
     property Item mouseProxy: scrollHelper
 
     clip: true
-    ScrollBar.vertical: ScrollBar {}
+    ScrollBar.vertical: Kube.ScrollBar {}
 
     Kube.ScrollHelper {
         id: scrollHelper
diff --git a/framework/qml/MailListView.qml b/framework/qml/MailListView.qml
index 5b97cd21..a9010881 100644
--- a/framework/qml/MailListView.qml
+++ b/framework/qml/MailListView.qml
@@ -70,7 +70,7 @@ FocusScope {
         clip: true
         focus: true
 
-        ScrollBar.vertical: ScrollBar{
+        ScrollBar.vertical: Kube.ScrollBar{
             id: scrollbar
         }
 
diff --git a/framework/qml/MailViewer.qml b/framework/qml/MailViewer.qml
index 329ef217..c3fc45d3 100644
--- a/framework/qml/MailViewer.qml
+++ b/framework/qml/MailViewer.qml
@@ -406,7 +406,7 @@ Rectangle {
             Flickable {
                 id: flickable
                 anchors.fill: parent
-                ScrollBar.vertical: ScrollBar {}
+                ScrollBar.vertical: Kube.ScrollBar {}
                 contentHeight: content.height
                 contentWidth: parent.width
                 Column {
diff --git a/framework/qml/People.qml b/framework/qml/People.qml
index 2029dc69..b9ed81bd 100644
--- a/framework/qml/People.qml
+++ b/framework/qml/People.qml
@@ -221,7 +221,7 @@ FocusScope {
                     leftMargin: Kube.Units.largeSpacing
                 }
 
-                Controls.ScrollBar.vertical: Controls.ScrollBar { }
+                Controls.ScrollBar.vertical: Kube.ScrollBar { }
                 contentHeight: contentColumn.height
 
                 clip: true
diff --git a/framework/qml/ScrollBar.qml b/framework/qml/ScrollBar.qml
new file mode 100644
index 00000000..9298c3ea
--- /dev/null
+++ b/framework/qml/ScrollBar.qml
@@ -0,0 +1,43 @@
+/*
+ *  Copyright (C) 2017 Michael Bohlender, <bohlender@kolabsys.com>
+ *
+ *  This program is free software; you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation; either version 2 of the License, or
+ *  (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ *  GNU General Public License for more details.
+ *
+ *  You should have received a copy of the GNU General Public License along
+ *  with this program; if not, write to the Free Software Foundation, Inc.,
+ *  51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
+ */
+
+import QtQuick 2.7
+import QtQuick.Templates 2.0 as T
+import org.kube.framework 1.0 as Kube
+
+T.ScrollBar {
+    id: control
+
+    implicitWidth: contentItem.implicitWidth
+    implicitHeight: contentItem.implicitHeight
+
+
+    contentItem: Rectangle {
+        implicitWidth: Kube.Units.gridUnit / 3
+        implicitHeight: Kube.Units.gridUnit / 3
+
+        color: Kube.Colors.disabledTextColor
+    }
+
+    background: Rectangle {
+        implicitWidth: Kube.Units.gridUnit / 3
+        implicitHeight: Kube.Units.gridUnit / 3
+
+        color: Kube.Colors.buttonColor
+    }
+}
diff --git a/framework/qml/TextEditor.qml b/framework/qml/TextEditor.qml
index b3bd34b8..5f29cef3 100644
--- a/framework/qml/TextEditor.qml
+++ b/framework/qml/TextEditor.qml
@@ -30,7 +30,7 @@ FocusScope {
         Flickable {
             id: flickableItem
             anchors.fill: parent
-            ScrollBar.vertical: ScrollBar {}
+            ScrollBar.vertical: Kube.ScrollBar {}
 
             Kube.TextArea {
                 id: edit
diff --git a/framework/qml/TreeView.qml b/framework/qml/TreeView.qml
index e1818a0b..d53497af 100644
--- a/framework/qml/TreeView.qml
+++ b/framework/qml/TreeView.qml
@@ -47,7 +47,7 @@ FocusScope {
 
         anchors.fill: parent
 
-        Controls2.ScrollBar.vertical: Controls2.ScrollBar {}
+        Controls2.ScrollBar.vertical: Kube.ScrollBar {}
         clip: true
         contentWidth: root.width
         contentHeight: treeView.implicitHeight
diff --git a/framework/qmldir b/framework/qmldir
index 7ce99e2a..6b3f355c 100644
--- a/framework/qmldir
+++ b/framework/qmldir
@@ -29,6 +29,7 @@ TextArea 1.0 TextArea.qml
 TextEditor 1.0 TextEditor.qml
 ToolTip 1.0 ToolTip.qml
 Label 1.0 Label.qml
+ScrollBar 1.0 ScrollBar.qml
 SelectableLabel 1.0 SelectableLabel.qml
 SelectableItem 1.0 SelectableItem.qml
 ContextMenuOverlay 1.0 ContextMenuOverlay.qml