@progress/kendo-theme-bootstrap 5.0.0-beta.2 → 5.0.0-beta.3

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,7 +1,7 @@
1
1
  {
2
2
  "name": "@progress/kendo-theme-bootstrap",
3
3
  "description": "Bootstrap theme for Kendo UI",
4
- "version": "5.0.0-beta.2",
4
+ "version": "5.0.0-beta.3",
5
5
  "author": "Progress",
6
6
  "license": "Apache-2.0",
7
7
  "keywords": [
@@ -49,8 +49,8 @@
49
49
  "postpublish": "echo 'no postpublish for bootstrap theme'"
50
50
  },
51
51
  "dependencies": {
52
- "@progress/kendo-theme-default": "^5.0.0-beta.2",
52
+ "@progress/kendo-theme-default": "^5.0.0-beta.3",
53
53
  "bootstrap": "^5.1.0"
54
54
  },
55
- "gitHead": "13e32ba172a1fa6fc172c9d989974ebfccef19e6"
55
+ "gitHead": "a508e10c60c1c14b569a908ef7f8584cf449a421"
56
56
  }
@@ -75,5 +75,3 @@ $chat-message-box-bg: $kendo-input-bg !default;
75
75
  $chat-message-box-text: $kendo-input-text !default;
76
76
  $chat-message-box-border: inherit !default;
77
77
  $chat-message-box-focus-shadow: 0 0 40px rgba( $kendo-input-text, .1 ) !default;
78
-
79
- $chat-toolbar-box-scroll-button-shadow: 0 0 20px 5px $chat-bg !default;
@@ -2,7 +2,7 @@
2
2
 
3
3
 
4
4
  // Dependencies
5
- @import "../common/_index.scss";
5
+ @import "../typography/_variables.scss";
6
6
  @import "../list/_variables.scss";
7
7
 
8
8
  // Component
@@ -132,21 +132,15 @@ $kendo-checkbox-label-margin-x: map-get( $spacing, 1 ) !default;
132
132
 
133
133
  // Checkbox list
134
134
 
135
- /// The list margin checkbox.
136
- /// @group checkbox
137
- $kendo-checkbox-list-margin: 0px !default;
138
- /// The list padding checkbox.
135
+ /// The horizontal margin of list item of checkbox.
139
136
  /// @group checkbox
140
- $kendo-checkbox-list-padding: 0px !default;
137
+ $kendo-checkbox-list-spacing: map-get( $spacing, 4 ) !default;
141
138
  /// The horizontal list item padding of checkbox.
142
139
  /// @group checkbox
143
140
  $kendo-checkbox-list-item-padding-x: 0px !default;
144
141
  /// The vertical list item padding of checkbox.
145
142
  /// @group checkbox
146
143
  $kendo-checkbox-list-item-padding-y: $kendo-list-item-padding-y-md !default;
147
- /// The horizontal margin of list item of checkbox.
148
- /// @group checkbox
149
- $kendo-checkbox-list-horizontal-item-margin-x: 32px !default;
150
144
 
151
145
 
152
146
  // Checkbox ripple
@@ -18,9 +18,9 @@ $coloreditor-header-padding-y: $coloreditor-spacer !default;
18
18
  $coloreditor-header-padding-x: $coloreditor-header-padding-y !default;
19
19
  $coloreditor-header-actions-gap: ( $coloreditor-spacer / 2 ) !default;
20
20
 
21
- $coloreditor-preview-gap: 2px !default;
22
- $coloreditor-color-preview-width: 34px !default;
23
- $coloreditor-color-preview-height: 14px !default;
21
+ $coloreditor-preview-gap: map-get( $spacing, 1 ) !default;
22
+ $coloreditor-color-preview-width: 32px !default;
23
+ $coloreditor-color-preview-height: 12px !default;
24
24
 
25
25
  $coloreditor-views-padding-y: $coloreditor-spacer !default;
26
26
  $coloreditor-views-padding-x: $coloreditor-views-padding-y !default;
