cx 25.4.1 → 25.5.1

package/src/widgets/grid/TreeNode.scss

@@ -1,88 +1,88 @@
-@mixin cx-treenode(
-   $name: "treenode",
-   $icon-size: $cx-default-icon-size,
-   $handle-size: $cx-default-input-tool-size,
-   $handle-state-style-map: $cx-input-right-icon-state-style-map,
-   $besm: $cx-besm
-) {
-   $block: map-get($besm, block);
-   $element: map-get($besm, element);
-   $state: map-get($besm, state);
-   $mod: map-get($besm, mod);
-
-   .#{$block}#{$name} {
-      padding-left: $handle-size + $icon-size * 0.25;
-      position: relative;
-
-      &.#{$state}icon {
-         padding-left: $handle-size + $icon-size + $icon-size * 0.25;
-      }
-
-      @for $i from 1 through 20 {
-         &.#{$state}level-#{$i} {
-            margin-left: #{($i * 20)}px;
-         }
-      }
-   }
-
-   .#{$element}#{$name}-handle {
-      position: absolute;
-
-      @include cx-add-state-rules($handle-state-style-map, default);
-
-      left: 0;
-      top: 50%;
-      margin-top: -$handle-size * 0.5;
-      bottom: 0;
-      width: $handle-size + $icon-size;
-      height: $handle-size;
-
-      &:hover {
-         @include cx-add-state-rules($handle-state-style-map, hover);
-      }
-
-      &:active {
-         @include cx-add-state-rules($handle-state-style-map, active);
-      }
-   }
-
-   .#{$element}#{$name}-arrow {
-      display: block;
-      position: absolute;
-      left: 0;
-      top: 50%;
-      margin-top: -$icon-size * 0.5;
-      margin-left: ($handle-size - $icon-size) * 0.5;
-      height: $icon-size;
-      width: $icon-size;
-      line-height: $icon-size;
-      transform: rotate(-90deg);
-      transition: transform 0.2s;
-
-      .#{$state}expanded & {
-         transform: rotate(0);
-      }
-   }
-
-   .#{$element}#{$name}-icon {
-      display: block;
-      position: absolute;
-      left: 0;
-      top: 50%;
-      margin-top: -$icon-size * 0.5;
-      margin-left: ($handle-size + $icon-size) * 0.5;
-      height: $icon-size;
-      width: $icon-size;
-      line-height: $icon-size;
-   }
-
-   .#{$block}grid.#{$mod}tree {
-      td {
-         border-top: none;
-      }
-   }
-}
-
-@if (cx-should-include("cx/widgets/TreeNode")) {
-   @include cx-treenode();
-}
+@mixin cx-treenode(
+   $name: "treenode",
+   $icon-size: $cx-default-icon-size,
+   $handle-size: $cx-default-input-tool-size,
+   $handle-state-style-map: $cx-input-right-icon-state-style-map,
+   $besm: $cx-besm
+) {
+   $block: map-get($besm, block);
+   $element: map-get($besm, element);
+   $state: map-get($besm, state);
+   $mod: map-get($besm, mod);
+
+   .#{$block}#{$name} {
+      padding-left: $handle-size + $icon-size * 0.25;
+      position: relative;
+
+      &.#{$state}icon {
+         padding-left: $handle-size + $icon-size + $icon-size * 0.25;
+      }
+
+      @for $i from 1 through 20 {
+         &.#{$state}level-#{$i} {
+            margin-left: #{($i * 20)}px;
+         }
+      }
+   }
+
+   .#{$element}#{$name}-handle {
+      position: absolute;
+
+      @include cx-add-state-rules($handle-state-style-map, default);
+
+      left: 0;
+      top: 50%;
+      margin-top: -$handle-size * 0.5;
+      bottom: 0;
+      width: $handle-size + $icon-size;
+      height: $handle-size;
+
+      &:hover {
+         @include cx-add-state-rules($handle-state-style-map, hover);
+      }
+
+      &:active {
+         @include cx-add-state-rules($handle-state-style-map, active);
+      }
+   }
+
+   .#{$element}#{$name}-arrow {
+      display: block;
+      position: absolute;
+      left: 0;
+      top: 50%;
+      margin-top: -$icon-size * 0.5;
+      margin-left: ($handle-size - $icon-size) * 0.5;
+      height: $icon-size;
+      width: $icon-size;
+      line-height: $icon-size;
+      transform: rotate(-90deg);
+      transition: transform 0.2s;
+
+      .#{$state}expanded & {
+         transform: rotate(0);
+      }
+   }
+
+   .#{$element}#{$name}-icon {
+      display: block;
+      position: absolute;
+      left: 0;
+      top: 50%;
+      margin-top: -$icon-size * 0.5;
+      margin-left: ($handle-size + $icon-size) * 0.5;
+      height: $icon-size;
+      width: $icon-size;
+      line-height: $icon-size;
+   }
+
+   .#{$block}grid.#{$mod}tree {
+      td {
+         border-top: none;
+      }
+   }
+}
+
+@if (cx-should-include("cx/widgets/TreeNode")) {
+   @include cx-treenode();
+}

