@progress/kendo-theme-core 14.7.0-dev.8 → 14.7.0-dev.9

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.
Files changed (6) hide show
  1. package/dist/meta/sassdoc-data.json +18 -18
  2. package/dist/meta/sassdoc-raw-data.json +9 -9
  3. package/package.json +1 -1
  4. package/scss/components/badge/_layout.scss +10 -0
  5. package/scss/components/badge/_theme.scss +13 -0
  6. package/scss/components/badge/_variables.scss +8 -0
package/dist/meta/sassdoc-data.json CHANGED
@@ -615,17 +615,17 @@
615
615
  {
616
616
  "description": "The sizes map of the Badge.\n",
617
617
  "commentRange": {
618
- "start": 33,
619
- "end": 34
618
+ "start": 38,
619
+ "end": 39
620
620
  },
621
621
  "context": {
622
622
  "type": "variable",
623
623
  "name": "kendo-badge-sizes",
624
- "value": "(\n sm: (\n padding-x: $kendo-badge-sm-padding-x,\n padding-y: $kendo-badge-sm-padding-y,\n font-size: $kendo-badge-sm-font-size,\n line-height: $kendo-badge-sm-line-height,\n min-width: $kendo-badge-sm-min-width\n ),\n md: (\n padding-x: $kendo-badge-md-padding-x,\n padding-y: $kendo-badge-md-padding-y,\n font-size: $kendo-badge-md-font-size,\n line-height: $kendo-badge-md-line-height,\n min-width: $kendo-badge-md-min-width\n ),\n lg: (\n padding-x: $kendo-badge-lg-padding-x,\n padding-y: $kendo-badge-lg-padding-y,\n font-size: $kendo-badge-lg-font-size,\n line-height: $kendo-badge-lg-line-height,\n min-width: $kendo-badge-lg-min-width\n )\n)",
624
+ "value": "(\n sm: (\n padding-x: $kendo-badge-sm-padding-x,\n padding-y: $kendo-badge-sm-padding-y,\n gap: $kendo-badge-sm-gap,\n font-size: $kendo-badge-sm-font-size,\n line-height: $kendo-badge-sm-line-height,\n min-width: $kendo-badge-sm-min-width\n ),\n md: (\n padding-x: $kendo-badge-md-padding-x,\n padding-y: $kendo-badge-md-padding-y,\n gap: $kendo-badge-md-gap,\n font-size: $kendo-badge-md-font-size,\n line-height: $kendo-badge-md-line-height,\n min-width: $kendo-badge-md-min-width\n ),\n lg: (\n padding-x: $kendo-badge-lg-padding-x,\n padding-y: $kendo-badge-lg-padding-y,\n gap: $kendo-badge-lg-gap,\n font-size: $kendo-badge-lg-font-size,\n line-height: $kendo-badge-lg-line-height,\n min-width: $kendo-badge-lg-min-width\n )\n)",
625
625
  "scope": "default",
626
626
  "line": {
627
- "start": 35,
628
- "end": 57
627
+ "start": 40,
628
+ "end": 65
629
629
  }
630
630
  },
631
631
  "group": [
@@ -640,8 +640,8 @@
640
640
  {
641
641
  "description": "The theme colors map of the Badge.\n",
642
642
  "commentRange": {
643
- "start": 61,
644
- "end": 62
643
+ "start": 69,
644
+ "end": 70
645
645
  },
646
646
  "context": {
647
647
  "type": "variable",
@@ -649,8 +649,8 @@
649
649
  "value": "(\"base\", \"primary\", \"secondary\", \"tertiary\", \"info\", \"success\", \"warning\", \"error\")",
650
650
  "scope": "default",
651
651
  "line": {
652
- "start": 63,
653
- "end": 63
652
+ "start": 71,
653
+ "end": 71
654
654
  }
655
655
  },
656
656
  "group": [
@@ -11059,17 +11059,17 @@
11059
11059
  {
11060
11060
  "description": "The sizes map of the Badge.\n",
11061
11061
  "commentRange": {
11062
- "start": 33,
11063
- "end": 34
11062
+ "start": 38,
11063
+ "end": 39
11064
11064
  },
11065
11065
  "context": {
11066
11066
  "type": "variable",
11067
11067
  "name": "kendo-badge-sizes",
11068
- "value": "(\n sm: (\n padding-x: $kendo-badge-sm-padding-x,\n padding-y: $kendo-badge-sm-padding-y,\n font-size: $kendo-badge-sm-font-size,\n line-height: $kendo-badge-sm-line-height,\n min-width: $kendo-badge-sm-min-width\n ),\n md: (\n padding-x: $kendo-badge-md-padding-x,\n padding-y: $kendo-badge-md-padding-y,\n font-size: $kendo-badge-md-font-size,\n line-height: $kendo-badge-md-line-height,\n min-width: $kendo-badge-md-min-width\n ),\n lg: (\n padding-x: $kendo-badge-lg-padding-x,\n padding-y: $kendo-badge-lg-padding-y,\n font-size: $kendo-badge-lg-font-size,\n line-height: $kendo-badge-lg-line-height,\n min-width: $kendo-badge-lg-min-width\n )\n)",
11068
+ "value": "(\n sm: (\n padding-x: $kendo-badge-sm-padding-x,\n padding-y: $kendo-badge-sm-padding-y,\n gap: $kendo-badge-sm-gap,\n font-size: $kendo-badge-sm-font-size,\n line-height: $kendo-badge-sm-line-height,\n min-width: $kendo-badge-sm-min-width\n ),\n md: (\n padding-x: $kendo-badge-md-padding-x,\n padding-y: $kendo-badge-md-padding-y,\n gap: $kendo-badge-md-gap,\n font-size: $kendo-badge-md-font-size,\n line-height: $kendo-badge-md-line-height,\n min-width: $kendo-badge-md-min-width\n ),\n lg: (\n padding-x: $kendo-badge-lg-padding-x,\n padding-y: $kendo-badge-lg-padding-y,\n gap: $kendo-badge-lg-gap,\n font-size: $kendo-badge-lg-font-size,\n line-height: $kendo-badge-lg-line-height,\n min-width: $kendo-badge-lg-min-width\n )\n)",
11069
11069
  "scope": "default",
11070
11070
  "line": {
11071
- "start": 35,
11072
- "end": 57
11071
+ "start": 40,
11072
+ "end": 65
11073
11073
  }
11074
11074
  },
11075
11075
  "group": [
@@ -11084,8 +11084,8 @@
11084
11084
  {
11085
11085
  "description": "The theme colors map of the Badge.\n",
11086
11086
  "commentRange": {
11087
- "start": 61,
11088
- "end": 62
11087
+ "start": 69,
11088
+ "end": 70
11089
11089
  },
11090
11090
  "context": {
11091
11091
  "type": "variable",
@@ -11093,8 +11093,8 @@
11093
11093
  "value": "(\"base\", \"primary\", \"secondary\", \"tertiary\", \"info\", \"success\", \"warning\", \"error\")",
11094
11094
  "scope": "default",
11095
11095
  "line": {
11096
- "start": 63,
11097
- "end": 63
11096
+ "start": 71,
11097
+ "end": 71
11098
11098
  }
11099
11099
  },
11100
11100
  "group": [
package/dist/meta/sassdoc-raw-data.json CHANGED
@@ -614,17 +614,17 @@
614
614
  {
615
615
  "description": "The sizes map of the Badge.\n",
616
616
  "commentRange": {
617
- "start": 33,
618
- "end": 34
617
+ "start": 38,
618
+ "end": 39
619
619
  },
620
620
  "context": {
621
621
  "type": "variable",
622
622
  "name": "kendo-badge-sizes",
623
- "value": "(\n sm: (\n padding-x: $kendo-badge-sm-padding-x,\n padding-y: $kendo-badge-sm-padding-y,\n font-size: $kendo-badge-sm-font-size,\n line-height: $kendo-badge-sm-line-height,\n min-width: $kendo-badge-sm-min-width\n ),\n md: (\n padding-x: $kendo-badge-md-padding-x,\n padding-y: $kendo-badge-md-padding-y,\n font-size: $kendo-badge-md-font-size,\n line-height: $kendo-badge-md-line-height,\n min-width: $kendo-badge-md-min-width\n ),\n lg: (\n padding-x: $kendo-badge-lg-padding-x,\n padding-y: $kendo-badge-lg-padding-y,\n font-size: $kendo-badge-lg-font-size,\n line-height: $kendo-badge-lg-line-height,\n min-width: $kendo-badge-lg-min-width\n )\n)",
623
+ "value": "(\n sm: (\n padding-x: $kendo-badge-sm-padding-x,\n padding-y: $kendo-badge-sm-padding-y,\n gap: $kendo-badge-sm-gap,\n font-size: $kendo-badge-sm-font-size,\n line-height: $kendo-badge-sm-line-height,\n min-width: $kendo-badge-sm-min-width\n ),\n md: (\n padding-x: $kendo-badge-md-padding-x,\n padding-y: $kendo-badge-md-padding-y,\n gap: $kendo-badge-md-gap,\n font-size: $kendo-badge-md-font-size,\n line-height: $kendo-badge-md-line-height,\n min-width: $kendo-badge-md-min-width\n ),\n lg: (\n padding-x: $kendo-badge-lg-padding-x,\n padding-y: $kendo-badge-lg-padding-y,\n gap: $kendo-badge-lg-gap,\n font-size: $kendo-badge-lg-font-size,\n line-height: $kendo-badge-lg-line-height,\n min-width: $kendo-badge-lg-min-width\n )\n)",
624
624
  "scope": "default",
625
625
  "line": {
626
- "start": 35,
627
- "end": 57
626
+ "start": 40,
627
+ "end": 65
628
628
  }
629
629
  },
630
630
  "group": [
@@ -639,8 +639,8 @@
639
639
  {
640
640
  "description": "The theme colors map of the Badge.\n",
641
641
  "commentRange": {
642
- "start": 61,
643
- "end": 62
642
+ "start": 69,
643
+ "end": 70
644
644
  },
645
645
  "context": {
646
646
  "type": "variable",
@@ -648,8 +648,8 @@
648
648
  "value": "(\"base\", \"primary\", \"secondary\", \"tertiary\", \"info\", \"success\", \"warning\", \"error\")",
649
649
  "scope": "default",
650
650
  "line": {
651
- "start": 63,
652
- "end": 63
651
+ "start": 71,
652
+ "end": 71
653
653
  }
654
654
  },
655
655
  "group": [
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@progress/kendo-theme-core",
3
3
  "description": "A collection of functions and mixins used for building themes for Kendo UI",
4
- "version": "14.7.0-dev.8",
4
+ "version": "14.7.0-dev.9",
5
5
  "author": "Progress",
6
6
  "license": "Apache-2.0",
7
7
  "keywords": [
package/scss/components/badge/_layout.scss CHANGED
@@ -31,6 +31,10 @@
31
31
  box-sizing: border-box;
32
32
  }
33
33
 
34
+ .k-badge-text {
35
+ padding-inline: $kendo-badge-text-padding-x;
36
+ }
37
+
34
38
  // Roundness
35
39
  @each $roundness in $kendo-badge-roundness {
36
40
  #{k-when-default($kendo-badge-default-roundness, $roundness)}
@@ -43,6 +47,7 @@
43
47
  @each $size, $size-props in $kendo-badge-sizes {
44
48
  $_padding-x: map.get( $size-props, padding-x );
45
49
  $_padding-y: map.get( $size-props, padding-y );
50
+ $_gap: map.get( $size-props, gap );
46
51
  $_font-size: map.get( $size-props, font-size );
47
52
  $_line-height: map.get( $size-props, line-height );
48
53
  $_min-width: map.get( $size-props, min-width );
@@ -54,6 +59,7 @@
54
59
  font-size: $_font-size;
55
60
  line-height: $_line-height;
56
61
  min-width: $_min-width;
62
+ gap: $_gap;
57
63
 
58
64
  &:empty {
59
65
  padding: $_padding-y;
@@ -62,6 +68,10 @@
62
68
  }
63
69
  }
64
70
  }
71
+ .k-badge:has(> .k-badge-icon:only-child) {
72
+ padding-inline: 0;
73
+ aspect-ratio: 1;
74
+ }
65
75
  .k-badge > * {
66
76
  color: inherit;
67
77
  }
package/scss/components/badge/_theme.scss CHANGED
@@ -19,6 +19,19 @@
19
19
  }
20
20
  }
21
21
 
22
+ // Tint badges
23
+ #{k-when-default($kendo-badge-default-fill-mode, "tint")}
24
+ &.k-badge-tint {
25
+ @each $name in $kendo-badge-theme-colors {
26
+ #{k-when-default($kendo-badge-default-theme-color, $name)}
27
+ &.k-badge-#{$name} {
28
+ border-color: k-color(#{$name}-subtle);
29
+ color: k-color(#{$name}-on-subtle);
30
+ background-color: k-color(#{$name}-subtle);
31
+ }
32
+ }
33
+ }
34
+
22
35
  // Outline badges
23
36
  #{k-when-default($kendo-badge-default-fill-mode, "outline")}
24
37
  &.k-badge-outline {
package/scss/components/badge/_variables.scss CHANGED
@@ -15,6 +15,11 @@ $kendo-badge-sm-padding-y: null !default;
15
15
  $kendo-badge-md-padding-y: null !default;
16
16
  $kendo-badge-lg-padding-y: null !default;
17
17
 
18
+ $kendo-badge-text-padding-x: null !default;
19
+ $kendo-badge-sm-gap: null !default;
20
+ $kendo-badge-md-gap: null !default;
21
+ $kendo-badge-lg-gap: null !default;
22
+
18
23
  $kendo-badge-font-size: null !default;
19
24
  $kendo-badge-sm-font-size: null !default;
20
25
  $kendo-badge-md-font-size: null !default;
@@ -36,6 +41,7 @@ $kendo-badge-sizes: (
36
41
  sm: (
37
42
  padding-x: $kendo-badge-sm-padding-x,
38
43
  padding-y: $kendo-badge-sm-padding-y,
44
+ gap: $kendo-badge-sm-gap,
39
45
  font-size: $kendo-badge-sm-font-size,
40
46
  line-height: $kendo-badge-sm-line-height,
41
47
  min-width: $kendo-badge-sm-min-width
@@ -43,6 +49,7 @@ $kendo-badge-sizes: (
43
49
  md: (
44
50
  padding-x: $kendo-badge-md-padding-x,
45
51
  padding-y: $kendo-badge-md-padding-y,
52
+ gap: $kendo-badge-md-gap,
46
53
  font-size: $kendo-badge-md-font-size,
47
54
  line-height: $kendo-badge-md-line-height,
48
55
  min-width: $kendo-badge-md-min-width
@@ -50,6 +57,7 @@ $kendo-badge-sizes: (
50
57
  lg: (
51
58
  padding-x: $kendo-badge-lg-padding-x,
52
59
  padding-y: $kendo-badge-lg-padding-y,
60
+ gap: $kendo-badge-lg-gap,
53
61
  font-size: $kendo-badge-lg-font-size,
54
62
  line-height: $kendo-badge-lg-line-height,
55
63
  min-width: $kendo-badge-lg-min-width