flexmonster 2.9.100 → 2.9.101

package/theme/default/flexmonster.less

@@ -1,6 +1,6 @@
 /** 
  * Flexmonster Pivot Table & Charts [https://www.flexmonster.com/]
- * March 2025 (v. 2.9.100)
+ * April 2025 (v. 2.9.101)
  * Copyright (c) 2025 Flexmonster. All rights reserved.
  *
  * Flexmonster Pivot Table & Charts is a part of Flexmonster Software that is distributed under the terms and conditions of Flexmonster Software License Agreement: 

package/theme/flexmonster-base.less

@@ -1,6 +1,6 @@
 /** 
  * Flexmonster Pivot Table & Charts [https://www.flexmonster.com/]
- * March 2025 (v. 2.9.100)
+ * April 2025 (v. 2.9.101)
  * Copyright (c) 2025 Flexmonster. All rights reserved.
  *
  * Flexmonster Pivot Table & Charts is a part of Flexmonster Software that is distributed under the terms and conditions of Flexmonster Software License Agreement: 
@@ -16,7 +16,7 @@
 @import (reference) "default/flexmonster.less";
 
 :root {
-    --fm-version: "2.9.100";
+    --fm-version: "2.9.101";
 }
 
 /* ===== RESET STYLES ===== */
@@ -1603,7 +1603,7 @@
         }
 
         &.fm-drag-remove {
-            .fm-drag-icon:after {
+            .fm-drag-icon::after {
                 .fm-ui-icon;
                 content: "\e90e";
                 color: @theme-color-danger;
@@ -1614,6 +1614,66 @@
         }
     }
     
+    @media (max-width: 1370px) and (pointer: coarse) {
+        .fm-helper {
+            .fm-shadow;
+            display: inline-block;
+            background: @ui-draggable-item-backgound-color;
+            opacity: 0.9;
+            padding: 10px 9px;
+            font-family: @font-family;
+            font-size: @ui-label-font-size;
+            font-weight: bold;
+            border: @ui-border-light;
+            pointer-events: none;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+            overflow: hidden;
+            max-width: 250px;
+            color: @ui-draggable-item-text-color;
+    
+            .fm-label {
+                width: ~"calc(100% - 20px)";
+                display: inline-block;
+                text-overflow: ellipsis;
+                overflow: hidden;
+            }
+            
+            .fm-drag-icon {
+                float: right;
+                position: relative;
+            }
+    
+            &.fm-no-drop {
+                .fm-drag-icon:after {
+                    .fm-ui-icon;
+                    content: "\ea0e";
+                    color: @theme-color-danger;
+                    right: 0;
+                }  
+            }
+    
+            &.fm-drag-remove {
+                border-color: red;
+                border-width: 2px;
+                display: flex;
+
+                .fm-label {
+                    display: flex;
+                    padding-left: 10px;
+                }
+
+                .fm-drag-icon::after {
+                    .fm-ui-icon;
+                    content: "\e90e";
+                    color: @theme-color-danger;
+                    left: -8px;
+                    top: -5px;
+                    font-size: 21px;
+                }  
+            }
+        } 
+    }
 
     .fm-header-helper {
         text-transform: uppercase;
@@ -1625,24 +1685,60 @@
         cursor: move;
 
         &.fm-drag-remove {
+            border-color: red;
+            border-width: 2px;
+
             .fm-remove-icon {
                 display: inline-block;
                 margin-left: 4px;
                 width: 10px;
                 position: relative;
-                
+
                 &:after {
                     .fm-ui-icon;
                     content: "\e90e";
                     color: @theme-color-danger;
-                    top: -15px;
-                    left: -6px;
+                    top: -16px;
+                    left: -7px;
                     font-size: 21px;
                 }
             }
         }
     }
 
+    @media (max-width: 1370px) and (pointer: coarse) {
+        .fm-header-helper {
+            text-transform: uppercase;
+            border: none;
+            background: @ui-draggable-item-backgound-color;
+            padding: 12px 18px;
+            font-size: @font-size * 1.2;
+            border: @ui-border;
+            cursor: move;
+    
+            &.fm-drag-remove {
+                border-color: red;
+                border-width: 2px;
+
+                .fm-remove-icon {
+                    display: inline-block;
+                    margin-left: 4px;
+                    width: 10px;
+                    position: relative;
+
+                    &:after {
+                        .fm-ui-icon;
+                        content: "\e90e";
+                        color: @theme-color-danger;
+                        top: -23px;
+                        left: -15px;
+                        font-size: 21px * 1.5;
+                    }
+                }
+            }
+        }
+    }
+
     .fm-drop-indicator {
         height: 2px;
         background: @ui-background-dark;

package/theme/green/flexmonster.css

@@ -1,6 +1,6 @@
 /** 
  * Flexmonster Pivot Table & Charts [https://www.flexmonster.com/]
- * March 2025 (v. 2.9.100)
+ * April 2025 (v. 2.9.101)
  * Copyright (c) 2025 Flexmonster. All rights reserved.
  *
  * Flexmonster Pivot Table & Charts is a part of Flexmonster Software that is distributed under the terms and conditions of Flexmonster Software License Agreement: 
@@ -14,7 +14,7 @@
  * https://www.flexmonster.com/pivot-table-editions-and-pricing/
  */
 :root {
-  --fm-version: "2.9.100";
+  --fm-version: "2.9.101";
 }
 /* ===== RESET STYLES ===== */
 #fm-pivot-view,
@@ -1795,7 +1795,7 @@
   color: #F44336;
   right: 0;
 }
-#fm-pivot-view .fm-helper.fm-drag-remove .fm-drag-icon:after {
+#fm-pivot-view .fm-helper.fm-drag-remove .fm-drag-icon::after {
   display: block;
   position: absolute;
   font-family: 'flexmonster-icons' !important;
@@ -1818,6 +1818,89 @@
   top: -4px;
   font-size: 21px;
 }
