@c8y/style 1023.12.0 → 1023.14.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@c8y/style",
3
- "version": "1023.12.0",
3
+ "version": "1023.14.2",
4
4
  "license": "Apache-2.0",
5
5
  "author": "Cumulocity GmbH",
6
6
  "description": "Styles for Cumulocity IoT applications",
@@ -27,11 +27,24 @@ c8y-chart {
27
27
  }
28
28
 
29
29
  .card-dashboard .chart-container{
30
- max-height: calc(100% - 95px);
30
+ max-height: calc(100% - 46px);
31
31
  max-width: 99.5%;
32
32
  min-height: unset;
33
33
  }
34
34
 
35
+ .card-dashboard {
36
+ c8y-datapoints-graph-widget-view{
37
+ flex-grow: 1;
38
+ }
39
+ &:has(c8y-aggregation-picker),
40
+ &:has(c8y-auto-refresh-control),
41
+ &:has(c8y-date-time-context-picker) {
42
+ .chart-container {
43
+ max-height: calc(100% - 80px);
44
+ }
45
+ }
46
+ }
47
+
35
48
  .top-chart-bar {
36
49
  justify-content: space-between;
37
50
  margin: 2px 0 0;
@@ -30,7 +30,7 @@
30
30
  .c8y-datapoint-pill{
31
31
  &__btn {
32
32
  &, &:not(.btn){
33
- padding: @margin-4 @margin-4 @margin-4 @margin-base;
33
+ padding: @margin-4;
34
34
  &:first-child{
35
35
  border-bottom-left-radius: @margin-16!important;
36
36
  border-top-left-radius: @margin-16!important;
@@ -68,4 +68,21 @@
68
68
  }
69
69
  }
70
70
  }
71
-
71
+ .c8y-datapoint-pill, .c8y-alarm-pill, .c8y-event-pill{
72
+ &.pill--sm{
73
+ .c8y-datapoint-pill, .c8y-alarm-pill, .c8y-event-pill {
74
+ &__btn {
75
+ &, &:not(.btn){
76
+ font-size: 11px;
77
+ padding: 1px @margin-8 1px @margin-4!important;
78
+ + .c8y-datapoint-pill__btn,
79
+ + .c8y-alarm-pill__btn,
80
+ + .c8y-event-pill__btn {
81
+ border-right: 0;
82
+ padding-right: @margin-base;
83
+ }
84
+ }
85
+ }
86
+ }
87
+ }
88
+ }
@@ -1037,10 +1037,10 @@
1037
1037
  width: 24px;
1038
1038
  aspect-ratio: 1/1;
1039
1039
  text-align: center;
1040
- padding-bottom: 2px;
1041
1040
  display: inline-flex;
1042
- align-items: center;
1041
+ align-items: flex-start;
1043
1042
  justify-content: center;
1043
+ padding: 2px;
1044
1044
  > i{
1045
1045
  font-size: 16px;
1046
1046
  color: @component-background-default;
@@ -1055,6 +1055,7 @@
1055
1055
  &--small{
1056
1056
  width: 16px;
1057
1057
  height: 16px;
1058
+
1058
1059
  > i{
1059
1060
  font-size: 10px;
1060
1061
  }
@@ -56,7 +56,7 @@
56
56
  }
57
57
  bs-dropdown-container &, c8y-typeahead .dropdown &, .c8y-select-v2 .dropdown & {
58
58
  &.active,
59
- &.selectable:active {
59
+ &.selectable:not(:has(c8y-li-checkbox)):active {
60
60
  .c8y-list__item__body {
61
61
 
62
62
  &:after{
@@ -2,14 +2,16 @@
2
2
  &.stroked-icon {
3
3
  position: relative;
4
4
  z-index: 0;
5
+ height: 10px;
5
6
  &:after {
6
7
  position: relative;
8
+ font-size: 1em;
7
9
  content: @dlt-c8y-icon-collapse-arrow;
8
10
  }
9
11
 
10
12
  &:before {
11
13
  position: absolute;
12
-
14
+ font-size: 1em;
13
15
  -webkit-text-stroke-width: 2px;
14
16
  -webkit-text-stroke-color: var(--c8y-icon-stroke-color, @component-background-default);
15
17
  }
@@ -32792,4 +32794,4 @@
32792
32794
  -webkit-text-stroke-color: var(--c8y-icon-stroke-color, @component-background-default);
32793
32795
  }
32794
32796
  }
32795
- }
32797
+ }
@@ -719,6 +719,7 @@ body {
719
719
  .c8y-select-v2 {
720
720
  display: block;
721
721
  height: @form-control-height-base;
722
+
722
723
  .selected-items {
723
724
  display: contents;
724
725
  }
@@ -767,4 +768,24 @@ body {
767
768
  z-index: 3;
768
769
  }
769
770
  }
771
+
772
+ &--sm{
773
+ height: @form-control-height-sm;
774
+ .input-group.input-group-dropdown {
775
+ height: @form-control-height-sm;
776
+
777
+ input.form-control {
778
+ height: calc(@form-control-height-sm - 2px)!important;
779
+ }
780
+ .input-group-btn{
781
+ height: calc(@form-control-height-sm - 2px)!important;
782
+ > button {
783
+ height: calc(@form-control-height-sm - 2px)!important;
784
+ }
785
+ }
786
+ div.form-control {
787
+ height: calc(@form-control-height-sm - 2px)!important;
788
+ }
789
+ }
790
+ }
770
791
  }
@@ -73,22 +73,7 @@
73
73
  min-height: 280px;
74
74
  }
75
75
 
76
- .card-dashboard {
77
- c8y-datapoints-graph-widget-view{
78
- flex-grow: 1;
79
- }
80
- .chart-container {
81
- max-height: calc(100% - 95px);
82
- max-width: 99.5%;
83
- }
84
76
 
85
- &:has(c8y-aggregation-picker),
86
- &:has(c8y-date-time-context-picker) {
87
- .chart-container {
88
- max-height: calc(100% - 145px);
89
- }
90
- }
91
- }
92
77
 
93
78
  @container (min-width: 150px) {
94
79
  .label-value-unit-gauge {
package/styles/_tag.less CHANGED
@@ -36,7 +36,7 @@
36
36
  align-items: center;
37
37
  gap: 6px;
38
38
  height: 20px;
39
- flex: 0 1 fit-content;
39
+ flex: 0 0 fit-content;
40
40
  .btn-clean{
41
41
  padding: 0!important;
42
42
  }