UI: Clip TextinputField by default. Fix selection color in main.qml. Clip SettingsView if necessary

src/qml/SettingsView.qml

@@ -19,6 +19,7 @@ ScrollView{
     contentHeight: layout.implicitHeight
     contentWidth: Math.max(600, width - 2 * padding)
     padding: 10
+    clip: contentHeight > height
     GridLayout{
         id: layout
         anchors.left: parent.left
@@ -31,20 +32,11 @@ ScrollView{
         RowLayout{
             id: root
             enabled: UserManagment.currentUser.havePermission(Permission.CHANGE_SETTINGS_FILE_PATH)
-            Item{
+            TextInputField {
                 Layout.fillWidth: true
-                Layout.preferredWidth: inputSettingsPath.implicitWidth
-                Layout.preferredHeight: inputSettingsPath.implicitHeight
-                Layout.topMargin: 4
-                clip: true
-                id: wrapper
-                TextInputField{
-                    id: inputSettingsPath
-                    readOnly: true
-                    anchors.fill: parent
-                    anchors.bottomMargin: 2
-                    text: Settings.jsonSettingsFilePath
-                }
+                id: inputSettingsPath
+                readOnly: true
+                text: Settings.jsonSettingsFilePath
             }
             Button{
                 Layout.minimumWidth: implicitWidth

src/qml/components/TextFieldFileChooser.qml

@@ -10,21 +10,13 @@ RowLayout{
     property bool folder: false
     property var fileChooser: null
     height: 20
-    Item{
+
+    TextInputField{
         Layout.fillWidth: true
-        Layout.preferredWidth: textField.implicitWidth
-        Layout.preferredHeight: textField.implicitHeight
-        Layout.topMargin: 4
-        id: wrapper
-        clip: true
-        TextInputField{
-            id:textField
-            text: root.path
-            anchors.fill: parent
-            anchors.bottomMargin: 2
-            onAccepted: {
-                root.path = text
-            }
+        id: textField
+        text: root.path
+        onAccepted: {
+            root.path = text
         }
     }
     Button{

src/qml/components/TextInputField.qml

@@ -7,23 +7,25 @@ TextInput{
     color: Material.foreground
     selectByMouse: true
     font.pixelSize: 15
-    selectionColor: Material.textSelectionColor
+    selectionColor: Material.accentColor
+    selectedTextColor: Material.primaryHighlightedTextColor
+    bottomPadding: 3
+    topPadding: 3
+    clip: contentWidth > width || underline.width > width
     property alias underlineColor : underline.color
     property alias underline: underline
     cursorDelegate: Rectangle{
         color: Material.accentColor
-        x:parent.cursorRectangle.x
-        y:parent.cursorRectangle.y
-        width:parent.cursorRectangle.width+1
-        height:parent.cursorRectangle.height
+        x: parent.cursorRectangle.x
+        y: parent.cursorRectangle.y
+        width: parent.cursorRectangle.width+1
+        height: parent.cursorRectangle.height
         visible: parent.cursorVisible
         Behavior on x {
             NumberAnimation { easing.type: Easing.OutCubic; easing.amplitude: 9; easing.period: 50.0; duration: 500 }
         }
     }
-    //onCursorRectangleChanged: underline.clickX = cursorRectangle.x
     TextUnderline{
-        id:underline
-        //hasFocus: parent.focus
+        id: underline
     }
 }

src/qml/components/TextUnderline.qml

@@ -5,7 +5,7 @@ Rectangle{
     id:underline
     property real extendetWidth: 10
     //property real clickX: 0
-    anchors.top:parent.bottom
+    anchors.bottom: parent.bottom
     anchors.left:parent.left
     width: parent.contentWidth+extendetWidth
     height: 2

src/qml/main.qml

@@ -349,7 +349,7 @@ ApplicationWindow {
                Layout.rightMargin: 2
                clip: true
                color: Material.foreground
-               selectionColor: Material.textSelectionColor
+               selectionColor: Material.accentColor
                font: fontReference.font
                text: Settings.jsonSettingsFilePath
                selectByMouse: true