File title.patch of Package applet-window-title

diff --git a/CMakeLists.txt b/CMakeLists.txt
new file mode 100644
index 0000000..f406dca
--- /dev/null
+++ b/CMakeLists.txt
@@ -0,0 +1,15 @@
+cmake_minimum_required(VERSION 3.16 FATAL_ERROR)
+
+project(applet_windowtitle VERSION 0.7.80)
+
+set(KF6_MIN_VERSION "6.22.0")
+set(PLASMA_MIN_VERSION "6.5.90")
+
+find_package(ECM ${KF6_MIN_VERSION} REQUIRED NO_MODULE)
+set(CMAKE_MODULE_PATH ${ECM_MODULE_PATH} ${ECM_KDE_MODULE_DIR})
+
+find_package(Plasma ${PLASMA_MIN_VERSION} REQUIRED)
+find_package(KF6KirigamiAddons 0.10 REQUIRED)
+find_package(Plasma5Support ${PLASMA_MIN_VERSION} REQUIRED)
+
+plasma_install_package(package org.kde.windowtitle)
diff --git a/contents/ui/LatteWindowsTracker.qml b/contents/ui/LatteWindowsTracker.qml
deleted file mode 100644
index b534562..0000000
--- a/contents/ui/LatteWindowsTracker.qml
+++ /dev/null
@@ -1,129 +0,0 @@
-/*
-*  Copyright 2019 Michail Vourlakos <mvourlakos@gmail.com>
-*
-*  This file is part of applet-window-title
-*
-*  Latte-Dock 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.
-*
-*  Latte-Dock 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, see <http://www.gnu.org/licenses/>.
-*/
-
-import QtQuick 2.7
-
-Item {
-    id: latteWindowsTracker
-    readonly property bool existsWindowActive: selectedTracker.lastActiveWindow.isValid && !activeTaskItem.isMinimized
-    readonly property bool existsWindowShown: selectedTracker.lastActiveWindow.isValid && !activeTaskItem.isMinimized
-
-    readonly property QtObject selectedTracker: plasmoid.configuration.filterByScreen ? latteBridge.windowsTracker.currentScreen : latteBridge.windowsTracker.allScreens
-
-    readonly property Item activeTaskItem: Item {
-        id: taskInfoItem
-        readonly property bool isMinimized: selectedTracker.lastActiveWindow.isMinimized
-        readonly property bool isMaximized: selectedTracker.lastActiveWindow.isMaximized
-        readonly property bool isActive: selectedTracker.lastActiveWindow.isActive
-        readonly property bool isOnAllDesktops: selectedTracker.lastActiveWindow.isOnAllDesktops
-        readonly property bool isKeepAbove: selectedTracker.lastActiveWindow.isKeepAbove
-
-        readonly property bool isClosable: selectedTracker.lastActiveWindow.hasOwnProperty("isClosable") ? selectedTracker.lastActiveWindow.isClosable : true
-        readonly property bool isMinimizable: selectedTracker.lastActiveWindow.hasOwnProperty("isMinimizable") ? selectedTracker.lastActiveWindow.isMinimizable : true
-        readonly property bool isMaximizable: selectedTracker.lastActiveWindow.hasOwnProperty("isMaximizable") ? selectedTracker.lastActiveWindow.isMaximizable : true
-        readonly property bool isVirtualDesktopsChangeable: selectedTracker.lastActiveWindow.hasOwnProperty("isVirtualDesktopsChangeable") ?
-                                                                selectedTracker.lastActiveWindow.isVirtualDesktopsChangeable : true
-
-        readonly property int winId: selectedTracker.lastActiveWindow.hasOwnProperty("winId") ? selectedTracker.lastActiveWindow.winId : -1
-
-
-        //! appname / title
-        property var icon: selectedTracker.lastActiveWindow.icon
-
-        readonly property string appName: modelAppName !== ""  ? modelAppName : discoveredAppName
-        readonly property string modelAppName: selectedTracker.lastActiveWindow.appName
-        readonly property string modelDisplay: selectedTracker.lastActiveWindow.display
-
-        property string title: ""
-        property string discoveredAppName: ""
-
-        function cleanupTitle() {
-            var text = modelDisplay;
-            var t = text;
-            var sep = t.lastIndexOf(" —– ");
-            var spacer = 4;
-
-            if (sep === -1) {
-                sep = t.lastIndexOf(" -- ");
-                spacer = 4;
-            }
-
-            if (sep === -1) {
-                sep = t.lastIndexOf(" -- ");
-                spacer = 4;
-            }
-
-            if (sep === -1) {
-                sep = t.lastIndexOf(" — ");
-                spacer = 3;
-            }
-
-            if (sep === -1) {
-                sep = t.lastIndexOf(" - ");
-                spacer = 3;
-            }
-
-            var dTitle = "";
-            var dAppName = "";
-
-            if (sep>-1) {
-                dTitle = text.substring(0, sep);
-                discoveredAppName = text.substring(sep+spacer, text.length);
-
-                //if title starts with application name, swap the found records
-                if (dTitle.startsWith(modelAppName)) {
-                    var firstPart = dTitle;
-                    dTitle = discoveredAppName;
-                    discoveredAppName = firstPart;
-                }
-            }
-
-            if (sep>-1) {
-                title = dTitle;
-            } else {
-                title = t;
-            }
-        }
-
-        onModelAppNameChanged: taskInfoItem.cleanupTitle()
-        onModelDisplayChanged: taskInfoItem.cleanupTitle()
-        Component.onCompleted: taskInfoItem.cleanupTitle()
-    }
-
-    function toggleMaximized() {
-        selectedTracker.lastActiveWindow.requestToggleMaximized();
-    }
-
-    function toggleMinimized() {
-        selectedTracker.lastActiveWindow.requestToggleMinimized();
-    }
-
-    function toggleClose() {
-        selectedTracker.lastActiveWindow.requestClose();
-    }
-
-    function togglePinToAllDesktops() {
-        selectedTracker.lastActiveWindow.requestToggleIsOnAllDesktops();
-    }
-
-    function toggleKeepAbove(){
-        selectedTracker.lastActiveWindow.requestToggleKeepAbove();
-    }
-}
-
diff --git a/contents/ui/config/ConfigAppearance.qml b/contents/ui/config/ConfigAppearance.qml
deleted file mode 100644
index cf0086d..0000000
--- a/contents/ui/config/ConfigAppearance.qml
+++ /dev/null
@@ -1,366 +0,0 @@
-/*
-*  Copyright 2018 Michail Vourlakos <mvourlakos@gmail.com>
-*
-*  This file is part of applet-window-title
-*
-*  Latte-Dock 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.
-*
-*  Latte-Dock 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, see <http://www.gnu.org/licenses/>.
-*/
-
-import QtQuick 2.9
-import QtQuick.Controls 1.0
-import QtQuick.Controls 2.2 as Controls22
-import QtGraphicalEffects 1.0
-import QtQuick.Layouts 1.0
-
-import org.kde.plasma.core 2.0 as PlasmaCore
-
-import "../../tools/Tools.js" as Tools
-
-Item {
-    id: root
-
-    property alias cfg_boldFont: boldChk.checked
-    property alias cfg_italicFont: italicChk.checked
-    property alias cfg_capitalFont: capitalChk.checked
-    property alias cfg_showIcon: showIconChk.checked
-    property alias cfg_iconFillThickness: iconFillChk.checked
-    property alias cfg_iconSize: iconSizeSpn.value
-    property alias cfg_lengthPolicy: root.selectedLengthPolicy
-    property alias cfg_spacing: spacingSpn.value
-    property alias cfg_style: root.selectedStyle
-    property alias cfg_lengthFirstMargin: lengthFirstSpn.value
-    property alias cfg_lengthLastMargin: lengthLastSpn.value
-    property alias cfg_lengthMarginsLock: lockItem.locked
-    property alias cfg_fixedLength: fixedLengthSlider.value
-    property alias cfg_maximumLength: maxLengthSlider.value
-
-    property alias cfg_subsMatch: root.selectedMatches
-    property alias cfg_subsReplace: root.selectedReplacements
-
-    // used as bridge to communicate properly between configuration and ui
-    property int selectedLengthPolicy
-    property int selectedStyle
-    property var selectedMatches: []
-    property var selectedReplacements: []
-
-    // used from the ui
-    readonly property real centerFactor: 0.3
-    readonly property int minimumWidth: 220
-
-    onSelectedStyleChanged: {
-        if (selectedStyle === 4) { /*NoText*/
-            showIconChk.checked = true;
-        }
-    }
-
-    SystemPalette {
-        id: palette
-    }
-
-    ColumnLayout {
-        id:mainColumn
-        spacing: units.largeSpacing
-        Layout.fillWidth: true
-
-        GridLayout{
-            columns: 2
-
-            Label{
-                Layout.minimumWidth: Math.max(centerFactor * root.width, minimumWidth)
-                text: i18n("Text style:")
-                horizontalAlignment: Text.AlignRight
-            }
-
-            CustomComboBox{
-                id: styleCmb
-
-                choices: [
-                    i18n("Application"),
-                    i18n("Title"),
-                    i18n("Application - Title"),
-                    i18n("Title - Application"),
-                    i18n("Do not show any text"),
-                ];
-
-                Component.onCompleted: currentIndex = plasmoid.configuration.style;
-                onChoiceClicked: root.selectedStyle = index;
-            }
-        }
-
-        GridLayout{
-            columns: 2
-
-            Label{
-                Layout.minimumWidth: Math.max(centerFactor * root.width, minimumWidth)
-                text: i18n("Icon:")
-                horizontalAlignment: Text.AlignRight
-            }
-
-            CheckBox{
-                id: showIconChk
-                text: i18n("Show when available")
-                enabled: root.selectedStyle !== 4 /*NoText*/
-            }
-
-            Label{
-            }
-
-            CheckBox{
-                id: iconFillChk
-                text: i18n("Fill thickness")
-                enabled: showIconChk.checked
-            }
-
-            Label{
-            }
-
-            RowLayout{
-                enabled: !iconFillChk.checked
-
-                SpinBox{
-                    id: iconSizeSpn
-                    minimumValue: 16
-                    maximumValue: 128
-                    suffix: " " + i18nc("pixels","px.")
-                    enabled: !iconFillChk.checked
-                }
-
-                Label {
-                    Layout.leftMargin: units.smallSpacing
-                    text: "maximum"
-                }
-            }
-        }
-
-        GridLayout{
-            columns: 2
-            enabled : root.selectedStyle !== 4 /*NoText*/
-
-            Label{
-                Layout.minimumWidth: Math.max(centerFactor * root.width, minimumWidth)
-                text: i18n("Font:")
-                horizontalAlignment: Text.AlignRight
-            }
-
-            CheckBox{
-                id: boldChk
-                text: i18n("Bold")
-            }
-
-            Label{
-                id: italicLbl
-                font.italic: true
-            }
-
-            CheckBox{
-                id: italicChk
-                text: i18n("Italic")
-            }
-
-            Label{
-            }
-
-            CheckBox{
-                id: capitalChk
-                text: i18n("First letters capital")
-            }
-        }
-
-        GridLayout{
-            columns: 2
-            enabled : root.selectedStyle !== 4 /*NoText*/
-
-            Label{
-                id: lengthLbl2
-                Layout.minimumWidth: Math.max(centerFactor * root.width, minimumWidth)
-                text: i18n("Length:")
-                horizontalAlignment: Text.AlignRight
-            }
-
-            CustomComboBox{
-                id: lengthCmb
-
-                choices: [
-                    i18n("Based on contents"),
-                    i18n("Fixed size"),
-                    i18n("Maximum"),
-                    i18n("Fill available space")
-                ];
-
-                Component.onCompleted: currentIndex = plasmoid.configuration.lengthPolicy
-                onChoiceClicked: root.selectedLengthPolicy = index;
-            }
-
-            Label{
-                visible: lengthCmb.currentIndex === 1 /*Fixed Length Policy*/
-            }
-
-            RowLayout{
-                visible: lengthCmb.currentIndex === 1 /*Fixed Length Policy*/
-
-                Slider {
-                    id: fixedLengthSlider
-                    Layout.minimumWidth: lengthCmb.width
-                    Layout.preferredWidth: Layout.minimumWidth
-                    Layout.maximumWidth: Layout.minimumWidth
-
-                    minimumValue: 24
-                    maximumValue: 1500
-                    stepSize: 2
-                }
-                Label {
-                    id: fixedLengthLbl
-                    text: fixedLengthSlider.value + " " + i18n("px.")
-                }
-            }
-
-            Label{
-                visible: lengthCmb.currentIndex === 2 /*Maximum Length Policy*/
-            }
-
-            RowLayout{
-                visible: lengthCmb.currentIndex === 2 /*Maximum Length Policy*/
-                Slider {
-                    id: maxLengthSlider
-                    Layout.minimumWidth: lengthCmb.width
-                    Layout.preferredWidth: Layout.minimumWidth
-                    Layout.maximumWidth: Layout.minimumWidth
-
-                    minimumValue: 24
-                    maximumValue: 1500
-                    stepSize: 2
-                }
-                Label {
-                    id: maxLengthLbl
-                    text: maxLengthSlider.value + " " + i18n("px.")
-                }
-            }
-
-            Label{
-            }
-
-            Label {
-                id: lengthDescriptionLbl
-                Layout.minimumWidth: lengthCmb.width - 10
-                Layout.preferredWidth: 0.5 * root.width
-                Layout.maximumWidth: Layout.preferredWidth
-
-                font.italic: true
-                wrapMode: Text.WordWrap
-
-                text: {
-                    if (lengthCmb.currentIndex === 0 /*Contents*/){
-                        return i18n("Contents provide an exact size to be used at all times.")
-                    } else if (lengthCmb.currentIndex === 1 /*Fixed*/) {
-                        return i18n("Length slider decides the exact size to be used at all times.");
-                    } else if (lengthCmb.currentIndex === 2 /*Maximum*/) {
-                        return i18n("Contents provide the preferred size and length slider its highest value.");
-                    } else { /*Fill*/
-                        return i18n("All available space is filled at all times.");
-                    }
-                }
-            }
-        }
-
-        ColumnLayout{
-            GridLayout{
-                id: visualSettingsGroup1
-                columns: 2
-                enabled: showIconChk.checked && root.selectedStyle !== 4 /*NoText*/
-
-                Label{
-                    Layout.minimumWidth: Math.max(centerFactor * root.width, minimumWidth)
-                    text: i18n("Spacing:")
-                    horizontalAlignment: Text.AlignRight
-                }
-
-                SpinBox{
-                    id: spacingSpn
-                    minimumValue: 0
-                    maximumValue: 36
-                    suffix: " " + i18nc("pixels","px.")
-                }
-            }
-
-            GridLayout{
-                id: visualSettingsGroup2
-
-                columns: 3
-                rows: 2
-                flow: GridLayout.TopToBottom
-                columnSpacing: visualSettingsGroup1.columnSpacing
-                rowSpacing: visualSettingsGroup1.rowSpacing
-
-                property int lockerHeight: firstLengthLbl.height + rowSpacing/2
-
-                Label{
-                    id: firstLengthLbl
-                    Layout.minimumWidth: Math.max(centerFactor * root.width, minimumWidth)
-                    text: plasmoid.configuration.formFactor===PlasmaCore.Types.Horizontal ?
-                              i18n("Left margin:") : i18n("Top margin:")
-                    horizontalAlignment: Text.AlignRight
-                }
-
-                Label{
-                    Layout.minimumWidth: Math.max(centerFactor * root.width, minimumWidth)
-                    text: plasmoid.configuration.formFactor===PlasmaCore.Types.Horizontal ?
-                              i18n("Right margin:") : i18n("Bottom margin:")
-                    horizontalAlignment: Text.AlignRight
-
-                    enabled: !lockItem.locked
-                }
-
-                SpinBox{
-                    id: lengthFirstSpn
-                    minimumValue: 0
-                    maximumValue: 24
-                    suffix: " " + i18nc("pixels","px.")
-
-                    property int lastValue: -1
-
-                    onValueChanged: {
-                        if (lockItem.locked) {
-                            var step = value - lastValue > 0 ? 1 : -1;
-                            lastValue = value;
-                            lengthLastSpn.value = lengthLastSpn.value + step;
-                        }
-                    }
-
-                    Component.onCompleted: {
-                        lastValue = plasmoid.configuration.lengthFirstMargin;
-                    }
-                }
-
-                SpinBox{
-                    id: lengthLastSpn
-                    minimumValue: 0
-                    maximumValue: 24
-                    suffix: " " + i18nc("pixels","px.")
-                    enabled: !lockItem.locked
-                }
-
-                LockItem{
-                    id: lockItem
-                    Layout.minimumWidth: 40
-                    Layout.maximumWidth: 40
-                    Layout.alignment: Qt.AlignTop | Qt.AlignLeft
-                    Layout.minimumHeight: visualSettingsGroup2.lockerHeight
-                    Layout.maximumHeight: Layout.minimumHeight
-                    Layout.topMargin: firstLengthLbl.height / 2
-                    Layout.rowSpan: 2
-                }
-            }
-        } // ColumnLayout
-    } //mainColumn
-}
diff --git a/contents/ui/config/CustomComboBox.qml b/contents/ui/config/CustomComboBox.qml
deleted file mode 100644
index a699a59..0000000
--- a/contents/ui/config/CustomComboBox.qml
+++ /dev/null
@@ -1,80 +0,0 @@
-/*
-*  Copyright 2018 Michail Vourlakos <mvourlakos@gmail.com>
-*
-*  This file is part of applet-window-title
-*
-*  Latte-Dock 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.
-*
-*  Latte-Dock 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, see <http://www.gnu.org/licenses/>.
-*/
-
-import QtQuick 2.0
-import QtQuick.Controls 1.0
-import QtQuick.Controls 2.2 as Controls22
-import QtQuick.Layouts 1.0
-
-Controls22.ComboBox{
-    id: combobox
-    Layout.minimumWidth: 270
-    Layout.preferredWidth: 350
-    Layout.maximumWidth:  0.3 * root.width
-
-    model: choices
-
-    property var choices: []
-
-    signal choiceClicked(int index);
-
-    Connections{
-        target: popup
-        onClosed: root.forceActiveFocus();
-    }
-
-    delegate: MouseArea{
-        width: combobox.width
-        height: combobox.height
-        hoverEnabled: true
-
-        onClicked: {
-            combobox.currentIndex = index;
-            combobox.choiceClicked(index);
-            combobox.popup.close();
-        }
-
-        Rectangle{
-            id:delegateBackground
-            anchors.fill: parent
-            color: {
-                if (containsMouse) {
-                    return palette.highlight;
-                }
-                if (combobox.currentIndex === index) {
-                    return selectedColor;
-                }
-
-                return "transparent";
-            }
-
-            readonly property color selectedColor: Qt.rgba(palette.highlight.r, palette.highlight.g, palette.highlight.b, 0.5);
-
-            Label{
-                id: label
-                anchors.left: parent.left
-                anchors.leftMargin: units.smallSpacing
-                anchors.verticalCenter: parent.verticalCenter
-                text: choices[index];
-                color: containsMouse ? palette.highlightedText : palette.text
-            }
-        }
-    }
-}
-
diff --git a/metadata.desktop b/metadata.desktop
deleted file mode 100644
index c9531d3..0000000
--- a/metadata.desktop
+++ /dev/null
@@ -1,20 +0,0 @@
-[Desktop Entry]
-Name=Window Title
-Comment=Shows the application title and icon of the active window
-
-Encoding=UTF-8
-Icon=preferences-desktop
-Keyword=window title icon
-Type=Service
-
-X-Plasma-API=declarativeappletscript
-X-Plasma-MainScript=ui/main.qml
-
-X-KDE-PluginInfo-Author=Michail Vourlakos
-X-KDE-PluginInfo-Category=Windows and Tasks
-X-KDE-PluginInfo-Email=mvourlakos@gmail.com
-X-KDE-PluginInfo-License=GPLv2
-X-KDE-PluginInfo-Name=org.kde.windowtitle
-X-KDE-PluginInfo-Version=0.7.1
-X-KDE-PluginInfo-Website=https://github.com/psifidotos/applet-window-title
-X-KDE-ServiceTypes=Plasma/Applet
diff --git a/contents/config/config.qml b/package/contents/config/config.qml
similarity index 94%
rename from contents/config/config.qml
rename to package/contents/config/config.qml
index 05a11a0..95bb7af 100644
--- a/contents/config/config.qml
+++ b/package/contents/config/config.qml
@@ -17,9 +17,9 @@
 *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import QtQuick 2.0
