@c8y/style 1023.37.0 → 1023.43.2

package/styles/utilities/_display.less

@@ -1,3 +1,16 @@
+
+@import "../mixins/_hide-text.less";
+@import "../mixins/_responsive-visibility.less";
+
+/**
+ * Display Utility Classes
+ *
+ * Note: Uses @screen-* tokens for responsive breakpoints.
+ *
+ * Intentionally hardcoded values:
+ * - None - uses CSS display keywords only (flex, block, grid, etc.)
+ */
+
 .d-contents {
   display: contents !important;
   background: inherit;
@@ -198,9 +211,7 @@
   visibility: hidden !important;
 }
 
-.text-hide {
-  .text-hide() !important;
-}
+// Removed unused Bootstrap 3 utility: .text-hide
 
 //
 // Responsive visibility
@@ -223,7 +234,8 @@
   width: device-width;
 }
 
-// Visibility utilities
+// Bootstrap 3 responsive visibility utilities
+// NOTE: These ARE used throughout the codebase (81+ instances)
 .visible-xs,
 .visible-sm,
 .visible-md,
@@ -277,11 +289,13 @@
     display: inline-block !important;
   }
 }
+
 .visible-xs-flex {
   @media (max-width: @screen-xs-max) {
     display: flex !important;
   }
 }
+
 .visible-xs-grid {
   @media (max-width: @screen-xs-max) {
     display: grid !important;
@@ -311,11 +325,13 @@
     display: inline-block !important;
   }
 }
+
 .visible-sm-flex {
   @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
     display: flex !important;
   }
 }
+
 .visible-sm-grid {
   @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
     display: grid !important;
@@ -345,11 +361,13 @@
     display: inline-block !important;
   }
 }
+
 .visible-md-flex {
   @media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
     display: flex !important;
   }
 }
+
 .visible-md-grid {
   @media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
     display: grid !important;
@@ -379,11 +397,13 @@
     display: inline-block !important;
   }
 }
+
 .visible-lg-flex {
   @media (min-width: @screen-lg-min) {
     display: flex !important;
   }
 }
+
 .visible-lg-grid {
   @media (min-width: @screen-lg-min) {
     display: grid !important;
@@ -414,40 +434,5 @@
   }
 }
 
-// Print utilities
-//
-// Media queries are placed on the inside to be mixin-friendly.
-// Note: Deprecated .visible-print as of v3.2.0
-.visible-print {
-  .responsive-invisibility();
-  @media print {
-    .responsive-visibility();
-  }
-}
-
-.visible-print-block {
-  display: none !important;
-  @media print {
-    display: block !important;
-  }
-}
-
-.visible-print-inline {
-  display: none !important;
-  @media print {
-    display: inline !important;
-  }
-}
-
-.visible-print-inline-block {
-  display: none !important;
-  @media print {
-    display: inline-block !important;
-  }
-}
-
-.hidden-print {
-  @media print {
-    .responsive-invisibility();
-  }
-}
+// Removed unused Bootstrap 3 print utilities - verified 0 usages
+// .visible-print, .visible-print-block, .visible-print-inline, .visible-print-inline-block, .hidden-print

package/styles/utilities/_elevation.less

@@ -1,19 +1,30 @@
 