+@media (max-width: 1370px) and (pointer: coarse) {
+  #fm-pivot-view .fm-helper {
+    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
+    display: inline-block;
+    background: #ebfada;
+    opacity: 0.9;
+    padding: 10px 9px;
+    font-family: Arial, sans-serif;
+    font-size: 14px;
+    font-weight: bold;
+    border: 1px solid #b9d998;
+    pointer-events: none;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    max-width: 250px;
+    color: #111;
+  }
+  #fm-pivot-view .fm-helper .fm-label {
+    width: calc(100% - 20px);
+    display: inline-block;
+    text-overflow: ellipsis;
+    overflow: hidden;
+  }
+  #fm-pivot-view .fm-helper .fm-drag-icon {
+    float: right;
+    position: relative;
+  }
+  #fm-pivot-view .fm-helper.fm-no-drop .fm-drag-icon:after {
+    display: block;
+    position: absolute;
+    font-family: 'flexmonster-icons' !important;
+    speak-as: none;
+    font-style: normal;
+    font-weight: normal;
+    font-variant: normal;
+    text-transform: none;
+    line-height: 1;
+    width: auto;
+    height: auto;
+    height: initial;
+    background: transparent;
+    /* Better Font Rendering =========== */
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    content: "\ea0e";
+    color: #F44336;
+    right: 0;
+  }
+  #fm-pivot-view .fm-helper.fm-drag-remove {
+    border-color: red;
+    border-width: 2px;
+    display: flex;
+  }
+  #fm-pivot-view .fm-helper.fm-drag-remove .fm-label {
+    display: flex;
+    padding-left: 10px;
+  }
+  #fm-pivot-view .fm-helper.fm-drag-remove .fm-drag-icon::after {
+    display: block;
+    position: absolute;
+    font-family: 'flexmonster-icons' !important;
+    speak-as: none;
+    font-style: normal;
+    font-weight: normal;
+    font-variant: normal;
+    text-transform: none;
+    line-height: 1;
+    width: auto;
+    height: auto;
+    height: initial;
+    background: transparent;
+    /* Better Font Rendering =========== */
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    content: "\e90e";
+    color: #F44336;
+    left: -8px;
+    top: -5px;
+    font-size: 21px;
+  }
+}
 #fm-pivot-view .fm-header-helper {
   text-transform: uppercase;
   border: none;
@@ -1827,6 +1910,10 @@
   border: 1px solid #69b01e;
   cursor: move;
 }
+#fm-pivot-view .fm-header-helper.fm-drag-remove {
+  border-color: red;
+  border-width: 2px;
+}
 #fm-pivot-view .fm-header-helper.fm-drag-remove .fm-remove-icon {
   display: inline-block;
   margin-left: 4px;
@@ -1852,10 +1939,54 @@
   -moz-osx-font-smoothing: grayscale;
   content: "\e90e";
   color: #F44336;
-  top: -15px;
-  left: -6px;
+  top: -16px;
+  left: -7px;
   font-size: 21px;
 }
+@media (max-width: 1370px) and (pointer: coarse) {
+  #fm-pivot-view .fm-header-helper {
+    text-transform: uppercase;
+    border: none;
+    background: #ebfada;
+    padding: 12px 18px;
+    font-size: 14.4px;
+    border: 1px solid #69b01e;
+    cursor: move;
+  }
+  #fm-pivot-view .fm-header-helper.fm-drag-remove {
+    border-color: red;
+    border-width: 2px;
+  }
+  #fm-pivot-view .fm-header-helper.fm-drag-remove .fm-remove-icon {
+    display: inline-block;
+    margin-left: 4px;
+    width: 10px;
+    position: relative;
+  }
+  #fm-pivot-view .fm-header-helper.fm-drag-remove .fm-remove-icon:after {
+    display: block;
+    position: absolute;
+    font-family: 'flexmonster-icons' !important;
+    speak-as: none;
+    font-style: normal;
+    font-weight: normal;
+    font-variant: normal;
+    text-transform: none;
+    line-height: 1;
+    width: auto;
+    height: auto;
+    height: initial;
+    background: transparent;
+    /* Better Font Rendering =========== */
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    content: "\e90e";
+    color: #F44336;
+    top: -23px;
+    left: -15px;
+    font-size: 31.5px;
+  }
+}
 #fm-pivot-view .fm-drop-indicator {
   height: 2px;
   background: #69b01e;

package/theme/green/flexmonster.less

@@ -1,6 +1,6 @@
 /** 
  * Flexmonster Pivot Table & Charts [https://www.flexmonster.com/]
- * March 2025 (v. 2.9.100)
+ * April 2025 (v. 2.9.101)
  * Copyright (c) 2025 Flexmonster. All rights reserved.
  *
  * Flexmonster Pivot Table & Charts is a part of Flexmonster Software that is distributed under the terms and conditions of Flexmonster Software License Agreement: