Do not activate toolbar when desktop selectable is active

Author: jelveh

src/gui/src/UI/UIDesktop.js

@@ -1102,6 +1102,8 @@ async function UIDesktop(options) {
                 }
             })
             .on('move', ({ store: { changed: { added, removed } }, event }) => {
+                window.desktop_selectable_is_active = true;
+
                 for (const el of added) {
                     // if ctrl or meta key is pressed and the item is already selected, then unselect it
                     if ((event.ctrlKey || event.metaKey) && $(el).hasClass('item-selected')) {
@@ -1122,6 +1124,7 @@ async function UIDesktop(options) {
                 }
             })
             .on('stop', evt => {
+                window.desktop_selectable_is_active = false;
             });
     }
     // ----------------------------------------------------
@@ -1524,7 +1527,7 @@ async function UIDesktop(options) {
 
         $('.toolbar').animate({
             top: 0,
-        }, 100).css('width', 'fit-content');
+        }, 100).css('width', 'max-content');
 
         // animate show toolbar-btn, toolbar-clock
         $('.toolbar-btn, #clock, .user-options-menu-btn').animate({
@@ -1628,6 +1631,10 @@ async function UIDesktop(options) {
         if(window.a_window_is_being_dragged)
             return;
 
+        // if selectable is active , don't show the toolbar
+        if(window.desktop_selectable_is_active)
+            return;
+
         if(window.is_fullpage_mode)
             $('.window-app-iframe').css('pointer-events', 'none');
 

src/gui/src/css/style.css

@@ -346,6 +346,7 @@ input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, sel
     grid-template-rows: repeat(auto-fill, 109px);
     grid-auto-flow: column;
     grid-template-columns: repeat(auto-fill, 120px);
+    padding-top: 15px;
 }
 
 .fullpage-mode .window-minimize-btn {
@@ -1771,9 +1772,10 @@ label {
     border-top-left-radius: 0px;
     border-bottom-left-radius: 10px;
     border-bottom-right-radius: 10px;
-    width: fit-content;
+    width: max-content;
     overflow: clip;
     box-shadow: rgb(255 255 255 / 14%) 0px 0px 0px 0.5px inset, rgba(0, 0, 0, 0.2) 0px 0px 0px 0.5px, rgba(0, 0, 0, 0.2) 0px 2px 14px;
+    position: absolute;
 
 }