package/src/widgets/grid/variables.scss

@@ -1,133 +1,133 @@
-// GRID
-$cx-default-grid-font-size: $cx-default-box-font-size !default;
-$cx-default-grid-border-color: $cx-default-border-color !default;
-$cx-default-grid-border-radius: null !default;
-$cx-default-grid-box-shadow: null !default;
-
-// header
-$cx-default-grid-header-font-size: $cx-default-box-font-size !default;
-$cx-default-grid-header-font-weight: normal !default;
-$cx-default-grid-header-line-height: null !default;
-$cx-default-grid-header-color: $cx-default-color !default;
-$cx-default-grid-header-background-color: #eee !default;
-$cx-default-grid-header-border-color: $cx-default-border-color !default;
-$cx-default-grid-header-box-shadow: null !default;
-$cx-default-grid-header-padding: null !default;
-
-$cx-grid-header-state-style-map: (
-   default: (
-      font-size: $cx-default-grid-header-font-size,
-      font-weight: $cx-default-grid-header-font-weight,
-      line-height: $cx-default-grid-header-line-height,
-      color: $cx-default-grid-header-color,
-      background-color: $cx-default-grid-header-background-color,
-      border-color: $cx-default-grid-header-border-color,
-      background-clip: border-box,
-      padding: $cx-default-grid-header-padding,
-   ),
-   hover: (
-      background-color: darken($cx-default-grid-header-background-color, 2),
-   ),
-   sorted: (
-      background-color: darken($cx-default-grid-header-background-color, 7),
-   ),
-   sorted-hover: (
-      background-color: darken($cx-default-grid-header-background-color, 5),
-   ),
-) !default;
-
-// data
-$cx-default-grid-data-font-size: null !default;
-$cx-default-grid-data-font-weight: null !default;
-$cx-default-grid-data-line-height: null !default;
-$cx-default-grid-data-background-color: transparent !default;
-$cx-default-grid-data-alternate-background-color: null !default;
-$cx-default-grid-data-border-color: $cx-default-grid-border-color !default;
-$cx-default-grid-data-padding: 5px !default;
-$cx-default-grid-caption-gap: 15px !default;
-
-$cx-grid-data-state-style-map: cx-deep-map-merge(
-   $cx-list-item,
-   (
-      default: (
-         font-size: $cx-default-grid-data-font-size,
-         line-height: $cx-default-grid-data-line-height,
-         font-weight: $cx-default-grid-data-font-weight,
-         background-color: $cx-default-grid-data-background-color,
-         border-color: $cx-default-grid-data-border-color,
-         padding: $cx-default-grid-data-padding,
-      ),
-      alternate: (
-         background-color: $cx-default-grid-data-alternate-background-color,
-      ),
-   )
-) !default;
-
-$cx-grid-group-caption-level-style-map: (
-   level-1: (
-      font-weight: bold,
-      font-size: 115%,
-   ),
-   level-2: (
-      font-weight: bold,
-      font-size: 130%,
-      border-bottom: 1px solid grey,
-   ),
-   level-3: (
-      font-weight: bold,
-      font-size: 145%,
-      border-bottom: 1px solid grey,
-   ),
-   level-4: (
-      font-weight: bold,
-      font-size: 160%,
-      border-bottom: 1px solid grey,
-   ),
-);
-
-$cx-grid-group-footer-level-style-map: (
-   level-1: (
-      font-weight: bold,
-      border-top: 1px solid $cx-default-grid-border-color,
-   ),
-   level-2: (
-      font-weight: bold,
-      font-size: 110%,
-      border-top: 1px solid grey,
-   ),
-   level-3: (
-      font-weight: bold,
-      font-size: 120%,
-      border-top: 1px solid grey,
-   ),
-   level-4: (
-      font-weight: bold,
-      font-size: 130%,
-      border-top: 1px solid grey,
-   ),
-);
-
-// pagination
-$cx-grid-pagination-default-border-width: $cx-default-border-width !default;
-$cx-grid-pagination-default-border-color: $cx-default-border-color !default;
-$cx-grid-pagination-default-border-radius: null !default;
-$cx-grid-pagination-default-outer-border-radius: $cx-default-border-radius !default;
-$cx-grid-pagination-default-padding: cx-top($cx-default-box-padding) 2 * cx-top($cx-default-box-padding) !default;
-
-$cx-grid-pagination-state-style-map: cx-deep-map-merge($cx-list-item, ()) !default;
-
-$cx-grid-cell-cursor-style: (
-   left: -1px,
-   top: -1px,
-   right: -1px,
-   bottom: -1px,
-   background: rgba(green, 0.1),
-   border: 2px solid rgba(green, 1),
-);
-
-$cx-dependencies: map-merge(
-   $cx-dependencies,
-   (
-      "cx/widgets/Grid": "cx/widgets/DragClone",
-   )
-);
+// GRID
+$cx-default-grid-font-size: $cx-default-box-font-size !default;
+$cx-default-grid-border-color: $cx-default-border-color !default;
+$cx-default-grid-border-radius: null !default;
+$cx-default-grid-box-shadow: null !default;
+
+// header
+$cx-default-grid-header-font-size: $cx-default-box-font-size !default;
+$cx-default-grid-header-font-weight: normal !default;
+$cx-default-grid-header-line-height: null !default;
+$cx-default-grid-header-color: $cx-default-color !default;
+$cx-default-grid-header-background-color: #eee !default;
+$cx-default-grid-header-border-color: $cx-default-border-color !default;
+$cx-default-grid-header-box-shadow: null !default;
+$cx-default-grid-header-padding: null !default;
+
+$cx-grid-header-state-style-map: (
+   default: (
+      font-size: $cx-default-grid-header-font-size,
+      font-weight: $cx-default-grid-header-font-weight,
+      line-height: $cx-default-grid-header-line-height,
+      color: $cx-default-grid-header-color,
+      background-color: $cx-default-grid-header-background-color,
+      border-color: $cx-default-grid-header-border-color,
+      background-clip: border-box,
+      padding: $cx-default-grid-header-padding,
+   ),
+   hover: (
+      background-color: darken($cx-default-grid-header-background-color, 2),
+   ),
+   sorted: (
+      background-color: darken($cx-default-grid-header-background-color, 7),
+   ),
+   sorted-hover: (
+      background-color: darken($cx-default-grid-header-background-color, 5),
+   ),
+) !default;
+
+// data
+$cx-default-grid-data-font-size: null !default;
+$cx-default-grid-data-font-weight: null !default;
+$cx-default-grid-data-line-height: null !default;
+$cx-default-grid-data-background-color: transparent !default;
+$cx-default-grid-data-alternate-background-color: null !default;
+$cx-default-grid-data-border-color: $cx-default-grid-border-color !default;
+$cx-default-grid-data-padding: 5px !default;
+$cx-default-grid-caption-gap: 15px !default;
+
+$cx-grid-data-state-style-map: cx-deep-map-merge(
+   $cx-list-item,
+   (
+      default: (
+         font-size: $cx-default-grid-data-font-size,
+         line-height: $cx-default-grid-data-line-height,
+         font-weight: $cx-default-grid-data-font-weight,
+         background-color: $cx-default-grid-data-background-color,
+         border-color: $cx-default-grid-data-border-color,
+         padding: $cx-default-grid-data-padding,
+      ),
+      alternate: (
+         background-color: $cx-default-grid-data-alternate-background-color,
+      ),
+   )
+) !default;
+
+$cx-grid-group-caption-level-style-map: (
+   level-1: (
+      font-weight: bold,
+      font-size: 115%,
+   ),
+   level-2: (
+      font-weight: bold,
+      font-size: 130%,
+      border-bottom: 1px solid grey,
+   ),
+   level-3: (
+      font-weight: bold,
+      font-size: 145%,
+      border-bottom: 1px solid grey,
+   ),
+   level-4: (
+      font-weight: bold,
+      font-size: 160%,
+      border-bottom: 1px solid grey,
+   ),
+);
+
+$cx-grid-group-footer-level-style-map: (
+   level-1: (
+      font-weight: bold,
+      border-top: 1px solid $cx-default-grid-border-color,
+   ),
+   level-2: (
+      font-weight: bold,
+      font-size: 110%,
+      border-top: 1px solid grey,
+   ),
+   level-3: (
+      font-weight: bold,
+      font-size: 120%,
+      border-top: 1px solid grey,
+   ),
+   level-4: (
+      font-weight: bold,
+      font-size: 130%,
+      border-top: 1px solid grey,
+   ),
+);
+
+// pagination
+$cx-grid-pagination-default-border-width: $cx-default-border-width !default;
+$cx-grid-pagination-default-border-color: $cx-default-border-color !default;
+$cx-grid-pagination-default-border-radius: null !default;
+$cx-grid-pagination-default-outer-border-radius: $cx-default-border-radius !default;
+$cx-grid-pagination-default-padding: cx-top($cx-default-box-padding) 2 * cx-top($cx-default-box-padding) !default;
+
+$cx-grid-pagination-state-style-map: cx-deep-map-merge($cx-list-item, ()) !default;
+
+$cx-grid-cell-cursor-style: (
+   left: -1px,
+   top: -1px,
+   right: -1px,
+   bottom: -1px,
+   background: rgba(green, 0.1),
+   border: 2px solid rgba(green, 1),
+);
+
+$cx-dependencies: map-merge(
+   $cx-dependencies,
+   (
+      "cx/widgets/Grid": "cx/widgets/DragClone",
+   )
+);