+@import "../mixins/_shadows-helper.less";
+
+/**
+ * Elevation (Shadow) Utilities
+ *
+ * Note: Uses shadows-helper mixin which references elevation design tokens.
+ *
+ * Intentionally hardcoded values:
+ * - None - uses mixin with elevation token parameters (sm, md, lg, hover)
+ */
+
 .elevation-sm {
   .boxShadowHelper(sm);
-  &--border{
+  &--border {
     .boxShadowHelper(sm, border);
   }
 }
 .elevation-md {
   .boxShadowHelper(md);
-  &--top{
+  &--top {
     .boxShadowHelper(md, top);
   }
-  &--right{
+  &--right {
     .boxShadowHelper(md, right);
   }
-  &--left{
+  &--left {
     .boxShadowHelper(md, left);
   }
 }
@@ -24,7 +35,6 @@
   .boxShadowHelper(hover);
 }
 
-
-.elevation-none{
-  box-shadow: none!important;
+.elevation-none {
+  box-shadow: none !important;
 }

package/styles/utilities/_flex-containers.less

@@ -1,3 +1,13 @@
+
+/**
+ * Flex Container Utilities
+ *
+ * Note: Uses @screen-* tokens for responsive breakpoints.
+ *
+ * Intentionally hardcoded values:
+ * - None - uses CSS flexbox keywords only (wrap, center, stretch, etc.)
+ */
+
 // Flex wrap
 .flex-wrap {
   flex-wrap: wrap !important;

package/styles/utilities/_flex-items.less

@@ -1,3 +1,14 @@
+
+/**
+ * Flex Item Utilities
+ *
+ * Note: Uses @screen-* tokens for responsive breakpoints.
+ *
+ * Intentionally hardcoded values:
+ * - Unitless values (0, 1): Flex grow/shrink factors
+ * - 1%: Minimal flex-basis for flex-auto behavior
+ */
+
 /* SIZING */
 .flex-auto {
   flex: 1 1 1% !important;

package/styles/utilities/_icon-utils.less

@@ -1,3 +1,15 @@
+
+/**
+ * Icon Utility Classes
+ *
+ * Note: Uses @size-4 for spacing and var(--c8y-line-height-base) for line-height.
+ *
+ * Intentionally hardcoded values:
+ * - Font sizes (12px-64px): Icon sizing scale for utility classes
+ * - Transform values (-6px, 3px): Fine-tuning icon positioning
+ * - Negative margins (-6px): Alignment adjustments
+ */
+
 //Icon badge
 .c8y-icon-badge {
   display: inline-flex;
@@ -24,16 +36,16 @@
   display: inline-flex;
   align-items: flex-start;
   line-height: var(--c8y-line-height-base);
-  word-break: break-word;
   > [class^='dlt-c8y-icon-'],
   > [class*=' dlt-c8y-icon-'],
   > .c8y-icon {
-    margin-right: 4px;
+    margin-right: @size-4;
     transform: translateY(3px);
   }
 }
 
 // Icon sizing
+
 .icon-12 {
   font-size: 12px !important;
 }
@@ -71,7 +83,7 @@
   font-size: 52px !important;
 }
 .icon-56 {
-  font-size: 56px;
+  font-size: 56px !important;
 }
 .icon-60 {
   font-size: 60px !important;

package/styles/utilities/_margins-paddings.less

@@ -1,6 +1,25 @@
+
+@import "../mixins/_size.less";
+
+/**
+ * Margin and Padding Utility Classes
+ *
+ * Note: This file uses the size.createSizeClasses() mixin to generate utility classes
+ * based on the 8px base unit system. The mixin generates classes like .m-t-8, .p-b-16, etc.
+ *
+ * Intentionally hardcoded values:
+ * - Generated by mixin: The mixin generates hardcoded px values (e.g., 8px, 16px, 24px)
+ *   following the base unit system but not using @size-* tokens directly
+ * - Responsive breakpoints: Use @screen-* tokens for media queries
+ * - Auto values: CSS auto keyword, not numeric
+ *
+ * Note: Consider refactoring the mixin to use @size-* tokens instead of generating
+ * hardcoded pixel values for better consistency with the design token system.
+ */
+
 // Margin utility classes
-.createSizeClasses(1, margin, m, 4) !important;
-.createSizeClasses(15, margin, m, 8) !important;
+.createSizeClasses(1, margin, m, 4);
+.createSizeClasses(15, margin, m, 8);
 
 /* example result:
  .m-t-8{
@@ -9,8 +28,8 @@
 */
 
 // Padding utility classes
-.createSizeClasses(1, padding, p, 4) !important;
-.createSizeClasses(15, padding, p, 8) !important;
+.createSizeClasses(1, padding, p, 4);
+.createSizeClasses(15, padding, p, 8);
 
 /* example result:
  .p-t-8{

package/styles/utilities/_overflows.less

@@ -1,3 +1,13 @@
+
+/**
+ * Overflow Utility Classes
+ *
+ * Note: Uses @screen-* tokens for responsive breakpoints.
+ *
+ * Intentionally hardcoded values:
+ * - None - uses CSS overflow keywords only (visible, hidden, auto)
+ */
+
 .overflow-visible {
   overflow: visible !important;
 }

package/styles/utilities/_position.less

@@ -1,3 +1,14 @@
+
+/**
+ * Position Utilities
+ *
+ * Note: Uses @screen-* tokens for responsive breakpoints.
+ *
+ * Intentionally hardcoded values:
+ * - 0 values: Zero position offsets, not spacing
+ * - Position keywords: relative, absolute, static, sticky
+ */
+
 .p-relative {
   position: relative !important;
 }

package/styles/utilities/_quickfloats.less

@@ -1,5 +1,24 @@
+
+@import "../mixins/_center-block.less";
+
+/**
+ * Float and Clearfix Utilities
+ *
+ * Note: All values are CSS keywords (no spacing values).
+ *
+ * Intentionally hardcoded values:
+ * - None - uses CSS keywords only (float, display, etc.)
+ */
+
 .clearfix {
-  .clearfix();
+  &:before,
+  &:after {
+    display: table;
+    content: ' ';
+  }
+  &:after {
+    clear: both;
+  }
 }
 
 .center-block {

package/styles/utilities/_separators.less

@@ -1,3 +1,14 @@
+
+/**
+ * Separator Utility Classes - Box shadow-based dividers
+ *
+ * Note: Uses @component-border-color for separator color.
+ *
+ * Intentionally hardcoded values:
+ * - 1px/-1px box-shadow offsets: Standard separator line width
+ * - 1px min-height: Ensures separator is visible even in empty tags
+ */
+
 .separator-top {
   box-shadow: inset 0 1px 0 @component-border-color !important;
 }

package/styles/utilities/_shadows.less

@@ -1,50 +1,6 @@
-// .shadow1 {
-//   .boxShadowHelper(1);
-// }
 
-// .shadow2 {
-//   .boxShadowHelper(2);
-// }
-// .shadow2-border {
-//   .boxShadowHelper(2, border);
-// }
-
-// .shadow3,
-// .shadow3-left {
-//   .boxShadowHelper(3);
-// }
-// .shadow3-top {
-//   .boxShadowHelper(3, top);
-// }
-// .shadow3-right {
-//   .boxShadowHelper(3, right);
-// }
-// .shadow3-bottom {
-//   .boxShadowHelper(3, bottom);
-// }
-
-// .shadow4 {
-//   .boxShadowHelper(4);
-// }
-
-// .shadow5 {
-//   .boxShadowHelper(5);
-// }
-
-// .shadow6 {
-//   .boxShadowHelper(6);
-// }
-// .shadow6-right {
-//   .boxShadowHelper(6, right);
-// }
-
-// .shadow7 {
-//   .boxShadowHelper(7);
-// }
-
-// .shadow-border-top {
-//   .shadow-border(1px, rgba(0, 0, 0, 0.1));
-// }
-// .shadow-border-bottom {
-//   .shadow-border(-1px, rgba(0, 0, 0, 0.1));
-// }
+/**
+ * Shadow Utilities
+ *
+ * Note: Currently empty - shadow utilities are defined elsewhere.
+ */

package/styles/{utilities.less → utilities/_sizing.less}

@@ -1,24 +1,16 @@
-// Main utility classes
-
-@import 'utilities/_caret.less';
-@import 'utilities/_text-utils.less';
-@import 'utilities/_contextual-colors.less';
-@import 'utilities/_display.less';
-@import 'utilities/_quickfloats.less';
-@import 'utilities/_margins-paddings.less';
-// Using the grid - mixins/
-@import 'utilities/_flex-containers.less';
-@import 'utilities/_flex-items.less';
-
-@import 'utilities/_position.less';
-@import 'utilities/_overflows.less';
-@import 'utilities/_separators.less';
-@import 'utilities/_borders.less';
-@import 'utilities/_elevation.less';
-@import 'utilities/_icon-utils.less';
-@import 'utilities/_container-queries.less';
-
-
+// Sizing Utilities - Max/min width/height utility classes
+
+/**
+ * Sizing Utilities - Width/Height utility classes
+ *
+ * Note: These are utility classes with fixed API - values are intentionally hardcoded.
+ *
+ * Intentionally hardcoded values:
+ * - Percentages (100%): Layout utilities
+ * - Pixel values (20px): Fixed size utilities
+ * - Keywords (unset, inherit, fit-content): CSS utility values
+ * - Number values (0): No size
+ */
 
 // Max width
 .max-width-unset {

package/styles/utilities/_text-utils.less

@@ -1,3 +1,16 @@
+
+/**
+ * Text Utility Classes
+ *
+ * Note: Uses design tokens where applicable (@line-height-base; @component-color-text-muted; @size-32).
+ *
+ * Intentionally hardcoded values:
+ * - Font weights (200, 400, 600, 700): Standard CSS font-weight scale
+ * - Font sizes (10px, 12px, 14px, 16px): Typography utility class scale
+ * - Unitless line-heights (0, 1, 1.2): CSS best practice for line-height
+ * - Color keywords (yellow, orange): Monaco editor highlight colors
+ */
+
 //Font weight
 .text-light {
   font-weight: 200 !important;
@@ -13,11 +26,11 @@
   font-weight: 700 !important;
 }
 
-.text-tabular{
-  font-feature-settings: "tnum"1,"kern"1!important;
+.text-tabular {
+  font-feature-settings: "tnum" 1, "kern" 1 !important;
 }
 
-.text-rtl{
+.text-rtl {
   direction: rtl !important;
 }
 
@@ -185,7 +198,7 @@
   line-height: 1.2 !important;
 }
 .l-h-input {
-  line-height: 32px !important;
+  line-height: @size-32 !important;
 }
 //media queries
 /* #region */
@@ -206,7 +219,7 @@
     line-height: 1.2 !important;
   }
   .l-h-input-xs {
-    line-height: 32px !important;
+    line-height: @size-32 !important;
   }
 }
 
@@ -227,7 +240,7 @@
     line-height: 1.2 !important;
   }
   .l-h-input-sm {
-    line-height: 32px !important;
+    line-height: @size-32 !important;
   }
 }
 
@@ -248,7 +261,7 @@
     line-height: 1.2 !important;
   }
   .l-h-input-md {
-    line-height: 32px !important;
+    line-height: @size-32 !important;
   }
 }
 
@@ -269,7 +282,7 @@
     line-height: 1.2 !important;
   }
   .l-h-input-lg {
-    line-height: 32px !important;
+    line-height: @size-32 !important;
   }
 }
 /* #endregion */
@@ -286,7 +299,7 @@
 }
 
 .text-label-small {
-  color: @component-color-text-muted!important;
+  color: @component-color-text-muted !important;
   text-transform: uppercase !important;
   font-size: 10px !important;
 }