@@ -1,31 +1 @@
1
- // Comboboxes
2
- $combobox-select-padding-x: $kendo-button-padding-y !default;
3
- $combobox-select-padding-y: $kendo-button-padding-y !default;
4
-
5
- $combobox-bg: $kendo-input-bg !default;
6
- $combobox-text: $kendo-input-text !default;
7
- $combobox-border: $kendo-input-border !default;
8
-
9
- $combobox-hovered-bg: $kendo-input-hover-bg !default;
10
- $combobox-hovered-text: $kendo-input-hover-text !default;
11
- $combobox-hovered-border: $kendo-input-hover-border !default;
12
-
13
- $combobox-focused-bg: $kendo-input-focus-bg !default;
14
- $combobox-focused-text: $kendo-input-focus-text !default;
15
- $combobox-focused-border: $kendo-input-focus-border !default;
16
- $combobox-focused-shadow: $kendo-input-focus-shadow !default;
17
-
18
- $combobox-select-bg: $kendo-button-bg !default;
19
- $combobox-select-text: $kendo-button-text !default;
20
- $combobox-select-border: $kendo-button-border !default;
21
- $combobox-select-gradient: $kendo-button-gradient !default;
22
-
23
- $combobox-select-hovered-bg: $kendo-button-hover-bg !default;
24
- $combobox-select-hovered-text: $kendo-button-hover-text !default;
25
- $combobox-select-hovered-border: $kendo-button-hover-border !default;
26
- $combobox-select-hovered-gradient: $kendo-button-hover-gradient !default;
27
-
28
- $combobox-select-pressed-bg: $kendo-button-active-bg !default;
29
- $combobox-select-pressed-text: $kendo-button-active-text !default;
30
- $combobox-select-pressed-border: $kendo-button-active-border !default;
31
- $combobox-select-pressed-gradient: $kendo-button-active-gradient !default;
1
+ // Combobox
@@ -1,11 +1,11 @@
1
1
  @include exports( "fab/theme/bootstrap" ) {
2
2
 
3
3
  // Normal state
4
- @each $name, $color in $fab-theme-colors {
5
- .k-fab-#{$name} {
6
- @include box-shadow($fab-shadow);
7
- outline: $fab-border-width solid $color;
8
- outline-offset: -$fab-border-width;
4
+ @each $name, $color in $kendo-fab-theme-colors {
5
+ .k-fab-solid-#{$name} {
6
+ @include box-shadow($kendo-fab-shadow);
7
+ outline: $kendo-fab-border-width solid $color;
8
+ outline-offset: -$kendo-fab-border-width;
9
9
  border-color: $color;
10
10
  color: contrast-wcag( $color );
11
11
  background-color: $color;
@@ -13,10 +13,9 @@
13
13
  }
14
14
 
15
15
  // Hover state
16
- @each $name, $color in $fab-theme-colors {
17
- .k-state-hover.k-fab-#{$name},
18
- .k-state-hovered.k-fab-#{$name},
19
- .k-fab-#{$name}:hover {
16
+ @each $name, $color in $kendo-fab-theme-colors {
17
+ .k-hover.k-fab-solid-#{$name},
18
+ .k-fab-solid-#{$name}:hover {
20
19
  border-color: try-darken( $color, 10% );
21
20
  color: contrast-wcag( try-darken( $color, 7.5% ) );
22
21
  background-color: try-darken( $color, 7.5% );
@@ -24,10 +23,9 @@
24
23
  }
25
24
 
26
25
  // Focus state
27
- @each $name, $color in $fab-theme-colors {
28
- .k-fab-#{$name}.k-state-focus,
29
- .k-fab-#{$name}.k-state-focused,
30
- .k-fab-#{$name}:focus {
26
+ @each $name, $color in $kendo-fab-theme-colors {
27
+ .k-fab-solid-#{$name}.k-focus,
28
+ .k-fab-solid-#{$name}:focus {
31
29
  outline-style: solid;
32
30
  outline-width: 3px;
33
31
  outline-color: rgba( $color, .5 );
@@ -35,11 +33,11 @@
35
33
  }
36
34
 
37
35
  // Active state
38
- @each $name, $color in $fab-theme-colors {
39
- .k-state-active.k-fab-#{$name},
40
- .k-state-selected.k-fab-#{$name},
41
- .k-fab-#{$name}:active {
42
- @include box-shadow($fab-active-shadow);
36
+ @each $name, $color in $kendo-fab-theme-colors {
37
+ .k-active.k-fab-solid-#{$name},
38
+ .k-selected.k-fab-solid-#{$name},
39
+ .k-fab-solid-#{$name}:active {
40
+ @include box-shadow($kendo-fab-active-shadow);
43
41
  border-color: try-darken( $color, 12.5% );
44
42
  color: contrast-wcag( try-darken( $color, 10% ) );
45
43
  background-color: try-darken( $color, 10% );
@@ -47,10 +45,10 @@
47
45
  }
48
46
 
49
47
  // Disabled state
50
- @each $name, $color in $fab-theme-colors {
51
- .k-state-disabled.k-fab-#{$name},
52
- .k-fab-#{$name}:disabled {
53
- @include box-shadow($fab-disabled-shadow);
48
+ @each $name, $color in $kendo-fab-theme-colors {
49
+ .k-disabled.k-fab-solid-#{$name},
50
+ .k-fab-solid-#{$name}:disabled {
51
+ @include box-shadow($kendo-fab-disabled-shadow);
54
52
  background-color: try-tint( $color, 4.5 );
55
53
  color: try-tint( contrast-wcag( $color ), 5 );
56
54
  opacity: 1;
@@ -60,68 +58,65 @@
60
58
  // Items
61
59
  .k-fab-item-text {
62
60
  @include fill(
63
- $fab-item-text,
64
- $fab-item-bg,
65
- $fab-item-border
61
+ $kendo-fab-item-text,
62
+ $kendo-fab-item-bg,
63
+ $kendo-fab-item-border
66
64
  );
67
- @include box-shadow($fab-item-shadow);
65
+ @include box-shadow($kendo-fab-item-shadow);
68
66
  }
69
67
  .k-fab-item-icon {
70
68
  @include fill(
71
- $fab-item-icon-text,
72
- $fab-item-icon-bg,
73
- $fab-item-icon-border
69
+ $kendo-fab-item-icon-text,
70
+ $kendo-fab-item-icon-bg,
71
+ $kendo-fab-item-icon-border
74
72
  );
75
- @include box-shadow($fab-item-shadow);
76
- outline: $fab-border-width solid $kendo-button-bg;
77
- outline-offset: -$fab-border-width;
73
+ @include box-shadow($kendo-fab-item-shadow);
74
+ outline: $kendo-fab-border-width solid $kendo-button-bg;
75
+ outline-offset: -$kendo-fab-border-width;
78
76
  }
79
77
 
80
78
  // Hover state
81
- .k-fab-item.k-state-hover .k-fab-item-icon,
82
- .k-fab-item.k-state-hovered .k-fab-item-icon,
79
+ .k-fab-item.k-hover .k-fab-item-icon,
83
80
  .k-fab-item:hover .k-fab-item-icon {
84
- @include box-shadow($fab-item-shadow);
85
- outline: $fab-border-width solid try-darken( $fab-item-icon-border, 10% );
86
- outline-offset: -$fab-border-width;
87
- border-color: try-darken( $fab-item-icon-border, 10% );
88
- color: contrast-wcag( try-darken( $fab-item-icon-bg, 7.5% ) );
89
- background-color: try-darken( $fab-item-icon-bg, 7.5% );
81
+ @include box-shadow($kendo-fab-item-shadow);
82
+ outline: $kendo-fab-border-width solid try-darken( $kendo-fab-item-icon-border, 10% );
83
+ outline-offset: -$kendo-fab-border-width;
84
+ border-color: try-darken( $kendo-fab-item-icon-border, 10% );
85
+ color: contrast-wcag( try-darken( $kendo-fab-item-icon-bg, 7.5% ) );
86
+ background-color: try-darken( $kendo-fab-item-icon-bg, 7.5% );
90
87
  }
91
88
 
92
89
  // Focus state
93
90
  .k-fab-item:focus .k-fab-item-text,
94
91
  .k-fab-item:focus .k-fab-item-icon,
95
- .k-fab-item.k-state-focus .k-fab-item-text,
96
- .k-fab-item.k-state-focus .k-fab-item-icon,
97
- .k-fab-item.k-state-focused .k-fab-item-text,
98
- .k-fab-item.k-state-focused .k-fab-item-icon {
92
+ .k-fab-item.k-focus .k-fab-item-text,
93
+ .k-fab-item.k-focus .k-fab-item-icon {
99
94
  outline-style: solid;
100
95
  outline-width: 3px;
101
- outline-color: rgba( $fab-item-icon-border, .5 );
96
+ outline-color: rgba( $kendo-fab-item-icon-border, .5 );
102
97
  }
103
98
 
104
99
  // Active state
105
- .k-fab-item.k-state-active .k-fab-item-icon,
100
+ .k-fab-item.k-active .k-fab-item-icon,
106
101
  .k-fab-item:active .k-fab-item-icon {
107
- @include box-shadow($fab-item-active-shadow);
108
- outline: $fab-border-width solid try-darken( $fab-item-icon-border, 12.5% );
109
- outline-offset: -$fab-border-width;
110
- border-color: try-darken( $fab-item-icon-border, 12.5% );
111
- color: contrast-wcag( try-darken( $fab-item-icon-bg, 10% ) );
112
- background-color: try-darken( $fab-item-icon-bg, 10% );
102
+ @include box-shadow($kendo-fab-item-active-shadow);
103
+ outline: $kendo-fab-border-width solid try-darken( $kendo-fab-item-icon-border, 12.5% );
104
+ outline-offset: -$kendo-fab-border-width;
105
+ border-color: try-darken( $kendo-fab-item-icon-border, 12.5% );
106
+ color: contrast-wcag( try-darken( $kendo-fab-item-icon-bg, 10% ) );
107
+ background-color: try-darken( $kendo-fab-item-icon-bg, 10% );
113
108
  }
114
109
 
115
110
  // Disabled state
116
- .k-fab-item.k-state-disabled,
111
+ .k-fab-item.k-disabled,
117
112
  .k-fab-item:disabled {
118
113
  opacity: 1;
119
114
 
120
115
  .k-fab-item-text,
121
116
  .k-fab-item-icon {
122
- @include box-shadow($fab-item-disabled-shadow);
123
- background-color: try-tint( $fab-item-bg, 8 );
124
- color: try-tint( $fab-item-text, 8 );
117
+ @include box-shadow($kendo-fab-item-disabled-shadow);
118
+ background-color: try-tint( $kendo-fab-item-bg, 8 );
119
+ color: try-tint( $kendo-fab-item-text, 8 );
125
120
  }
126
121
  }
127
122
 
@@ -1,74 +1,130 @@
1
1
  // Floating Action Button
2
- $fab-padding-x: $padding-x !default;
3
- $fab-padding-y: $fab-padding-x !default;
4
- $fab-border-width: 1px !default;
5
- $fab-border-radius: $border-radius / 2 !default;
6
- $fab-font-family: $font-family !default;
7
- $fab-font-size: $font-size !default;
8
- $fab-line-height: $line-height !default;
9
2
 
10
- $fab-padding-x-sm: ( $fab-padding-x / 2 ) !default;
11
- $fab-padding-y-sm: ( $fab-padding-y / 2 ) !default;
12
-
13
- $fab-padding-x-md: $fab-padding-x !default;
14
- $fab-padding-y-md: $fab-padding-y !default;
15
-
16
- $fab-padding-x-lg: ( $fab-padding-x * 1.5 ) !default;
17
- $fab-padding-y-lg: ( $fab-padding-y * 1.5 ) !default;
18
-
19
- $fab-icon-width: 24px !default;
20
- $fab-icon-height: $fab-icon-width !default;
21
- $fab-icon-spacing: map-get( $spacing, 1 ) / 2 !default;
22
-
23
- $fab-items-padding-x: 0px !default;
24
- $fab-items-padding-y: map-get( $spacing, 4 ) !default;
25
-
26
- $fab-item-text-padding-x: map-get( $spacing, 1 ) !default;
27
- $fab-item-text-padding-y: $fab-item-text-padding-x !default;
28
- $fab-item-text-border-width: 1px !default;
29
- $fab-item-text-border-radius: 4px !default;
30
- $fab-item-text-font-size: $font-size-xs !default;
31
- $fab-item-text-line-height: 14px !default;
32
-
33
- $fab-item-icon-padding-x: map-get( $spacing, 2 ) !default;
34
- $fab-item-icon-padding-y: $fab-item-icon-padding-x !default;
35
- $fab-item-icon-border-width: 0 !default;
36
- $fab-item-icon-border-radius: 50% !default;
37
- $fab-item-icon-width: 24px !default;
38
- $fab-item-icon-height: $fab-item-icon-width !default;
39
-
40
- $fab-sizes: (
41
- sm: map-get( $spacing, 4 ),
42
- md: map-get( $spacing, 8 ),
43
- lg: map-get( $spacing, 16 )
44
- ) !default;
45
-
46
- $fab-theme-colors: $theme-colors !default;
47
-
48
- $fab-shadow: 0px 6px 10px rgba(0, 0, 0, .14), 0px 1px 18px rgba(0, 0, 0, .12), 0px 3px 5px rgba(0, 0, 0, .2) !default;
49
- $fab-disabled-shadow: 0px 6px 10px try-tint( rgba(0, 0, 0, .14), .5 ), 0px 1px 18px try-tint( rgba(0, 0, 0, .12), .5 ), 0px 3px 5px try-tint( rgba(0, 0, 0, .2), .5 ) !default;
50
- $fab-active-shadow: null !default;
51
-
52
- $fab-item-text: $component-text !default;
53
- $fab-item-bg: $component-bg !default;
54
- $fab-item-border: $component-border !default;
55
-
56
- $fab-item-icon-text: $kendo-button-text !default;
57
- $fab-item-icon-bg: $kendo-button-bg !default;
58
- $fab-item-icon-border: $kendo-button-border !default;
59
-
60
- $fab-item-shadow: $fab-shadow !default;
61
- $fab-item-disabled-shadow: $fab-disabled-shadow !default;
62
- $fab-item-active-shadow: $fab-active-shadow !default;
63
-
64
- $fab-border-width-sm: $fab-border-width !default;
65
- $fab-line-height-sm: $fab-line-height !default;
66
- $fab-size-sm: calc( #{$fab-line-height-sm * 1em} + #{$fab-padding-y-sm * 2} + #{$fab-border-width-sm * 2} ) !default;
67
-
68
- $fab-border-width-md: $fab-border-width !default;
69
- $fab-line-height-md: $fab-line-height !default;
70
- $fab-size-md: calc( #{$fab-line-height-md * 1em} + #{$fab-padding-y-md * 2} + #{$fab-border-width-md * 2} ) !default;
71
-
72
- $fab-border-width-lg: $fab-border-width !default;
73
- $fab-line-height-lg: $fab-line-height !default;
74
- $fab-size-lg: calc( #{$fab-line-height-lg * 1em} + #{$fab-padding-y-lg * 2} + #{$fab-border-width-lg * 2} ) !default;
3
+ /// Width of the border around the FAB.
4
+ /// @group floating-action-button
5
+ $kendo-fab-border-width: 1px !default;
6
+ /// Border radius of the FAB.
7
+ /// @group floating-action-button
8
+ $kendo-fab-border-radius: $border-radius / 2 !default;
9
+ /// Font family of the FAB.
10
+ /// @group floating-action-button
11
+ $kendo-fab-font-family: $font-family !default;
12
+ /// Font size of the FAB.
13
+ /// @group floating-action-button
14
+ $kendo-fab-font-size: $font-size !default;
15
+ /// Line height of the FAB.
16
+ /// @group floating-action-button
17
+ $kendo-fab-line-height: $line-height !default;
18
+
19
+ /// Horizontal padding of the FAB.
20
+ /// @group floating-action-button
21
+ $kendo-fab-padding-x: $padding-x !default;
22
+ $kendo-fab-padding-x-sm: ( $kendo-fab-padding-x / 2 ) !default;
23
+ $kendo-fab-padding-x-md: $kendo-fab-padding-x !default;
24
+ $kendo-fab-padding-x-lg: ( $kendo-fab-padding-x * 1.5 ) !default;
25
+
26
+ /// Vertical padding of the FAB.
27
+ /// @group floating-action-button
28
+ $kendo-fab-padding-y: $kendo-fab-padding-x !default;
29
+ $kendo-fab-padding-y-sm: ( $kendo-fab-padding-y / 2 ) !default;
30
+ $kendo-fab-padding-y-md: $kendo-fab-padding-y !default;
31
+ $kendo-fab-padding-y-lg: ( $kendo-fab-padding-y * 1.5 ) !default;
32
+
33
+ /// FAB icon width.
34
+ /// @group floating-action-button
35
+ $kendo-fab-icon-width: 24px !default;
36
+ /// FAB icon height.
37
+ /// @group floating-action-button
38
+ $kendo-fab-icon-height: $kendo-fab-icon-width !default;
39
+ /// FAB icon spacing.
40
+ /// @group floating-action-button
41
+ $kendo-fab-icon-spacing: map-get( $spacing, 1 ) / 2 !default;
42
+
43
+ /// FAB items horizontal padding.
44
+ /// @group floating-action-button
45
+ $kendo-fab-items-padding-x: 0px !default;
46
+ /// FAB items vertical padding.
47
+ /// @group floating-action-button
48
+ $kendo-fab-items-padding-y: map-get( $spacing, 4 ) !default;
49
+
50
+ /// FAB item text horizontal padding.
51
+ /// @group floating-action-button
52
+ $kendo-fab-item-text-padding-x: map-get( $spacing, 1 ) !default;
53
+ /// FAB item text vertical padding.
54
+ /// @group floating-action-button
55
+ $kendo-fab-item-text-padding-y: $kendo-fab-item-text-padding-x !default;
56
+ /// Width of the FAB item text border.
57
+ /// @group floating-action-button
58
+ $kendo-fab-item-text-border-width: 1px !default;
59
+ /// Border radius of the FAB item text.
60
+ /// @group floating-action-button
61
+ $kendo-fab-item-text-border-radius: 4px !default;
62
+ /// Font size of the FAB item text.
63
+ /// @group floating-action-button
64
+ $kendo-fab-item-text-font-size: $font-size-xs !default;
65
+ /// Line height of the FAB item text.
66
+ /// @group floating-action-button
67
+ $kendo-fab-item-text-line-height: 14px !default;
68
+
69
+ /// FAB item icon horizontal padding.
70
+ /// @group floating-action-button
71
+ $kendo-fab-item-icon-padding-x: map-get( $spacing, 2 ) !default;
72
+ /// FAB item icon vertical padding.
73
+ /// @group floating-action-button
74
+ $kendo-fab-item-icon-padding-y: $kendo-fab-item-icon-padding-x !default;
75
+ /// Width of the FAB item icon border.
76
+ /// @group floating-action-button
77
+ $kendo-fab-item-icon-border-width: 0 !default;
78
+ /// Border radius of the FAB item icon.
79
+ /// @group floating-action-button
80
+ $kendo-fab-item-icon-border-radius: 50% !default;
81
+ /// Width of the FAB item icon.
82
+ /// @group floating-action-button
83
+ $kendo-fab-item-icon-width: 24px !default;
84
+ /// height of the FAB item icon.
85
+ /// @group floating-action-button
86
+ $kendo-fab-item-icon-height: $kendo-fab-item-icon-width !default;
87
+
88
+ /// Theme colors map for the FAB.
89
+ /// @group floating-action-button
90
+ $kendo-fab-theme-colors: $theme-colors !default;
91
+
92
+ /// The base shadow of the FAB.
93
+ /// @group floating-action-button
94
+ $kendo-fab-shadow: 0px 6px 10px rgba(0, 0, 0, .14), 0px 1px 18px rgba(0, 0, 0, .12), 0px 3px 5px rgba(0, 0, 0, .2) !default;
95
+ /// The disabled shadow of the FAB.
96
+ /// @group floating-action-button
97
+ $kendo-fab-disabled-shadow: 0px 6px 10px try-tint( rgba(0, 0, 0, .14), .5 ), 0px 1px 18px try-tint( rgba(0, 0, 0, .12), .5 ), 0px 3px 5px try-tint( rgba(0, 0, 0, .2), .5 ) !default;
98
+ /// The active shadow of the FAB.
99
+ /// @group floating-action-button
100
+ $kendo-fab-active-shadow: null !default;
101
+
102
+ /// The base text color of the FAB item.
103
+ /// @group floating-action-button
104
+ $kendo-fab-item-text: $component-text !default;
105
+ /// The base background color of the FAB item.
106
+ /// @group floating-action-button
107
+ $kendo-fab-item-bg: $component-bg !default;
108
+ /// The base border color of the FAB item.
109
+ /// @group floating-action-button
110
+ $kendo-fab-item-border: $component-border !default;
111
+
112
+ /// The base text color of the FAB item icon.
113
+ /// @group floating-action-button
114
+ $kendo-fab-item-icon-text: $kendo-button-text !default;
115
+ /// The base background color of the FAB item icon.
116
+ /// @group floating-action-button
117
+ $kendo-fab-item-icon-bg: $kendo-button-bg !default;
118
+ /// The base border color of the FAB item icon.
119
+ /// @group floating-action-button
120
+ $kendo-fab-item-icon-border: $kendo-button-border !default;
121
+
122
+ /// The base shadow of the FAB item.
123
+ /// @group floating-action-button
124
+ $kendo-fab-item-shadow: $kendo-fab-shadow !default;
125
+ /// The disabled shadow of the FAB item.
126
+ /// @group floating-action-button
127
+ $kendo-fab-item-disabled-shadow: $kendo-fab-disabled-shadow !default;
128
+ /// The active shadow of the FAB item.
129
+ /// @group floating-action-button
130
+ $kendo-fab-item-active-shadow: $kendo-fab-active-shadow !default;
File without changes
@@ -132,21 +132,21 @@ $grid-sticky-selected-alt-bg: shade($grid-sticky-selected-bg, .4) !default;
132
132
  $grid-sticky-hovered-bg: try-shade( $grid-bg ) !default;
133
133
  $grid-sticky-selected-hovered-bg: shade($grid-sticky-selected-bg, .7) !default;
134
134
 
135
- $grid-filter-menu-width: 250px !default;
135
+ $grid-column-menu-width: 250px !default;
136
136
 
137
137
  $grid-filter-menu-check-all-border-bottom-width: 1px !default;
138
138
 
139
139
  $grid-filter-menu-item-spacing-x: map-get( $spacing, 6 ) !default;
140
140
  $grid-filter-menu-item-spacing-y: map-get( $spacing, 2 ) !default;
141
141
 
142
- $grid-column-menu-popup-padding-x: 0 !default;
143
- $grid-column-menu-popup-padding-y: $padding-y !default;
142
+ $grid-column-menu-popup-padding-x: null !default;
143
+ $grid-column-menu-popup-padding-y: null !default;
144
144
 
145
- $grid-column-menu-item-padding-x: $padding-x-lg !default;
146
- $grid-column-menu-item-padding-y: $padding-y-sm !default;
145
+ $grid-column-menu-item-padding-x: $kendo-menu-popup-item-padding-x-md !default;
146
+ $grid-column-menu-item-padding-y: $kendo-menu-popup-item-padding-y-md !default;
147
147
 
148
- $grid-column-menu-list-item-padding-x: $padding-x-lg !default;
149
- $grid-column-menu-list-item-padding-y: $padding-y-sm !default;
148
+ $grid-column-menu-list-item-padding-x: $kendo-list-item-padding-x-md !default;
149
+ $grid-column-menu-list-item-padding-y: $kendo-list-item-padding-y-md !default;
150
150
 
151
151
  $grid-column-menu-items-wrap-padding-x: 0 !default;
152
152
  $grid-column-menu-items-wrap-padding-y: map-get( $spacing, 2 ) !default;
@@ -13,6 +13,7 @@ $imageeditor-content-border-width: 1px !default;
13
13
 
14
14
  $imageeditor-action-pane-padding-y: map-get( $spacing, 8 ) !default;
15
15
  $imageeditor-action-pane-padding-x: map-get( $spacing, 4 ) !default;
16
+ $imageeditor-action-pane-width: if( $imageeditor-content-border-width == null, 240px, calc(240px + #{$imageeditor-content-border-width}) );
16
17
 
17
18
  $imageeditor-crop-border-width: 1px !default;
18
19
  $imageeditor-crop-border-style: dashed !default;
package/scss/index.scss CHANGED
@@ -21,6 +21,7 @@
21
21
  @import "popup/_index.scss";
22
22
  @import "ripple/_index.scss";
23
23
  @import "table/_index.scss";
24
+ @import "virtual-scroller/_index.scss";
24
25
 
25
26
 
26
27
  // Indicators
@@ -13,17 +13,17 @@ $kendo-input-line-height: $input-line-height !default;
13
13
 
14
14
  $kendo-input-padding-x-sm: $input-padding-x-sm !default;
15
15
  $kendo-input-padding-y-sm: $input-padding-y-sm !default;
16
- $kendo-input-font-size-sm: $input-font-size-sm !default;
16
+ $kendo-input-font-size-sm: $font-size-md !default;
17
17
  $kendo-input-line-height-sm: $line-height-md !default;
18
18
 
19
19
  $kendo-input-padding-x-md: $input-padding-x !default;
20
20
  $kendo-input-padding-y-md: $input-padding-y !default;
21
- $kendo-input-font-size-md: $input-font-size !default;
21
+ $kendo-input-font-size-md: $font-size-md !default;
22
22
  $kendo-input-line-height-md: $line-height-md !default;
23
23
 
24
24
  $kendo-input-padding-x-lg: $input-padding-x-lg !default;
25
25
  $kendo-input-padding-y-lg: $input-padding-y-lg !default;
26
- $kendo-input-font-size-lg: $input-font-size-lg !default;
26
+ $kendo-input-font-size-lg: $font-size-md !default;
27
27
  $kendo-input-line-height-lg: $line-height-md !default;
28
28
 
29
29
  $kendo-input-sizes: (
@@ -3,6 +3,7 @@
3
3
 
4
4
  // Dependencies
5
5
  @import "../common/_index.scss";
6
+ @import "../checkbox/_index.scss";
6
7
 
7
8
 
8
9
  // Component
@@ -1,21 +1 @@
1
1
  @import "~@progress/kendo-theme-default/scss/list/_theme.scss";
2
-
3
- @include exports( "list/theme/bootstrap" ) {
4
-
5
- .k-list {}
6
-
7
- .k-list-item:focus,
8
- .k-list-item.k-focus,
9
- .k-list-optionlabel:focus,
10
- .k-list-optionlabel.k-focus {
11
- &:hover,
12
- &.k-hover {
13
- box-shadow: inset 0 0 0 3px rgba($kendo-list-item-hover-text, .15);
14
- }
15
-
16
- &.k-selected {
17
- box-shadow: inset 0 0 0 3px rgba($kendo-list-item-selected-text, .15);
18
- }
19
- }
20
-
21
- }
@@ -1,7 +1,7 @@
1
1
  // Listbox
2
2
  $listbox-margin: 5px !default;
3
3
  $listbox-button-margin: $padding-x !default;
4
- $listbox-width: 12.4em !default;
4
+ $listbox-width: 10em !default;
5
5
  $listbox-default-height: 200px !default;
6
6
 
7
7
  $listbox-border-width: 1px !default;
@@ -1,11 +1 @@
1
1
  @import "~@progress/kendo-theme-default/scss/menu/_theme.scss";
2
-
3
- @include exports("menu/theme/bootstrap") {
4
-
5
- .k-context-menu-popup {
6
- .k-header {
7
- color: inherit;
8
- }
9
- }
10
-
11
- }
@@ -31,7 +31,7 @@ $menu-item-expanded-gradient: null !default;
31
31
 
32
32
  $menu-item-focus-shadow: inset 0 0 0 3px rgba( $menu-text, .15 ) !default;
33
33
 
34
- $menu-separator-spacing: 0px !default;
34
+ $menu-separator-spacing: map-get( $spacing, 1 ) !default;
35
35
 
36
36
  $menu-scroll-button-bg: $menu-bg !default;
37
37
  $menu-scroll-button-text: rgba( $menu-text, .5 ) !default;
@@ -111,6 +111,18 @@ $kendo-menu-popup-item-padding-end-sm: calc( #{$kendo-menu-popup-item-padding-x-
111
111
  $kendo-menu-popup-item-padding-end-md: calc( #{$kendo-menu-popup-item-padding-x-md * 2} + #{$icon-size} ) !default;
112
112
  $kendo-menu-popup-item-padding-end-lg: calc( #{$kendo-menu-popup-item-padding-x-lg * 2} + #{$icon-size} ) !default;
113
113
 
114
+ /// The start margin of the menu item expand icon.
115
+ /// @group menu-popup-item
116
+ $kendo-menu-popup-item-icon-margin-start-sm: $kendo-menu-popup-item-padding-x-sm !default;
117
+ $kendo-menu-popup-item-icon-margin-start: $kendo-menu-popup-item-padding-x-md !default;
118
+ $kendo-menu-popup-item-icon-margin-start-lg: $kendo-menu-popup-item-padding-x-lg !default;
119
+
120
+ /// The end margin of the menu item expand icon.
121
+ /// @group menu-popup-item
122
+ $kendo-menu-popup-item-icon-margin-end-sm: calc( -1 * (#{$kendo-menu-popup-item-padding-end-sm} - #{$kendo-menu-popup-item-padding-x-sm / 2}) ) !default;
123
+ $kendo-menu-popup-item-icon-margin-end: calc( -1 * (#{$kendo-menu-popup-item-padding-end-md} - #{$kendo-menu-popup-item-padding-x-md / 2}) ) !default;
124
+ $kendo-menu-popup-item-icon-margin-end-lg: calc( -1 * (#{$kendo-menu-popup-item-padding-end-lg} - #{$kendo-menu-popup-item-padding-x-lg / 2}) ) !default;
125
+
114
126
  /// The spacing between the menu items in popup.
115
127
  /// @group menu-popup-item
116
128
  $kendo-menu-popup-item-spacing: 0px !default;