styling

src/main.qml

@@ -1,6 +1,7 @@
 import QtQuick 2.15
 import QtQuick.Window 2.15
-import QtQuick.Controls 2.15
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
 import QtQuick.Layouts 1.3
 
 import Qt.labs.folderlistmodel 2.15
@@ -16,6 +17,12 @@ Window {
   flags: Qt.Dialog
   id: window;
 
+  property string background: "#282C34";
+  property string emphasis:   "#50536b";
+  property string foreground: "#abb2bf";
+  property string text:       "#dfdfdf";
+  property string textAlt:    "#b2b2b2";
+
   Component {
     id: delegate
 
@@ -26,7 +33,8 @@ Window {
 
       Column {
         anchors.fill: parent
-  
+        topPadding: 5
+
         Reaction {
           anchors.horizontalCenter: parent.horizontalCenter
 
@@ -39,11 +47,17 @@ Window {
           id: label
           anchors.horizontalCenter: parent.horizontalCenter
           text: fileName
+          color: window.foreground
         }
       }
     }
   }
 
+  Rectangle {
+    anchors.fill: parent
+    color: window.background
+  }
+
   Column {
     anchors.fill: parent
 
@@ -55,6 +69,20 @@ Window {
       height: 40
       width: parent.width
 
+      style: TextFieldStyle {
+        textColor: window.text
+        placeholderTextColor: window.textAlt
+
+        background: Rectangle {
+          radius: 2
+          implicitWidth: 100
+          implicitHeight: 24
+          border.color: "#333"
+          border.width: 1
+          color: window.background
+        }
+      }
+
       onTextChanged: () => {
         backingModel.nameFilters = makeFilter(text.text)
         imageList.currentIndex = 0
@@ -91,6 +119,7 @@ Window {
       Rectangle {
         width: 2 * (parent.width / 3)
         height: parent.height
+        color: window.background
 
         GridView {
           id: imageList
@@ -115,7 +144,7 @@ Window {
           delegate: delegate
 
           highlight: Rectangle {
-            color: "lightsteelblue"
+            color: window.emphasis
             radius: 5
           }
         }

src/widgets/Reaction.qml

@@ -25,8 +25,9 @@ Item {
 
       Drag.dragType: Drag.Automatic
 
-      Drag.onDragFinished: {
-        Qt.quit()
+      Drag.onDragFinished: (x) => {
+        if (x === 1)
+          Qt.quit()
       }
 
       onStatusChanged: {