@@ -304,7 +317,7 @@
   }
 
   .text-label-small-xs {
-    color: @component-color-text-muted!important;
+    color: @component-color-text-muted !important;
     text-transform: uppercase !important;
     font-size: 10px !important;
   }
@@ -322,7 +335,7 @@
   }
 
   .text-label-small-sm {
-    color: @component-color-text-muted!important;
+    color: @component-color-text-muted !important;
     text-transform: uppercase !important;
     font-size: 10px !important;
   }
@@ -340,7 +353,7 @@
   }
 
   .text-label-small-md {
-    color: @component-color-text-muted!important;
+    color: @component-color-text-muted !important;
     text-transform: uppercase !important;
     font-size: 10px !important;
   }
@@ -358,7 +371,7 @@
   }
 
   .text-label-small-lg {
-    color: @component-color-text-muted!important;
+    color: @component-color-text-muted !important;
     text-transform: uppercase !important;
     font-size: 10px !important;
   }
@@ -454,11 +467,11 @@
   white-space: normal !important;
 }
 
-.text-pretty{
+.text-pretty {
   text-wrap: pretty;
 }
 
-.text-balance{
+.text-balance {
   text-wrap: balance;
 }
 //media queries
@@ -584,10 +597,10 @@
 
 // line clamp
 
-.line-clamp{
-  &--2{
+.line-clamp {
+  &--2 {
     display: -webkit-box;
-    -webkit-line-clamp: 3;
+    -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
   }
@@ -661,19 +674,17 @@
 }
 
 // Font size inherit
-.font-size-inherit{
+.font-size-inherit {
   font-size: inherit !important;
 }
 
-
 // Monaco Editor search string highlight
-.monaco-editor{
-  .findMatchInline{
+.monaco-editor {
+  .findMatchInline {
     background: yellow;
   }
-  .currentFindMatchInline{
+  .currentFindMatchInline {
     background: orange;
     font-weight: bold;
   }
 }
-

package/styles/vendor/ace-editor/_ace-editor.less

@@ -1,3 +1,4 @@
+
 [ui-ace] .ace_tooltip {
   max-width: 600px;
   white-space: pre-wrap;

package/styles/vendor/angular/_loading-bar.less

@@ -1,3 +1,4 @@
+
 .loading-bar {
   position: relative;
   overflow: visible;

package/styles/vendor/angular/_ui-sortable.less

@@ -1,3 +1,4 @@
+
 .ui-sortable {
   &.inner-scroll {
     position: static;
@@ -15,7 +16,7 @@
       display: flex;
 
       input + span {
-        margin-right: @margin-base;
+        margin-right: @size-base;
       }
     }
   }

package/styles/vendor/angular/_uib-accordion.less

@@ -1,3 +1,4 @@
+
 uib-accordion {
   .panel-group .panel {
     border-right: 0;

package/styles/{angular-ui-select/select.less → vendor/angular/angular-ui-select/_select.less}

@@ -1,3 +1,4 @@
+
 /* ui-select
  * http://github.com/angular-ui/ui-select
  * Version: 0.8.3 - 2014-10-14T18:22:05.435Z
@@ -55,16 +56,7 @@
 }
 
 /* Bootstrap theme */
-/* Helper class to show styles when focus */
-.btn-default-focus {
-  outline: 5px auto -webkit-focus-ring-color;
-  outline-offset: -2px;
-  border-color: @btn-default-border-color-default;
-  background-color: @btn-default-background-default;
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-  color: #333;
-  text-decoration: none;
-}
+// Removed unused focus helper class - verified 0 usages: .btn-default-focus
 
 /* Fix Bootstrap dropdown position when inside a input-group */
 .input-group > .ui-select-bootstrap.dropdown {

package/styles/vendor/cdk/_cdk-drag.less

@@ -1,3 +1,6 @@
+
+@import "../../mixins/_shadows-helper.less";
+
 .list-group.cdk-drop-list {
   min-width: 220px;
 }