+import QtQuick
 
-import org.kde.plasma.configuration 2.0
+import org.kde.plasma.configuration
 
 ConfigModel {
     ConfigCategory {
diff --git a/contents/config/main.xml b/package/contents/config/main.xml
similarity index 93%
rename from contents/config/main.xml
rename to package/contents/config/main.xml
index 3caf22e..b00d4cb 100644
--- a/contents/config/main.xml
+++ b/package/contents/config/main.xml
@@ -107,15 +107,6 @@
     <default>2</default>
     <label>it is used in order to inform settings window about the plasmoid form factor. 2=Horizontal and 3=Vertical</label>
   </entry>
-  <entry name="containmentType" type="Enum">
-    <choices>
-       <choice name="Loading"/>
-       <choice name="Plasma"/>
-       <choice name="Latte"/>
-    </choices>
-    <label>it helps to enable/disable options that are specific to plasma or Latte panels</label>
-    <default>0</default>
-  </entry>
   <entry name="subsMatch" type="StringList">
     <default>"Telegram Desktop","Gimp-.*","soffice.bin"</default>
     <label>substitutions criteria - match for application names</label>
diff --git a/contents/tools/Tools.js b/package/contents/tools/Tools.js
similarity index 82%
rename from contents/tools/Tools.js
rename to package/contents/tools/Tools.js
index 2d707f2..86e0fa5 100644
--- a/contents/tools/Tools.js
+++ b/package/contents/tools/Tools.js
@@ -34,12 +34,12 @@ function cleanStringListItem(item)
 
 function applySubstitutes(text)
 {
-    var minSize = Math.min(plasmoid.configuration.subsMatch.length, plasmoid.configuration.subsReplace.length);
+    let minSize = Math.min(plasmoid.configuration.subsMatch.length, plasmoid.configuration.subsReplace.length);
 
-    for (var i = 0; i<minSize; ++i){
-        var fromS = cleanStringListItem(plasmoid.configuration.subsMatch[i]);
-        var toS = cleanStringListItem(plasmoid.configuration.subsReplace[i]);
-        var regEx = new RegExp(fromS, "ig"); //case insensitive
+    for (let i = 0; i<minSize; ++i){
+        let fromS = cleanStringListItem(plasmoid.configuration.subsMatch[i]);
+        let toS = cleanStringListItem(plasmoid.configuration.subsReplace[i]);
+        let regEx = new RegExp(fromS, "ig"); //case insensitive
         text = text.replace(regEx,toS);
     }
 
diff --git a/contents/ui/ActionsMouseArea.qml b/package/contents/ui/ActionsMouseArea.qml
similarity index 77%
rename from contents/ui/ActionsMouseArea.qml
rename to package/contents/ui/ActionsMouseArea.qml
index f087d92..d327e5b 100644
--- a/contents/ui/ActionsMouseArea.qml
+++ b/package/contents/ui/ActionsMouseArea.qml
@@ -17,29 +17,27 @@
 *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import QtQuick 2.7
+import QtQuick
 
-import org.kde.plasma.plasmoid 2.0
+import org.kde.plasma.plasmoid
 
 MouseArea {
     id: actionsArea
-    acceptedButtons: Qt.LeftButton | Qt.MidButton
+    acceptedButtons: Qt.MiddleButton | Qt.XButton1 | Qt.XButton2
 
     property bool wheelIsBlocked: false
 
-    onClicked: {
-        if (existsWindowActive && mouse.button === Qt.MidButton) {
+    onClicked: function(mouse) {
+        if (existsWindowActive && mouse.button === Qt.MiddleButton) {
             windowInfoLoader.item.requestClose();
+        } else if (existsWindowActive && mouse.button === Qt.XButton1) {
+            windowInfoLoader.item.activateNextPrevTask(false);
+        } else if (existsWindowActive && mouse.button === Qt.XButton2) {
+            windowInfoLoader.item.activateNextPrevTask(true);
         }
     }
 
-    onDoubleClicked: {
-        if (existsWindowActive && mouse.button === Qt.LeftButton) {
-            windowInfoLoader.item.toggleMaximized();
-        }
-    }
-
-    onWheel: {
+    onWheel: function(wheel) {
         if (wheelIsBlocked || !plasmoid.configuration.actionScrollMinimize) {
             return;
         }
@@ -47,7 +45,7 @@ MouseArea {
         wheelIsBlocked = true;
         scrollDelayer.start();
 
-        var delta = 0;
+        let delta = 0;
 
         if (wheel.angleDelta.y>=0 && wheel.angleDelta.x>=0) {
             delta = Math.max(wheel.angleDelta.y, wheel.angleDelta.x);
@@ -55,21 +53,25 @@ MouseArea {
             delta = Math.min(wheel.angleDelta.y, wheel.angleDelta.x);
         }
 
-        var angle = delta / 8;
+        let angle = delta / 8;
 
-        var ctrlPressed = (wheel.modifiers & Qt.ControlModifier);
+        let ctrlPressed = (wheel.modifiers & Qt.ControlModifier);
 
         if (angle>10) {
             //! upwards
             if (!ctrlPressed) {
                 windowInfoLoader.item.activateNextPrevTask(true);
-            } else if (windowInfoLoader.item.activeTaskItem
+            }/* else if (windowInfoLoader.item.activeTaskItem
                        && !windowInfoLoader.item.activeTaskItem.isMaximized){
                 windowInfoLoader.item.toggleMaximized();
-            }
+            }*/
         } else if (angle<-10) {
             //! downwards
             if (!ctrlPressed) {
+                windowInfoLoader.item.activateNextPrevTask(false);
+            }
+            // else > con ctrl escritorios
+            /*if (!ctrlPressed) {
                 if (windowInfoLoader.item.activeTaskItem
                         && !windowInfoLoader.item.activeTaskItem.isMinimized
                         && windowInfoLoader.item.activeTaskItem.isMaximized){
@@ -84,7 +86,7 @@ MouseArea {
             } else if (windowInfoLoader.item.activeTaskItem
                        && windowInfoLoader.item.activeTaskItem.isMaximized) {
                 windowInfoLoader.item.activeTaskItem.toggleMaximized();
-            }
+            }*/
         }
     }
 
@@ -92,7 +94,7 @@ MouseArea {
     //! send too many signals very fast. This way the signals per sec are limited.
     //! The user needs to have a steady normal scroll in order to not
     //! notice a annoying delay
-    Timer{
+    Timer {
         id: scrollDelayer
 
         interval: 200
diff --git a/package/contents/ui/ActionsTouchArea.qml b/package/contents/ui/ActionsTouchArea.qml
new file mode 100644
index 0000000..228a4a6
--- /dev/null
+++ b/package/contents/ui/ActionsTouchArea.qml
@@ -0,0 +1,66 @@
+/*
+ *  Copyright 2026 Sergio Blanco <seral79@gmail.com>
+ *
+ *  This file is part of applet-window-title
+ *
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import QtQuick
+
+import org.kde.plasma.plasmoid
+import org.kde.plasma.plasma5support as Plasma5Support
+
+MultiPointTouchArea {
+    property real x1a: 0.0
+    property real x1b: 0.0
+    property real x2: 0.0
+
+    onPressed: (points) => {
+        if (points[0].pressed) {
+            x1a = points[0].x;
+            x1b = 0.0;
+        }
+    }
+
+    onReleased: (points) => {
+        if (points.length === 1) {
+            x1b = points[0].x
+            if (Math.abs(x1a - x1b) > 40.0) {
+                if (x1a > x1b) {
+                    executable.exec("qdbus6 org.kde.kglobalaccel /component/kwin invokeShortcut Overview");
+                } else {
+                    executable.exec("qdbus6 org.kde.kglobalaccel /component/kwin invokeShortcut Expose");
+                }
+            }
+            x1a = 0.0;
+            x1b = 0.0;
+        }
+    }
+
+    TapHandler {
+        id: tapHandler
+
+        onTapCountChanged: {
+            if (existsWindowActive && tapCount === 2){
+                windowInfoLoader.item.toggleMaximized();
+            }
+        }
+    }
+
+    Plasma5Support.DataSource {
+        id: executable
+        engine: "executable"
+        connectedSources: []
+        onNewData: (source, data) => {
+            disconnectSource(source)
+        }
+
+        function exec(cmd) {
+            if (existsWindowActive) {
+                executable.connectSource(cmd)
+            }
+        }
+    }
+}
diff --git a/contents/ui/Broadcaster.qml b/package/contents/ui/Broadcaster.qml
similarity index 55%
rename from contents/ui/Broadcaster.qml
rename to package/contents/ui/Broadcaster.qml
index 06b8bfe..f75bdcd 100644
--- a/contents/ui/Broadcaster.qml
+++ b/package/contents/ui/Broadcaster.qml
@@ -17,12 +17,12 @@
 *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import QtQuick 2.7
+import QtQuick
 
-import org.kde.plasma.plasmoid 2.0
-import org.kde.plasma.core 2.0 as PlasmaCore
+import org.kde.plasma.plasmoid
+import org.kde.plasma.core as PlasmaCore
 
-Item{
+Item {
     id: broadcaster
 
     property bool hiddenFromBroadcast: false
@@ -49,14 +49,10 @@ Item{
         }
     }
 
-    Component.onDestruction: broadcoastCooperationRequest(false)
-
     onIsActiveChanged: {
         if (!isActive) {
             hiddenFromBroadcast = false;
         }
-
-        broadcoastCooperationRequest(isActive)
     }
 
     onCooperationEstablishedChanged: {
@@ -72,81 +68,10 @@ Item{
                 cooperation: plasmoid.configuration.sendActivateAppMenuCooperationFromEditMode
             };
 
-            latteBridge.actions.broadcastToApplet("org.kde.windowappmenu",
-                                                  "activateAppMenuCooperationFromEditMode",
-                                                  values);
-
             releaseSendActivateAppMenuCooperation.start();
         }
     }
 
-    function broadcoastCooperationRequest(enabled) {
-        if (latteBridge) {
-            var values = {
-                appletId: plasmoid.id,
-                cooperation: enabled
-            };
-            latteBridge.actions.broadcastToApplet("org.kde.windowappmenu", "setCooperation", values);
-        }
-    }
-
-    Connections {
-        target: latteBridge
-        onBroadcasted: {
-            var updateAppMenuCooperations = false;
-
-            if (broadcaster.cooperationEstablished) {
-                if (action === "setVisible") {
-                    if (value === true) {
-                        broadcaster.hiddenFromBroadcast = false;
-                    } else {
-                        broadcaster.hiddenFromBroadcast = true;
-                    }
-                } else if (action === "menuIsPresent") {
-                    broadcaster.menuIsPresent = value;
-                }
-            }
-
-            if (action === "isPresent") {
-                plasmoid.configuration.appMenuIsPresent = value;
-            } else if (action === "setCooperation") {
-                updateAppMenuCooperations = true;
-            } else if (action === "activateWindowTitleCooperationFromEditMode") {
-                plasmoid.configuration.showAppMenuOnMouseEnter = value.cooperation;
-                updateAppMenuCooperations = true;
-            }
-
-            if (updateAppMenuCooperations) {
-                var indexed = broadcaster.appMenusRequestCooperation.indexOf(value.appletId);
-                var isFiled = (indexed >= 0);
-
-                if (value.cooperation && !isFiled) {
-                    broadcaster.appMenusRequestCooperation.push(value.appletId);
-                    broadcaster.appMenusRequestCooperationCount++;
-                } else if (!value.cooperation && isFiled) {
-                    broadcaster.appMenusRequestCooperation.splice(indexed, 1);
-                    broadcaster.appMenusRequestCooperationCount--;
-                }
-            }
-        }
-    }
-
-    Timer{
-        id: broadcasterDelayer
-        interval: 5
-        onTriggered: {
-            if (latteBridge) {
-                if (broadcasterMouseArea.realContainsMouse && existsWindowActive) {
-                    broadcaster.hiddenFromBroadcast = true;
-                    latteBridge.actions.broadcastToApplet("org.kde.windowappmenu", "setVisible", true);
-                } else {
-                    broadcaster.hiddenFromBroadcast = false;
-                    latteBridge.actions.broadcastToApplet("org.kde.windowappmenu", "setVisible", false);
-                }
-            }
-        }
-    }
-
     Timer {
         id: releaseSendActivateAppMenuCooperation
         interval: 50
@@ -154,7 +79,7 @@ Item{
     }
 
     //!!!! MouseArea for Broadcaster
-    MouseArea{
+    MouseArea {
         id: broadcasterMouseArea
         anchors.fill: parent
         visible: broadcaster.cooperationEstablished && broadcaster.menuIsPresent
diff --git a/contents/ui/PlasmaTasksModel.qml b/package/contents/ui/PlasmaTasksModel.qml
similarity index 87%
rename from contents/ui/PlasmaTasksModel.qml
rename to package/contents/ui/PlasmaTasksModel.qml
index 895d531..baad6a7 100644
--- a/contents/ui/PlasmaTasksModel.qml
+++ b/package/contents/ui/PlasmaTasksModel.qml
@@ -17,10 +17,11 @@
 *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import QtQuick 2.7
-import QtQml.Models 2.2
+import QtQuick
+import QtQml.Models
 
-import org.kde.taskmanager 0.1 as TaskManager
+import org.kde.plasma.plasmoid
+import org.kde.taskmanager as TaskManager
 
 Item {
     id: plasmaTasksItem
@@ -31,7 +32,7 @@ Item {
         id: tasksModel
         sortMode: TaskManager.TasksModel.SortVirtualDesktop
         groupMode: TaskManager.TasksModel.GroupDisabled
-        screenGeometry: plasmoid.screenGeometry
+        screenGeometry: root.screenGeometry
         activity: activityInfo.currentActivity
         virtualDesktop: virtualDesktopInfo.currentDesktop
 
@@ -40,12 +41,12 @@ Item {
         filterByActivity: true
     }
 
-    Item{
+    Item {
         id: taskList
-        Repeater{
+        Repeater {
             id: tasksRepeater
             model: tasksModel
-            Item{
+            Item {
                 id: task
                 readonly property string appName: modelAppName !== "" ? modelAppName : discoveredAppName
                 readonly property bool isMinimized: IsMinimized === true ? true : false
@@ -63,10 +64,10 @@ Item {
                 readonly property var m: model
 
                 function cleanupTitle() {
-                    var text = display;
-                    var t = modelDisplay;
-                    var sep = t.lastIndexOf(" —– ");
-                    var spacer = 4;
+                    let text = display;
+                    let t = modelDisplay;
+                    let sep = t.lastIndexOf(" —– ");
+                    let spacer = 4;
 
                     if (sep === -1) {
                         sep = t.lastIndexOf(" -- ");
@@ -88,8 +89,8 @@ Item {
                         spacer = 3;
                     }
 
-                    var dTitle = "";
-                    var dAppName = "";
+                    let dTitle = "";
+                    let dAppName = "";
 
                     if (sep>-1) {
                         dTitle = text.substring(0, sep);
@@ -97,7 +98,7 @@ Item {
 
                         //if title starts with application name, swap the found records
                         if (dTitle.startsWith(modelAppName)) {
-                            var firstPart = dTitle;
+                            let firstPart = dTitle;
                             dTitle = discoveredAppName;
                             discoveredAppName = firstPart;
                         }
@@ -126,7 +127,7 @@ Item {
                     }
                 }
 
-                function modelIndex(){
+                function modelIndex() {
                     return tasksModel.makeModelIndex(index);
                 }
 
@@ -191,16 +192,16 @@ Item {
 
     //! Cycle Through Tasks
     function activateNextPrevTask(next) {
-        var taskIndexList = [];
-        var activeTaskIndex = tasksModel.activeTask;
+        let taskIndexList = [];
+        let activeTaskIndex = tasksModel.activeTask;
 
-        for (var i = 0; i < taskList.children.length - 1; ++i) {
-            var task = taskList.children[i];
-            var modelIndex = task.modelIndex(i);
+        for (let i = 0; i < taskList.children.length - 1; ++i) {
+            let task = taskList.children[i];
+            let modelIndex = task.modelIndex(i);
 
             if (task.m.IsLauncher !== true && task.m.IsStartup !== true) {
                 if (task.m.IsGroupParent === true) {
-                    for (var j = 0; j < tasksModel.rowCount(modelIndex); ++j) {
+                    for (let j = 0; j < tasksModel.rowCount(modelIndex); ++j) {
                         taskIndexList.push(tasksModel.makeModelIndex(i, j));
                     }
                 } else {
@@ -213,11 +214,10 @@ Item {
             return;
         }
 
-        var target = taskIndexList[0];
+        let target = taskIndexList[0];
 
-        for (var i = 0; i < taskIndexList.length; ++i) {
-            if (taskIndexList[i] === activeTaskIndex)
-            {
+        for (let i = 0; i < taskIndexList.length; ++i) {
+            if (taskIndexList[i] === activeTaskIndex) {
                 if (next && i < (taskIndexList.length - 1)) {
                     target = taskIndexList[i + 1];
                 } else if (!next) {
diff --git a/contents/ui/TitleLayout.qml b/package/contents/ui/TitleLayout.qml
similarity index 56%
rename from contents/ui/TitleLayout.qml
rename to package/contents/ui/TitleLayout.qml
index 5ab8e1e..8f1b01c 100644
--- a/contents/ui/TitleLayout.qml
+++ b/package/contents/ui/TitleLayout.qml
@@ -17,16 +17,16 @@
 *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import QtQuick 2.7
-import QtQml.Models 2.2
-import QtQuick.Layouts 1.1
-import QtQuick.Controls 1.4
+import QtQml.Models
+import QtQuick
+import QtQuick.Controls as QQC2
+import QtQuick.Layouts
 
-import org.kde.plasma.plasmoid 2.0
-import org.kde.plasma.core 2.0 as PlasmaCore
-import org.kde.plasma.components 2.0 as PlasmaComponents
+import org.kde.plasma.core as PlasmaCore
+import org.kde.kirigami as Kirigami
+import org.kde.plasma.plasmoid
 
-GridLayout{
+GridLayout {
     id: titleLayout
     rows: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? 1 : -1
     columns: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? -1 : 1
@@ -34,33 +34,23 @@ GridLayout{
     rowSpacing: 0
 
     property bool isUsedForMetrics: false
-    property bool exceedsAvailableSpace: false
-    property bool exceedsApplicationText: false
 
     property int applicationTextLength: {
-        var applicationLength = 0;
-
-        var midSpacerLength = midSpacer.visible ?
+        let midSpacerLength = midSpacer.visible ?
                     (plasmoid.formFactor === PlasmaCore.Types.Horizontal ? midSpacer.width : midSpacer.height) : 0;
+        let applicationLength = formatTxt.implicitWidth;
 
-        if (plasmoid.configuration.style === 0 /*Application*/
-                || plasmoid.configuration.style === 2) { /*ApplicationTitle*/
-            applicationLength = firstTxt.implicitWidth;
-        } else if (plasmoid.configuration.style === 3) { /*TitleApplication*/
-            applicationLength = lastTxt.implicitWidth + midSpacerLength;
-        }
-
-        var iconLength = mainIcon.visible ?
+        let iconLength = mainIcon.visible ?
                     (plasmoid.formFactor === PlasmaCore.Types.Horizontal ? mainIcon.width : mainIcon.height) : 0;
 
-        var subElements = plasmoid.formFactor === PlasmaCore.Types.Horizontal ?
+        let subElements = plasmoid.formFactor === PlasmaCore.Types.Horizontal ?
                     firstSpacer.width + iconLength + midSpacerLength + lastSpacer.width:
                     firstSpacer.height + iconLength + midSpacerLength + lastSpacer.height;
 
         return subElements + applicationLength;
     }
 
-    Item{
+    Item {
         id: firstSpacer
         Layout.minimumWidth: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? plasmoid.configuration.lengthFirstMargin : -1
         Layout.preferredWidth: Layout.minimumWidth
@@ -84,14 +74,14 @@ GridLayout{
 
         visible: plasmoid.configuration.showIcon
 
-        PlasmaCore.IconItem{
+        Kirigami.Icon {
             id: iconItem
             anchors.fill: parent
             anchors.topMargin: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? thickMargin : 0
             anchors.bottomMargin: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? thickMargin : 0
             anchors.leftMargin: plasmoid.formFactor === PlasmaCore.Types.Vertical ? thickMargin : 0
             anchors.rightMargin: plasmoid.formFactor === PlasmaCore.Types.Vertical ? thickMargin : 0
-            roundToIconSize: !root.isInLatte
+            roundToIconSize: true
             source: existsWindowActive ? activeTaskItem.icon : fullActivityInfo.icon
 
 
@@ -103,7 +93,7 @@ GridLayout{
         }
     }
 
-    Item{
+    Item {
         id: midSpacer
         Layout.minimumWidth: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? plasmoid.configuration.spacing : -1
         Layout.preferredWidth: Layout.minimumWidth
@@ -116,7 +106,7 @@ GridLayout{
         visible: mainIcon.visible && plasmoid.configuration.style !== 4 /*NoText*/
     }
 
-    Item{
+    Item {
         id: textsContainer
         Layout.minimumWidth: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? -1 : root.thickness
         Layout.preferredWidth: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? textRow.availableSpace : root.thickness
@@ -138,12 +128,12 @@ GridLayout{
             readonly property int availableSpace: {
                 if (!titleLayout.isUsedForMetrics) {
                     if (plasmoid.formFactor === PlasmaCore.Types.Horizontal) {
-                        var iconL = mainIcon.visible ? mainIcon.width : 0;
-                        var midL = midSpacer.visible ? midSpacer.width : 0;
+                        let iconL = mainIcon.visible ? mainIcon.width : 0;
+                        let midL = midSpacer.visible ? midSpacer.width : 0;
                         return titleLayout.width - firstSpacer.width - iconL - midL - lastSpacer.width;
                     } else {
-                        var iconL = mainIcon.visible ? mainIcon.height : 0;
-                        var midL = midSpacer.visible ? midSpacer.height : 0;
+                        let iconL = mainIcon.visible ? mainIcon.height : 0;
+                        let midL = midSpacer.visible ? midSpacer.height : 0;
                         return titleLayout.height - firstSpacer.height - iconL - midL - lastSpacer.height;
                     }
                 }
@@ -152,7 +142,7 @@ GridLayout{
             }
 
             readonly property int implicitWidths: {
-                return Math.ceil(firstTxt.implicitWidth) + Math.ceil(midTxt.implicitWidth) + Math.ceil(lastTxt.implicitWidth);
+                return Math.ceil(formatTxt.implicitWidth);
             }
 
             transformOrigin: Item.Center
@@ -167,110 +157,47 @@ GridLayout{
                 }
             }
 
-            Label{
-                id: firstTxt
-                Layout.fillWidth: elide === Text.ElideNone ? false : true
-                width: Text.ElideNone ? implicitWidth : -1
+            QQC2.Label {
+                id: formatTxt
                 verticalAlignment: Text.AlignVCenter
 
-                text: existsWindowActive ? root.firstTitleText : root.fallBackText
-                color: enforceLattePalette ? latteBridge.palette.textColor : theme.textColor
+                color: Kirigami.Theme.textColor
                 font.capitalization: plasmoid.configuration.capitalFont ? Font.Capitalize : Font.MixedCase
-                font.bold: plasmoid.configuration.boldFont
                 font.italic: plasmoid.configuration.italicFont
 
-                readonly property bool showsTitleText: plasmoid.configuration.style === 1 /*Title*/
-                                                       || plasmoid.configuration.style === 3 /*TitleApplication*/
-
-                readonly property bool showsApplicationText: plasmoid.configuration.style === 0 /*Application*/
-                                                             || plasmoid.configuration.style === 2 /*ApplicationTitle*/
-
-                elide: {
-                    if (plasmoid.configuration.style === 1 && titleLayout.exceedsAvailableSpace){ /*Title*/
-                        return Text.ElideMiddle;
-                    } else if (plasmoid.configuration.style === 3
-                               && activeTaskItem
-                               && activeTaskItem.appName !== activeTaskItem.title
-                               && titleLayout.exceedsAvailableSpace){ /*TitleApplication*/
-                        return Text.ElideMiddle;
-                    } else if (showsApplicationText && !isUsedForMetrics && exceedsApplicationText) {
-                        return Text.ElideMiddle;
-                    }
-
-                    return Text.ElideNone;
-                }
-
-                visible: {
-                    if (!isUsedForMetrics && showsTitleText && exceedsApplicationText) {
-                        return false;
-                    }
-
-                    return true;
-                }
-            }
-
-            Label{
-                id: midTxt
-                verticalAlignment: firstTxt.verticalAlignment
-                width: implicitWidth
-                visible: !exceedsApplicationText && text !== ""
-
                 text: {
-                    if (!existsWindowActive) {
-                        return "";
-                    }
-
-                    if (plasmoid.configuration.style === 2 || plasmoid.configuration.style === 3){ /*ApplicationTitle*/ /*OR*/ /*TitleApplication*/
-                        if (activeTaskItem.appName !== activeTaskItem.title && activeTaskItem.appName !== "" && activeTaskItem.title !== "") {
-                            return " – ";
+                    function midTxt() {
+                        if (!existsWindowActive) {
+                            return "";
                         }
-                    }
-
-                    return "";
-                }
-
-                color: firstTxt.color
-                font.capitalization: firstTxt.font.capitalization
-                font.bold: firstTxt.font.bold
-                font.italic: firstTxt.font.italic
-            }
-
-            Label{
-                id: lastTxt
-                Layout.fillWidth: elide === Text.ElideNone ? false : true
-                width: Text.ElideNone ? implicitWidth : -1
-                verticalAlignment: firstTxt.verticalAlignment
-
-                text: existsWindowActive ? root.lastTitleText : ""
-
-                color: firstTxt.color
-                font.capitalization: firstTxt.font.capitalization
-                font.bold: firstTxt.font.bold
-                font.italic: firstTxt.font.italic
 
-                visible: text !== "" && !(showsTitleText && exceedsApplicationText)
-
-                readonly property bool showsTitleText: plasmoid.configuration.style === 2 /*ApplicationTitle*/
+                        if (plasmoid.configuration.style === 2 ||
+                            plasmoid.configuration.style === 3) { /*ApplicationTitle*/ /*OR*/ /*TitleApplication*/
+                            if (activeTaskItem.appName !== activeTaskItem.title &&
+                                activeTaskItem.appName !== "" &&
+                                activeTaskItem.title !== "") {
+                                return " – ";
+                            }
+                        }
 
+                        return "";
+                    };
 
-                elide: {
-                    if (activeTaskItem
-                            && activeTaskItem.appName !== activeTaskItem.title
-                            && plasmoid.configuration.style === 2 /*ApplicationTitle*/
-                            && titleLayout.exceedsAvailableSpace){  /*AND is shown*/
-                        return Text.ElideMiddle;
-                    } else if(plasmoid.configuration.style === 3 /*TitleApplication*/
-                              /*&& exceedsApplicationText*/) {
-                        return Text.ElideNone;
-                    }
+                    let firstTxt = existsWindowActive ? root.firstTitleText : root.fallBackText;
+                    let medTxt = midTxt();
+                    let lastTxt = existsWindowActive ? root.lastTitleText : "";
+                    let htmlFirstTxt = plasmoid.configuration.boldFont & medTxt !== "" ? "<b>" + firstTxt + "</b>" : firstTxt;
 
-                    return Text.ElideMiddle;
+                    return htmlFirstTxt + medTxt + lastTxt;
                 }
+                Layout.preferredWidth: root.textMaximumLength
+                elide: Text.ElideMiddle
             }
+
         }
     }
 
-    Item{
+    Item {
         id: lastSpacer
         Layout.minimumWidth: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? plasmoid.configuration.lengthLastMargin : -1
         Layout.preferredWidth: Layout.minimumWidth
@@ -281,5 +208,3 @@ GridLayout{
         Layout.maximumHeight: Layout.minimumHeight
     }
 }
-
-
diff --git a/package/contents/ui/config/ConfigAppearance.qml b/package/contents/ui/config/ConfigAppearance.qml
new file mode 100644
index 0000000..ca86de4
--- /dev/null
+++ b/package/contents/ui/config/ConfigAppearance.qml
@@ -0,0 +1,355 @@
+/*
+*  Copyright 2018 Michail Vourlakos <mvourlakos@gmail.com>
+*
+*  This file is part of applet-window-title
+*
+*  Latte-Dock 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.
+*
+*  Latte-Dock 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, see <http://www.gnu.org/licenses/>.
+*/
+
+import QtQuick
+import QtQuick.Controls as QQC2
+import QtQuick.Layouts
+
+import org.kde.plasma.core as PlasmaCore
+import org.kde.kirigami as Kirigami
+
+Kirigami.ScrollablePage {
+    id: appearancePage
+
+    property alias cfg_boldFont: boldChk.checked
+    property alias cfg_italicFont: italicChk.checked
+    property alias cfg_capitalFont: capitalChk.checked
+    property alias cfg_showIcon: showIconChk.checked
+    property alias cfg_iconFillThickness: iconFillChk.checked
+    property alias cfg_iconSize: iconSizeSpn.value
+    property alias cfg_lengthPolicy: appearancePage.selectedLengthPolicy
+    property alias cfg_spacing: spacingSpn.value
+    property alias cfg_style: appearancePage.selectedStyle
+    property alias cfg_lengthFirstMargin: lengthFirstSpn.value
+    property alias cfg_lengthLastMargin: lengthLastSpn.value
+    property alias cfg_lengthMarginsLock: lockItem.locked
+    property alias cfg_fixedLength: fixedLengthSlider.value
+    property alias cfg_maximumLength: maxLengthSlider.value
+
+    // used as bridge to communicate properly between configuration and ui
+    property int selectedLengthPolicy
+    property int selectedStyle
+
+    // used from the ui
+    readonly property int minimumWidth: 80
+    readonly property real maxWidth: 0.5 * appearancePage.width
+    property var setLabelColor: (function() {
+        if (appearancePage.selectedStyle === 4) {
+            return Kirigami.Theme.disabledTextColor;
+        } else {
+            return Kirigami.Theme.textColor;
+        }
+    })
+
+    onSelectedStyleChanged: {
+        if (selectedStyle === 4) { /*NoText*/
+            showIconChk.checked = true;
+        }
+    }
+
+    ColumnLayout {
+        id:mainColumn
+        spacing: Kirigami.Units.largeSpacing
+        Layout.fillWidth: true
+
+        Kirigami.FormLayout {
+            QQC2.ComboBox {
+                Kirigami.FormData.label: i18n("Text style:")
+
+                id: styleCmb
+                model: [
+                    i18n("Application"),
+                    i18n("Title"),
+                    i18n("Application - Title"),
+                    i18n("Title - Application"),
+                    i18n("Do not show any text")
+                ]
+                Component.onCompleted: currentIndex = plasmoid.configuration.style;
+                onCurrentIndexChanged: appearancePage.selectedStyle = currentIndex
+            }
+
+            Item {
+                Kirigami.FormData.isSection: true
+            }
+
+            QQC2.CheckBox {
+                id: showIconChk
+                Kirigami.FormData.label: i18n("Icon:")
+                text: i18n("Show when available")
+                enabled: appearancePage.selectedStyle !== 4 /*NoText*/
+            }
+
+            QQC2.CheckBox {
+                id: iconFillChk
+                text: i18n("Fill thickness")
+                enabled: showIconChk.checked
+            }
+
+            RowLayout {
+                enabled: !iconFillChk.checked
+
+                QQC2.SpinBox {
+                    id: iconSizeSpn
+                    from: 16
+                    to: 128
+                    valueFromText: function(text, locale) {
+                        return parseInt(text);
+                    }
+                    textFromValue: function(value, locale) {
+                        return i18np("%1 px.", "%1 pixels", value);
+                    }
+                }
+
+                QQC2.Label {
+                    id: iconSizeSpnLbl
+                    color: {
+                        if (iconFillChk.checked) {
+                            Kirigami.Theme.disabledTextColor
+                        } else {
+                            Kirigami.Theme.textColor
+                        }
+                    }
+                    text: i18n("maximum")
+                }
+            }
+
+            Item {
+                Kirigami.FormData.isSection: true
+            }
+
+            ColumnLayout {
+                enabled: appearancePage.selectedStyle !== 4 /*NoText*/
+
+                QQC2.CheckBox {
+                    id: boldChk
+                    text: i18n("Bold")
+                }
+
+                QQC2.CheckBox {
+                    id: italicChk
+                    text: i18n("Italic")
+                }
+
+                QQC2.CheckBox {
+                    id: capitalChk
+                    text: i18n("First letters capital")
+                }
+            }
+
+            Item {
+                Kirigami.FormData.isSection: true
+            }
+
+            QQC2.ComboBox {
+                Kirigami.FormData.label: i18n("Length:")
+
+                id: lengthCmb
+                enabled : appearancePage.selectedStyle !== 4 /*NoText*/
+                model: [
+                    i18n("Based on contents"),
+                    i18n("Fixed size"),
+                    i18n("Maximum"),
+                    i18n("Fill available space"),
+                ]
+                Component.onCompleted: currentIndex = plasmoid.configuration.lengthPolicy
+                onCurrentIndexChanged: appearancePage.selectedLengthPolicy = currentIndex
+            }
+
+            Rectangle {
+                visible: lengthCmb.currentIndex === 1 /*Fixed Length Policy*/
+                implicitWidth: appearancePage.maxWidth
+                implicitHeight: lengthCmb.height
+                color: "transparent"
+
+                RowLayout {
+                    QQC2.Slider {
+                        id: fixedLengthSlider
+                        Layout.minimumWidth: lengthCmb.implicitWidth
+                        Layout.preferredWidth: Layout.minimumWidth
+                        Layout.maximumWidth: Layout.minimumWidth
+
+                        enabled : appearancePage.selectedStyle !== 4 /*NoText*/
+                        from: 24
+                        to: 1500
+                        stepSize: 4
+                        onValueChanged: {
+                            fixedLengthLbl.text = value + " px.";
+                        }
+                    }
+
+                    QQC2.Label {
+                        id: fixedLengthLbl
+                        color: appearancePage.setLabelColor()
+                        text: i18n("maximum")
+                    }
+                }
+            }
+
+            Rectangle {
+                visible: lengthCmb.currentIndex === 2 /*Maximum Length Policy*/
+                implicitWidth: appearancePage.maxWidth
+                implicitHeight: lengthCmb.height
+                color: "transparent"
+
+                RowLayout {
+                    QQC2.Slider {
+                        id: maxLengthSlider
+                        Layout.minimumWidth: lengthCmb.implicitWidth
+                        Layout.preferredWidth: Layout.minimumWidth
+                        Layout.maximumWidth: Layout.minimumWidth
+
+                        enabled : appearancePage.selectedStyle !== 4 /*NoText*/
+                        from: 24
+                        to: 1500
+                        stepSize: 4
+                        onValueChanged: {
+                            maxLengthLbl.text = value + " px.";
+                        }
+                    }
+
+                    QQC2.Label {
+                        id: maxLengthLbl
+                        color: appearancePage.setLabelColor()
+                        text: i18n("maximum")
+                    }
+                }
+            }
+
+            QQC2.Label {
+                Layout.minimumWidth: lengthCmb.width - 10
+                Layout.preferredWidth: appearancePage.maxWidth
+                Layout.maximumWidth: Layout.preferredWidth
+
+                color: appearancePage.setLabelColor()
+                font.italic: true
+                wrapMode: Text.WordWrap
+                text: {
+                    if (lengthCmb.currentIndex === 0 /*Contents*/){
+                        return i18n("Contents provide an exact size to be used at all times.")
+                    } else if (lengthCmb.currentIndex === 1 /*Fixed*/) {
+                        return i18n("Length slider decides the exact size to be used at all times.");
+                    } else if (lengthCmb.currentIndex === 2 /*Maximum*/) {
+                        return i18n("Contents provide the preferred size and length slider its highest value.");
+                    } else { /*Fill*/
+                        return i18n("All available space is filled at all times.");
+                    }
+                }
+            }
+
+            Item {
+                Kirigami.FormData.isSection: true
+            }
+
+            QQC2.SpinBox {
+                Kirigami.FormData.label: i18n("Spacing:")
+
+                id: spacingSpn
+                from: 0
+                to: 36
+                enabled: showIconChk.checked && appearancePage.selectedStyle !== 4 /*NoText*/
+                valueFromText: function(text, locale) {
+                    return parseInt(text);
+                }
+                textFromValue: function(value, locale) {
+                    return i18np("%1 px.", "%1 pixels", value);
+                }
+            }
+        }//FormLayout
+
+        ColumnLayout {
+            id: visualSettingsColumn
+            readonly property int lockItemWidth: 40
+
+            GridLayout {
+                id: visualSettingsGroup2
+                columns: 3
+                rows: 2
+                rowSpacing: mainColumn.spacing
+
+                property int lockerHeight: firstLengthLbl.height + rowSpacing * 0.5
+
+                QQC2.Label {
+                    id: firstLengthLbl
+                    Layout.minimumWidth: 0.5 * appearancePage.maxWidth - visualSettingsColumn.spacing * 0.5
+                    text: plasmoid.configuration.formFactor === PlasmaCore.Types.Horizontal ?
+                                                                i18n("Left margin:") :
+                                                                i18n("Top margin:")
+                    horizontalAlignment: Text.AlignRight
+                }
+
+                QQC2.SpinBox {
+                    id: lengthFirstSpn
+                    from: 0
+                    to: 24
+                    valueFromText: function(text, locale) {
+                        return parseInt(text);
+                    }
+                    textFromValue: function(value, locale) {
+                        return i18np("%1 px.", "%1 pixels", value);
+                    }
+
+                    property int lastValue: -1
+
+                    onValueModified: {
+                        if (lockItem.locked) {
+                            let step = value - lastValue > 0 ? 1 : -1;
+                            lastValue = value;
+                            lengthLastSpn.value += step;
+                        }
+                    }
+
+                    Component.onCompleted: lastValue = plasmoid.configuration.lengthFirstMargin;
+                }
+
+                LockItem {
+                    id: lockItem
+                    Layout.minimumWidth: visualSettingsColumn.lockItemWidth
+                    Layout.maximumWidth: visualSettingsColumn.lockItemWidth
+                    Layout.alignment: Qt.AlignTop | Qt.AlignLeft
+                    Layout.minimumHeight: visualSettingsGroup2.lockerHeight
+                    Layout.maximumHeight: Layout.minimumHeight
+                    Layout.topMargin: (firstLengthLbl.height + visualSettingsColumn.spacing) / 2
+                    Layout.rowSpan: 2
+                    iconWidth: visualSettingsGroup2.lockerHeight
+                }
+
+                QQC2.Label {
+                    Layout.minimumWidth: firstLengthLbl.Layout.minimumWidth
+                    text: plasmoid.configuration.formFactor === PlasmaCore.Types.Horizontal ?
+                                                                i18n("Right margin:") :
+                                                                i18n("Bottom margin:")
+                    horizontalAlignment: Text.AlignRight
+                }
+
+                QQC2.SpinBox {
+                    id: lengthLastSpn
+                    from: 0
+                    to: 24
+                    enabled: !lockItem.locked
+                    valueFromText: function(text, locale) {
+                        return parseInt(text);
+                    }
+                    textFromValue: function(value, locale) {
+                        return i18np("%1 px.", "%1 pixels", value);
+                    }
+                }
+            }
+        } // ColumnLayout
+    }//mainColumn
+}
diff --git a/contents/ui/config/ConfigBehavior.qml b/package/contents/ui/config/ConfigBehavior.qml
similarity index 53%
rename from contents/ui/config/ConfigBehavior.qml
rename to package/contents/ui/config/ConfigBehavior.qml
index 5fca01e..e9c776d 100644
--- a/contents/ui/config/ConfigBehavior.qml
+++ b/package/contents/ui/config/ConfigBehavior.qml
@@ -17,21 +17,19 @@
 *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import QtQuick 2.9
-import QtQuick.Controls 1.0
-import QtQuick.Layouts 1.0
+import QtQuick
+import QtQuick.Controls as QQC2
+import QtQuick.Layouts
 
-import org.kde.plasma.core 2.0 as PlasmaCore
+import org.kde.plasma.core as PlasmaCore
+import org.kde.kirigami as Kirigami
 
-import org.kde.kirigami 2.4 as Kirigami
-
-Item {
+Kirigami.ScrollablePage {
     id: behaviorPage
 
     property alias cfg_filterByScreen: filterByScreenChk.checked
     property alias cfg_filterActivityInfo: filterActivityChk.checked
 
-    property alias cfg_showAppMenuOnMouseEnter: showAppMenuChk.checked
     property alias cfg_showTooltip: showTooltip.checked
     property alias cfg_actionScrollMinimize: cycleMinimizeChk.checked
 
@@ -44,88 +42,53 @@ Item {
     property var selectedMatches: []
     property var selectedReplacements: []
 
-    // used from the ui
-    readonly property real centerFactor: 0.3
-    readonly property int minimumWidth: 220
-
-    ColumnLayout {
+    Kirigami.FormLayout {
         id:mainColumn
-        spacing: units.largeSpacing
-        width:parent.width - anchors.leftMargin * 2
-        height: parent.height
-        anchors.top: parent.top
-        anchors.left: parent.left
-        anchors.leftMargin: 2
-
-        GridLayout {
-            columns: 2
-
-            Label{
-                Layout.minimumWidth: Math.max(centerFactor * behaviorPage.width, minimumWidth)
-                text: i18n("Filters:")
-                horizontalAlignment: Text.AlignRight
-            }
 
-            CheckBox{
-                id: filterByScreenChk
-                text: i18n("Show only window information from current screen")
-            }
+        QQC2.CheckBox {
+            id: filterByScreenChk
+            Kirigami.FormData.label: i18n("Filters:")
+            text: i18n("Show only window information from current screen")
+            enabled: plasmoid.configuration.style !== 4 /*NoText*/
         }
 
-        GridLayout {
-            columns: 2
+        Item {
+            Kirigami.FormData.isSection: true
+        }
 
-            Label{
-                Layout.minimumWidth: Math.max(centerFactor * behaviorPage.width, minimumWidth)
-                text: i18n("Mouse:")
-                horizontalAlignment: Text.AlignRight
-            }
+        ColumnLayout {
+            Kirigami.FormData.label: i18n("Mouse:")
 
-            CheckBox{
+            QQC2.CheckBox {
                 id: showTooltip
                 text: i18n("Show tooltip on hover")
-                enabled: showAppMenuChk.visible && !showAppMenuChk.checked
-            }
-
-            Label{
-                visible: showAppMenuChk.visible
-                enabled: showAppMenuChk.enabled
-            }
-
-            CheckBox{
-                id: showAppMenuChk
-                text: i18n("Show Window AppMenu applet on enter")
-                visible: plasmoid.configuration.containmentType === 2 /*Latte Containment*/
-                enabled: plasmoid.configuration.appMenuIsPresent
-            }
-
-            Label{
-                visible: cycleMinimizeChk.visible
+                enabled: plasmoid.configuration.style !== 4 /*NoText*/
             }
 
-            CheckBox {
+            QQC2.CheckBox {
                 id: cycleMinimizeChk
-                text: i18n("Scroll to cycle and minimize through your tasks")
-                visible: plasmoid.configuration.containmentType === 1 /*Plasma Containment*/
+                text: i18n("Scroll to cycle through your tasks")
             }
         }
 
+        Item {
+            Kirigami.FormData.isSection: true
+        }
+
         Kirigami.InlineMessage {
             id: inlineMessage
             Layout.fillWidth: true
             Layout.bottomMargin: 5
 
             type: Kirigami.MessageType.Warning
-            text: cfg_showAppMenuOnMouseEnter ?
-                      i18n("Would you like <b>also to activate</b> that behavior to surrounding Window AppMenu?") :
-                      i18n("Would you like <b>also to deactivate</b> that behavior to surrounding Window AppMenu?")
+            text: i18n("Would you like <b>also to deactivate</b> that behavior to surrounding Window AppMenu?")
 
             actions: [
                 Kirigami.Action {
                     icon.name: "dialog-yes"
                     text: i18n("Yes")
                     onTriggered: {
-                        plasmoid.configuration.sendActivateAppMenuCooperationFromEditMode = cfg_showAppMenuOnMouseEnter;
+                        plasmoid.configuration.sendActivateAppMenuCooperationFromEditMode = false;
                         inlineMessage.visible = false;
                     }
                 },
@@ -138,14 +101,9 @@ Item {
                 }
             ]
 
-            readonly property bool showWindowAppMenuTouched: showAppMenuChk.checked !== plasmoid.configuration.showAppMenuOnMouseEnter
+            readonly property bool showWindowAppMenuTouched: false
 
             onShowWindowAppMenuTouchedChanged: {
-                if (plasmoid.configuration.containmentType !== 2 /*Latte Containment*/) {
-                    visible = false;
-                    return;
-                }
-
                 if (showWindowAppMenuTouched){
                     inlineMessage.visible = true;
                 } else {
@@ -154,22 +112,15 @@ Item {
             }
         }
 
-        GridLayout {
-            columns: 2
-            Label{
-                Layout.minimumWidth: Math.max(centerFactor * behaviorPage.width, minimumWidth)
-                text: i18n("Placeholder:")
-                horizontalAlignment: Text.AlignRight
-            }
+        ColumnLayout {
+            Kirigami.FormData.label: i18n("Placeholder:")
 
-            CheckBox{
+            QQC2.CheckBox {
                 id: filterActivityChk
                 text: i18n("Show activity information")
             }
 
-            Label{}
-
-            TextField {
+            QQC2.TextField {
                 id: placeHolder
                 text: plasmoid.configuration.placeHolder
                 Layout.minimumWidth: substitutionsBtn.width * 1.5
@@ -180,16 +131,14 @@ Item {
             }
         }
 
-        GridLayout{
-            columns: 2
+        Item {
+            Kirigami.FormData.isSection: true
+        }
 
-            Label{
-                Layout.minimumWidth: Math.max(centerFactor * behaviorPage.width, minimumWidth)
-                text: i18n("Application name:")
-                horizontalAlignment: Text.AlignRight
-            }
+        ColumnLayout {
+            Kirigami.FormData.label: i18n("Application name:")
 
-            Button{
+            QQC2.Button {
                 id: substitutionsBtn
                 checkable: true
                 checked: subsSlidingBox.shown
@@ -215,5 +164,4 @@ Item {
             Layout.fillWidth: true
         }
     }
-
 }
diff --git a/contents/ui/config/LockItem.qml b/package/contents/ui/config/LockItem.qml
similarity index 74%
rename from contents/ui/config/LockItem.qml
rename to package/contents/ui/config/LockItem.qml
index 7732e40..8436a12 100644
--- a/contents/ui/config/LockItem.qml
+++ b/package/contents/ui/config/LockItem.qml
@@ -17,33 +17,32 @@
 *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import QtQuick 2.9
-import QtQuick.Controls 1.3
-import QtQuick.Layouts 1.0
+import QtQuick
+import QtQuick.Controls as QQC2
+import QtQuick.Layouts
 
-import org.kde.plasma.core 2.0 as PlasmaCore
-import org.kde.kquickcontrolsaddons 2.0 as KQuickAddons
+import org.kde.kirigami as Kirigami
 
-Item{
+Item {
     id: main
 
     property bool locked: true
+    property int iconWidth: 24
 
-    readonly property int verticalSubHeight: height - (button.height/2)
+    readonly property int verticalSubHeight: height - (iconWidth * 0.5)
 
-    ColumnLayout{
+    ColumnLayout {
         id: column
         spacing: 0
         opacity: locked ? 1 : 0.5
 
         Rectangle{
             id: subRectTop
-            Layout.minimumWidth: button.width/2 + Layout.minimumHeight/2
+            Layout.minimumWidth: button.width * 0.5 + Layout.minimumHeight * 0.5
             Layout.minimumHeight: 3
             Layout.maximumWidth: Layout.minimumWidth
             Layout.maximumHeight: Layout.minimumHeight
-
-            color: palette.text
+            color: Kirigami.Theme.textColor
         }
 
         Rectangle {
@@ -52,14 +51,16 @@ Item{
             Layout.minimumHeight: verticalSubHeight
             Layout.maximumWidth: Layout.minimumWidth
             Layout.maximumHeight: Layout.minimumHeight
-            color: palette.text
+            color: Kirigami.Theme.textColor
         }
 
-        KQuickAddons.QIconItem{
+        Kirigami.Icon {
             id: button
-            width: 24
-            height: 24
-            icon: locked ? "lock" : "unlock"
+            source: locked ? "lock" : "unlock"
+            Layout.minimumWidth: iconWidth
+            Layout.minimumHeight: iconWidth
+            Layout.maximumWidth: Layout.minimumWidth
+            Layout.maximumHeight: Layout.minimumHeight
         }
 
         Rectangle {
@@ -68,7 +69,7 @@ Item{
             Layout.minimumHeight: verticalSubHeight
             Layout.maximumWidth: Layout.minimumWidth
             Layout.maximumHeight: Layout.minimumHeight
-            color: palette.text
+            color: Kirigami.Theme.textColor
         }
 
         Rectangle{
@@ -76,7 +77,7 @@ Item{
             Layout.minimumHeight: subRectTop.Layout.minimumHeight
             Layout.maximumWidth: Layout.minimumWidth
             Layout.maximumHeight: Layout.minimumHeight
-            color: palette.text
+            color: Kirigami.Theme.textColor
         }
     }
 
diff --git a/contents/ui/config/SlidingBox.qml b/package/contents/ui/config/SlidingBox.qml
similarity index 83%
rename from contents/ui/config/SlidingBox.qml
rename to package/contents/ui/config/SlidingBox.qml
index cb34cd0..ab30df0 100644
--- a/contents/ui/config/SlidingBox.qml
+++ b/package/contents/ui/config/SlidingBox.qml
@@ -17,19 +17,19 @@
 *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import QtQuick 2.9
-import QtQuick.Controls 1.0
-import QtGraphicalEffects 1.0
-import QtQuick.Controls 2.2 as Controls22
-import QtQuick.Layouts 1.0
+import QtQuick
+import QtQuick.Controls as QQC2
+import QtQuick.Effects
+import QtQuick.Layouts
 
-import org.kde.plasma.core 2.0 as PlasmaCore
+import org.kde.plasma.core as PlasmaCore
+import org.kde.kirigami as Kirigami
 
-Item{
+Item {
     id: box
     clip: true
 
-    x: parent.width/2 - width/2
+    x: parent.width*0.5 - width*0.5
     /*y: slideOutFrom === PlasmaCore.Types.BottomEdge ? 0
     height: 0*/
     opacity: 0
@@ -39,8 +39,8 @@ Item{
 
     property bool shown: false
 
-    readonly property int availableWidth: width - 2*12 - 2*units.largeSpacing
-    readonly property int availableHeight: contentItem.childrenRect.height + 2*units.largeSpacing
+    readonly property int availableWidth: width - 2*12 - 2*Kirigami.Units.largeSpacing
+    readonly property int availableHeight: contentItem.childrenRect.height + 2*Kirigami.Units.largeSpacing
     readonly property int maximumHeight: availableHeight + 2*12
 
     onContentItemChanged: {
@@ -115,12 +115,10 @@ Item{
             radius: 1
 
             layer.enabled: true
-            layer.effect: DropShadow {
-                id: shadowElement
-                radius: 12
-                fast: true
-                samples: 2 * radius
-                color: palette.shadow
+            layer.effect: MultiEffect {
+                shadowEnabled: true
+                shadowBlur: 0.5
+                shadowColor: Kirigami.Theme.textColor
             }
         }
     }
diff --git a/contents/ui/config/SubstitutionsPopup.qml b/package/contents/ui/config/SubstitutionsPopup.qml
similarity index 78%
rename from contents/ui/config/SubstitutionsPopup.qml
rename to package/contents/ui/config/SubstitutionsPopup.qml
index 1acbe62..6e39cc9 100644
--- a/contents/ui/config/SubstitutionsPopup.qml
+++ b/package/contents/ui/config/SubstitutionsPopup.qml
@@ -17,12 +17,11 @@
 *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import QtQuick 2.9
-import QtQuick.Controls 1.0
-import QtQuick.Controls 2.2 as Controls22
-import QtQuick.Layouts 1.0
+import QtQuick
+import QtQuick.Controls as QQC2
+import QtQuick.Layouts
 
-import org.kde.plasma.core 2.0 as PlasmaCore
+import org.kde.kirigami as Kirigami
 
 import "../../tools/Tools.js" as Tools
 
@@ -33,23 +32,23 @@ SlidingBox {
     property QtObject page: null
 
     function textAreaToList(text) {
-        var res = text.split("\n");
+        let res = text.split("\n");
         return res;
     }
 
     function listToText(text) {
-        var res = text.join("\n");
+        let res = text.join("\n");
         return res;
     }
 
-    contentItem: ColumnLayout{
+    contentItem: ColumnLayout {
         id: mainColumn
         width: popup.availableWidth
-        anchors.margins: units.largeSpacing
+        anchors.margins: Kirigami.Units.largeSpacing
         anchors.centerIn: parent
-        spacing: units.largeSpacing
+        spacing: Kirigami.Units.largeSpacing
 
-        Label{
+        QQC2.Label {
             Layout.fillWidth: true
             horizontalAlignment: Qt.AlignHCenter
             font.bold: true
@@ -58,19 +57,22 @@ SlidingBox {
 
         GridLayout {
             columns: 2
-            Label{
+
+            QQC2.Label{
                 Layout.fillWidth: true
                 horizontalAlignment: Qt.AlignHCenter
                 font.bold: true
                 text: "Match"
             }
-            Label{
+
+            QQC2.Label {
                 Layout.fillWidth: true
                 horizontalAlignment: Qt.AlignHCenter
                 font.bold: true
                 text: "Replace with"
             }
-            TextArea{
+
+            QQC2.TextArea {
                 id: textAreaMatch
 
                 Layout.fillWidth: true
@@ -79,11 +81,12 @@ SlidingBox {
 
                 onTextChanged: page.selectedMatches = popup.textAreaToList(text)
 
-                flickableItem.onContentYChanged: {
-                  textAreaReplace.flickableItem.contentY = flickableItem.contentY
+                Flickable {
+                    onContentYChanged: textAreaReplace.flickableItem.contentY = flickableItem.contentY
                 }
             }
-            TextArea{
+
+            QQC2.TextArea {
                 id: textAreaReplace
 
                 Layout.fillWidth: true
@@ -91,13 +94,13 @@ SlidingBox {
                 text: listToText(page.selectedReplacements)
                 onTextChanged: page.selectedReplacements = popup.textAreaToList(text)
 
-                flickableItem.onContentYChanged: {
-                  textAreaMatch.flickableItem.contentY = flickableItem.contentY
+                Flickable {
+                    onContentYChanged:  textAreaMatch.flickableItem.contentY = flickableItem.contentY
                 }
             }
         }
 
-        Label{
+        QQC2.Label {
             Layout.fillWidth: true
             horizontalAlignment: Qt.AlignHCenter
             font.italic: true
diff --git a/contents/ui/main.qml b/package/contents/ui/main.qml
similarity index 61%
rename from contents/ui/main.qml
rename to package/contents/ui/main.qml
index 91a4cd9..c316a88 100644
--- a/contents/ui/main.qml
+++ b/package/contents/ui/main.qml
@@ -17,20 +17,19 @@
 *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import QtQuick 2.7
-import QtQuick.Layouts 1.1
-import QtQuick.Controls 1.4
+import QtQuick
+import QtQuick.Layouts
 
-import org.kde.plasma.plasmoid 2.0
-import org.kde.plasma.core 2.0 as PlasmaCore
-import org.kde.plasma.components 2.0 as PlasmaComponents
-import org.kde.taskmanager 0.1 as TaskManager
-
-import org.kde.activities 0.1 as Activities
+import org.kde.activities as Activities
+import org.kde.kirigami as Kirigami
+import org.kde.plasma.components as PlasmaComponents
+import org.kde.plasma.core as PlasmaCore
+import org.kde.plasma.plasmoid
+import org.kde.taskmanager as TaskManager
 
 import "../tools/Tools.js" as Tools
 
-Item {
+PlasmoidItem {
     id: root
     clip: true
 
@@ -47,7 +46,7 @@ Item {
     Layout.preferredHeight: plasmoid.formFactor === PlasmaCore.Types.Vertical ? preferredLength : -1
     Layout.maximumHeight: plasmoid.formFactor === PlasmaCore.Types.Vertical ? maximumLength : -1
 
-    Plasmoid.preferredRepresentation: Plasmoid.fullRepresentation
+    preferredRepresentation: fullRepresentation
     Plasmoid.onFormFactorChanged: plasmoid.configuration.formFactor = plasmoid.formFactor;
 
     Plasmoid.status: {
@@ -64,9 +63,8 @@ Item {
     readonly property bool inMaximumLengthMode:  plasmoid.configuration.lengthPolicy === 2 /*Maximum Length Policy*/
     readonly property bool inFillLengthMode: plasmoid.configuration.lengthPolicy === 3 /*Fill Length Policy*/
 
-    readonly property bool inEditMode: plasmoid.userConfiguring || latteInEditMode
+    readonly property bool inEditMode: plasmoid.userConfiguring
 
-    readonly property int containmentType: plasmoid.configuration.containmentType
     readonly property int thickness: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? root.height : root.width
 
     readonly property int minimumLength: {
@@ -117,7 +115,20 @@ Item {
         }
     }
 
-    readonly property int implicitTitleLength: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? metricsContents.width : metricsContents.height
+    readonly property int textMaximumLength: {
+        let pMaximumLength = !inFillLengthMode ?
+                                 root.maximumLength :
+                                 (plasmoid.formFactor === PlasmaCore.Types.Horizontal ? root.width : root.height);
+        let iconSize = plasmoid.configuration.showIcon ? plasmoid.configuration.iconSize : 0;
+        let margins = plasmoid.configuration.lengthFirstMargin + plasmoid.configuration.lengthLastMargin;
+        return pMaximumLength > 0 ?
+            pMaximumLength - plasmoid.configuration.spacing - iconSize - margins :
+            0;
+    }
+
+    readonly property int implicitTitleLength: plasmoid.formFactor === PlasmaCore.Types.Horizontal ?
+        metricsContents.width :
+        metricsContents.height
 
     readonly property bool existsWindowActive: windowInfoLoader.item && windowInfoLoader.item.existsWindowActive
     readonly property bool isActiveWindowPinned: existsWindowActive && activeTaskItem.isOnAllDesktops
@@ -128,6 +139,8 @@ Item {
     property string fallBackText: {
         if (!plasmoid.configuration.filterActivityInfo) {
             return plasmoid.configuration.placeHolder;
+        } else if (fullActivityInfo.name === "") {
+            return "openSUSE"
         } else {
             return fullActivityInfo.name;
         }
@@ -138,18 +151,18 @@ Item {
             return "";
         }
 
-        if (plasmoid.configuration.style === 0){ /*Application*/
+        if (plasmoid.configuration.style === 0) { /*Application*/
             return Tools.applySubstitutes(activeTaskItem.appName);
-        } else if (plasmoid.configuration.style === 1){ /*Title*/
+        } else if (plasmoid.configuration.style === 1) { /*Title*/
             return activeTaskItem.title;
-        } else if (plasmoid.configuration.style === 2){ /*ApplicationTitle*/
+        } else if (plasmoid.configuration.style === 2) { /*ApplicationTitle*/
             return Tools.applySubstitutes(activeTaskItem.appName);
-        } else if (plasmoid.configuration.style === 3){ /*TitleApplication*/
-            var finalText = activeTaskItem.appName === activeTaskItem.title ?
+        } else if (plasmoid.configuration.style === 3) { /*TitleApplication*/
+            let finalText = activeTaskItem.appName === activeTaskItem.title ?
                         Tools.applySubstitutes(activeTaskItem.appName) : activeTaskItem.title;
 
             return finalText;
-        } else if (plasmoid.configuration.style === 4){ /*NoText*/
+        } else if (plasmoid.configuration.style === 4) { /*NoText*/
             return "";
         }
 
@@ -161,12 +174,12 @@ Item {
             return "";
         }
 
-        if (plasmoid.configuration.style === 2){ /*ApplicationTitle*/
-            var finalText = activeTaskItem.appName === activeTaskItem.title ? "" : activeTaskItem.title;
+        if (plasmoid.configuration.style === 2) { /*ApplicationTitle*/
+            let finalText = activeTaskItem.appName === activeTaskItem.title ? "" : activeTaskItem.title;
 
             return finalText;
-        } else if (plasmoid.configuration.style === 3){ /*TitleApplication*/
-            var finalText = activeTaskItem.appName === activeTaskItem.title ? "" : Tools.applySubstitutes(activeTaskItem.appName);
+        } else if (plasmoid.configuration.style === 3) { /*TitleApplication*/
+            let finalText = activeTaskItem.appName === activeTaskItem.title ? "" : Tools.applySubstitutes(activeTaskItem.appName);
 
             return finalText;
         }
@@ -174,27 +187,8 @@ Item {
         return "";
     }
 
-    //BEGIN Latte Dock Communicator
-    property bool isInLatte: false  // deprecated Latte v0.8 API
-    property QtObject latteBridge: null // current Latte v0.9 API
-
-    onLatteBridgeChanged: {
-        if (latteBridge) {
-            plasmoid.configuration.containmentType = 2; /*Latte containment with new API*/
-            latteBridge.actions.setProperty(plasmoid.id, "latteSideColoringEnabled", false);
-            latteBridge.actions.setProperty(plasmoid.id, "windowsTrackingEnabled", true);
-        }
-    }
-
-    //END  Latte Dock Communicator
-    //BEGIN Latte based properties
-    readonly property bool enforceLattePalette: latteBridge && latteBridge.applyPalette && latteBridge.palette
-    readonly property bool latteInEditMode: latteBridge && latteBridge.inEditMode
-    //END Latte based properties
-
     Component.onCompleted: {
         plasmoid.configuration.appMenuIsPresent = false;
-        containmentIdentifierTimer.start();
     }
 
     // START Tasks logic
@@ -215,17 +209,9 @@ Item {
 
     Loader {
         id: windowInfoLoader
-        sourceComponent: latteBridge
-                         && latteBridge.windowsTracker
-                         && latteBridge.windowsTracker.currentScreen.lastActiveWindow
-                         && latteBridge.windowsTracker.allScreens.lastActiveWindow ? latteTrackerComponent : plasmaTasksModel
-
-        Component{
-            id: latteTrackerComponent
-            LatteWindowsTracker{}
-        }
+        sourceComponent: plasmaTasksModel
 
-        Component{
+        Component {
             id: plasmaTasksModel
             PlasmaTasksModel{}
         }
@@ -254,19 +240,8 @@ Item {
         anchors.top: parent.top
         anchors.left: parent.left
 
-        width: plasmoid.formFactor === PlasmaCore.Types.Horizontal ?
-                   (!exceedsAvailableSpace ? metricsContents.width : root.width) : thickness
-
-        height: plasmoid.formFactor === PlasmaCore.Types.Vertical ?
-                    (!exceedsAvailableSpace ? metricsContents.height : root.height) : thickness
-
-        exceedsAvailableSpace: plasmoid.formFactor === PlasmaCore.Types.Horizontal ?
-                                   metricsContents.width > root.width :
-                                   metricsContents.height > root.height
-
-        exceedsApplicationText: plasmoid.formFactor === PlasmaCore.Types.Horizontal ?
-                                    metricsContents.applicationTextLength > root.width :
-                                    metricsContents.applicationTextLength > root.height
+        width: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? metricsContents.width : root.width
+        height: plasmoid.formFactor === PlasmaCore.Types.Vertical ? metricsContents.height : root.height
 
         visible: !(!plasmoid.configuration.filterActivityInfo && !root.existsWindowActive && !plasmoid.configuration.placeHolder)
     }
@@ -281,7 +256,7 @@ Item {
         location: plasmoid.location
 
         readonly property string text: {
-            if (!existsWindowActive
+            if (!root.existsWindowActive
                     || !plasmoid.configuration.showTooltip
                     || broadcaster.cooperationEstablished /*can not work correctly when showing appmenus*/) {
                 return "";
@@ -289,18 +264,18 @@ Item {
 
             /* Try to show only information that are not already shown*/
 
-            if (plasmoid.configuration.style === 0){ /*Application*/
+            if (plasmoid.configuration.style === 0) { /*Application*/
                 return activeTaskItem.appName === activeTaskItem.title ? "" : activeTaskItem.title;
             } else if (plasmoid.configuration.style === 1
                        || plasmoid.configuration.style === 2
-                       || plasmoid.configuration.style === 4 ){ /*Title   OR  ApplicationTitle  OR  NoText*/
-                var finalText = activeTaskItem.appName === activeTaskItem.title ?
+                       || plasmoid.configuration.style === 4 ) { /*Title   OR  ApplicationTitle  OR  NoText*/
+                let finalText = activeTaskItem.appName === activeTaskItem.title ?
                             Tools.applySubstitutes(activeTaskItem.appName) :
                             Tools.applySubstitutes(activeTaskItem.appName) + " - " + activeTaskItem.title;
 
                 return finalText;
-            } else if (plasmoid.configuration.style === 3){ /*TitleApplication*/
-                var finalText = activeTaskItem.appName === activeTaskItem.title ?
+            } else if (plasmoid.configuration.style === 3) { /*TitleApplication*/
+                let finalText = activeTaskItem.appName === activeTaskItem.title ?
                             Tools.applySubstitutes(activeTaskItem.appName) :
                             activeTaskItem.title + " - " + Tools.applySubstitutes(activeTaskItem.appName);
 
@@ -310,63 +285,96 @@ Item {
             return "";
         }
 
-        mainItem: RowLayout {
-            spacing: units.largeSpacing
-            Layout.margins: units.smallSpacing
-            PlasmaCore.IconItem {
-                Layout.minimumWidth: units.iconSizes.medium
-                Layout.minimumHeight: units.iconSizes.medium
-                Layout.maximumWidth: Layout.minimumWidth
-                Layout.maximumHeight: Layout.minimumHeight
-                source:  existsWindowActive ? activeTaskItem.icon : fullActivityInfo.icon
-                visible: !plasmoid.configuration.showIcon
+        readonly property string desktopInt: {
+            for( let i = 0; i < virtualDesktopInfo.desktopIds.length; i++ ) {
+                if (virtualDesktopInfo.desktopIds[i] == virtualDesktopInfo.currentDesktop) {
+                    return i + 1;
+                }
+            }
+
+            return "error";
+        }
+
+
+        mainItem: ColumnLayout {
+            spacing: 0
+            Layout.topMargin: Kirigami.Units.gridUnit + Kirigami.Units.largeSpacing
+            Layout.bottomMargin: Kirigami.Units.gridUnit + Kirigami.Units.largeSpacing
+
+            RowLayout {
+                Layout.leftMargin:  Kirigami.Units.gridUnit * 0.5
+                Layout.rightMargin: Kirigami.Units.gridUnit * 0.5
+                Layout.topMargin: Kirigami.Units.largeSpacing
+
+                Kirigami.Icon {
+                    Layout.minimumWidth: Kirigami.Units.iconSizes.medium
+                    Layout.minimumHeight: Kirigami.Units.iconSizes.medium
+                    Layout.maximumWidth: Layout.minimumWidth
+                    Layout.maximumHeight: Layout.minimumHeight
+                    source:  root.existsWindowActive ? activeTaskItem.icon : fullActivityInfo.icon
+                    visible: !plasmoid.configuration.showIcon
+                }
+
+                Kirigami.Heading {
+                    Layout.maximumWidth: 750
+
+                    level: 3
+                    elide: Text.ElideRight
+                    text: contentsTooltip.text
+                }
             }
 
-            PlasmaComponents.Label {
-                id: fullText
-                Layout.minimumWidth: 0
-                Layout.preferredWidth: implicitWidth
-                Layout.maximumWidth: 750
+            ColumnLayout {
+                Layout.leftMargin:  Kirigami.Units.gridUnit * 0.5
+                Layout.rightMargin: Kirigami.Units.gridUnit * 0.5
+                Layout.bottomMargin: Kirigami.Units.largeSpacing
+
+                opacity: 0.6
+                spacing: 0
+
+                PlasmaComponents.Label {
+                    Layout.maximumWidth: 750
 
-                Layout.minimumHeight: implicitHeight
-                Layout.maximumHeight: Layout.minimumHeight
-                elide: Text.ElideRight
+                    text: {
+                        return "Virtual Desktop: " + contentsTooltip.desktopInt;
+                    }
+                }
 
-                text: contentsTooltip.text
+                PlasmaComponents.Label {
+                    Layout.maximumWidth: 750
+
+                    elide: Text.ElideRight
+                    text: {
+                        return "Activity: " + activityInfo.activityName(activityInfo.currentActivity);
+                    }
+                }
             }
         }
     }
     //! END of ToolTip area
 
     Loader {
-        id: actionsLoader
-        anchors.fill: inFillLengthMode ? parent : visibleContents
-        active: containmentType === 1 /*plasma or old latte containment*/
+        id: actionsMouseLoader
+        anchors.fill: root.inFillLengthMode ? parent : visibleContents
+        active: true
 
         sourceComponent: ActionsMouseArea {
             anchors.fill: parent
         }
     }
 
-    Broadcaster{
-        id: broadcaster
-        anchors.fill: parent
-    }
+    Loader {
+        id: actionsTouchLoader
+        anchors.fill: root.inFillLengthMode ? parent : visibleContents
+        active: true
 
-    //! this timer is used in order to identify in which containment the applet is in
-    //! it should be called only the first time an applet is created and loaded because
-    //! afterwards the applet has no way to move between different processes such
-    //! as Plasma and Latte
-    Timer{
-        id: containmentIdentifierTimer
-        interval: 5000
-        onTriggered: {
-            if (latteBridge) {
-                plasmoid.configuration.containmentType = 2; /*Latte containment with new API*/
-                latteBridge.actions.broadcastToApplet("org.kde.windowappmenu", "isPresent", true);
-            } else {
-                plasmoid.configuration.containmentType = 1; /*Plasma containment or Latte with old API*/
-            }
+        sourceComponent: ActionsTouchArea {
+            anchors.fill: parent
         }
     }
+
+    Broadcaster {
+        id: broadcaster
+        anchors.fill: parent
+    }
 }
diff --git a/package/metadata.json b/package/metadata.json
new file mode 100644
index 0000000..cb98301
--- /dev/null
+++ b/package/metadata.json
@@ -0,0 +1,21 @@
+{
+    "KPlugin": {
+        "Authors": [
+            {
+                "Email": "mvourlakos@gmail.com",
+                "Name": "Michail Vourlakos"
+            }
+        ],
+        "Category": "Windows and Tasks",
+        "Description": "Shows the application title and icon of the active window",
+        "Icon": "preferences-desktop",
+        "Id": "org.kde.windowtitle",
+        "License": "GPLv2",
+        "Name": "Window Title",
+        "Version": "0.7.1",
+        "Website": "https://github.com/psifidotos/applet-window-title"
+    },
+    "Keyword": "window title icon",
+    "KPackageStructure": "Plasma/Applet",
+    "X-Plasma-API-Minimum-Version": "6.0"
+}
openSUSE Build Service is sponsored by