kendo-calendar-default-size | "md" | "md" | Default: "md"Computed: "md" |
| Description: The default size of the Calendar.
|
kendo-calendar-border-width | 1px | 1px | Default: 1pxComputed: 1px |
| Description: The width of the border around the Calendar.
|
kendo-calendar-font-family | var(--kendo-font-family) | var(--kendo-font-family) | Default: var(--kendo-font-family)Computed: var(--kendo-font-family) |
| Description: The font family of the Calendar.
|
kendo-calendar-font-size | null | null | Default: nullComputed: null |
| Description: The font size of the Calendar.
|
kendo-calendar-line-height | null | null | Default: nullComputed: null |
| Description: The line height of the Calendar.
|
kendo-calendar-border-radius | 0 | 0 | Default: 0Computed: 0 |
| Description: The border-radius of the Calendar.
|
kendo-calendar-cell-size | 32px | 32px | Default: 32pxComputed: 32px |
| Description: The size of the cells in the Calendar.
|
kendo-calendar-bg | k-color(surface-alt) | var(--kendo-color-surface-alt) | Default: k-color(surface-alt)Computed: var(--kendo-color-surface-alt) |
| Description: The background color of the Calendar.
|
kendo-calendar-text | k-color(on-app-surface) | var(--kendo-color-on-app-surface) | Default: k-color(on-app-surface)Computed: var(--kendo-color-on-app-surface) |
| Description: The text color of the Calendar.
|
kendo-calendar-border | k-color(border) | var(--kendo-color-border) | Default: k-color(border)Computed: var(--kendo-color-border) |
| Description: The border color of the Calendar.
|
kendo-calendar-header-padding-x | k-spacing(1) | var(--kendo-spacing-1) | Default: k-spacing(1)Computed: var(--kendo-spacing-1) |
| Description: The horizontal padding of the header in the Calendar.
|
kendo-calendar-header-padding-y | k-spacing(1) | var(--kendo-spacing-1) | Default: k-spacing(1)Computed: var(--kendo-spacing-1) |
| Description: The vertical padding of the header in the Calendar.
|
kendo-calendar-header-border-width | 1px | 1px | Default: 1pxComputed: 1px |
| Description: The border width of the header in the Calendar.
|
kendo-calendar-header-bg | k-color(surface) | var(--kendo-color-surface) | Default: k-color(surface)Computed: var(--kendo-color-surface) |
| Description: The background color of the header in the Calendar.
|
kendo-calendar-header-border | k-color(border) | var(--kendo-color-border) | Default: k-color(border)Computed: var(--kendo-color-border) |
| Description: The border color of the header in the Calendar.
|
kendo-calendar-header-gradient | null | null | Default: nullComputed: null |
| Description: The gradient of the header in the Calendar.
|
kendo-calendar-header-shadow | k-elevation(1) | var(--kendo-elevation-1) | Default: k-elevation(1)Computed: var(--kendo-elevation-1) |
| Description: The shadow of the header in the Calendar.
|
kendo-calendar-nav-gap | null | null | Default: nullComputed: null |
| Description: The gap between the items in the navigation of the Calendar.
|
kendo-calendar-footer-padding-x | k-spacing(4) | var(--kendo-spacing-4) | Default: k-spacing(4)Computed: var(--kendo-spacing-4) |
| Description: The horizontal padding of the footer in the Calendar.
|
kendo-calendar-footer-padding-y | k-spacing(2) | var(--kendo-spacing-2) | Default: k-spacing(2)Computed: var(--kendo-spacing-2) |
| Description: The vertical padding of the footer in the Calendar.
|
kendo-calendar-cell-padding-x | .25em | 0.25em | Default: .25emComputed: 0.25em |
| Description: The horizontal padding of the cells in the Calendar.
|
kendo-calendar-cell-padding-y | $kendo-calendar-cell-padding-x | 0.25em | Default: $kendo-calendar-cell-padding-xComputed: 0.25em |
| Description: The vertical padding of the cells in the Calendar.
|
kendo-calendar-cell-border-radius | k-border-radius(md) | var(--kendo-border-radius-md) | Default: k-border-radius(md)Computed: var(--kendo-border-radius-md) |
| Description: The border radius of the cells in the Calendar.
|
kendo-calendar-header-cell-padding-x | null | null | Default: nullComputed: null |
| Description: The horizontal padding of the header cells in the Calendar.
|
kendo-calendar-header-cell-padding-y | null | null | Default: nullComputed: null |
| Description: The vertical padding of the header cells in the Calendar.
|
kendo-calendar-header-cell-width | $kendo-calendar-cell-size | 32px | Default: $kendo-calendar-cell-sizeComputed: 32px |
| Description: The width of the header cells in the Calendar.
|
kendo-calendar-header-cell-height | $kendo-calendar-cell-size | 32px | Default: $kendo-calendar-cell-sizeComputed: 32px |
| Description: The height of the header cells in the Calendar.
|
kendo-calendar-header-cell-font-size | var(--kendo-font-size-sm) | var(--kendo-font-size-sm) | Default: var(--kendo-font-size-sm)Computed: var(--kendo-font-size-sm) |
| Description: The font size of the header cells in the Calendar.
|
kendo-calendar-header-cell-line-height | 2 | 2 | Default: 2Computed: 2 |
| Description: The line height of the header cells in the Calendar.
|
kendo-calendar-header-cell-text | k-color(subtle) | var(--kendo-color-subtle) | Default: k-color(subtle)Computed: var(--kendo-color-subtle) |
| Description: The text color of the header cells in the Calendar.
|
kendo-calendar-header-cell-opacity | null | null | Default: nullComputed: null |
| Description: The opacity of the header cells in the Calendar.
|
kendo-calendar-caption-padding-x | k-spacing(2) | var(--kendo-spacing-2) | Default: k-spacing(2)Computed: var(--kendo-spacing-2) |
| Description: The horizontal padding of the caption in the Calendar.
|
kendo-calendar-caption-padding-y | k-spacing(1) | var(--kendo-spacing-1) | Default: k-spacing(1)Computed: var(--kendo-spacing-1) |
| Description: The vertical padding of the caption in the Calendar.
|
kendo-calendar-caption-height | $kendo-calendar-cell-size | 32px | Default: $kendo-calendar-cell-sizeComputed: 32px |
| Description: The height of the caption in the Calendar.
|
kendo-calendar-caption-font-size | null | null | Default: nullComputed: null |
| Description: The font size of the caption in the Calendar.
|
kendo-calendar-caption-line-height | null | null | Default: nullComputed: null |
| Description: The line height of the caption in the Calendar.
|
kendo-calendar-caption-font-weight | var(--kendo-font-weight-bold) | var(--kendo-font-weight-bold) | Default: var(--kendo-font-weight-bold)Computed: var(--kendo-font-weight-bold) |
| Description: The font weight of the caption in the Calendar.
|
kendo-calendar-week-number-font-size | $kendo-font-size-sm | 0.75rem | Default: $kendo-font-size-smComputed: 0.75rem |
| Description: The font size of the week number cells in the Calendar.
|
kendo-calendar-view-width | ($kendo-calendar-cell-size * 8) | 256px | Default: ($kendo-calendar-cell-size * 8)Computed: 256px |
| Description: The width of the Calendar view.
|
kendo-calendar-view-height | ($kendo-calendar-cell-size * 7) | 224px | Default: ($kendo-calendar-cell-size * 7)Computed: 224px |
| Description: The height of the Calendar view.
|
kendo-calendar-view-gap | k-spacing(4) | var(--kendo-spacing-4) | Default: k-spacing(4)Computed: var(--kendo-spacing-4) |
| Description: The gap between the items in the Calendar view.
|
kendo-calendar-weekend-bg | null | null | Default: nullComputed: null |
| Description: The background color of the weekend cells in the Calendar.
|
kendo-calendar-weekend-text | null | null | Default: nullComputed: null |
| Description: The text color of the weekend cells in the Calendar.
|
kendo-calendar-today-style | color | color | Default: colorComputed: color |
| Description: The style of the current day in the Calendar.
|
kendo-calendar-today-color | k-color(primary-on-surface) | var(--kendo-color-primary-on-surface) | Default: k-color(primary-on-surface)Computed: var(--kendo-color-primary-on-surface) |
| Description: The color of the current day in the Calendar.
|
kendo-calendar-today-font-weight | var(--kendo-font-weight-bold) | var(--kendo-font-weight-bold) | Default: var(--kendo-font-weight-bold)Computed: var(--kendo-font-weight-bold) |
| Description: The font weight of the current day in the Calendar.
|
kendo-calendar-today-box-shadow | null | null | Default: nullComputed: null |
| Description: The box shadow of the current day in the Calendar.
|
kendo-calendar-week-number-bg | null | null | Default: nullComputed: null |
| Description: The background color of the week number cells in the Calendar.
|
kendo-calendar-week-number-text | $kendo-calendar-header-cell-text | var(--kendo-color-subtle) | Default: $kendo-calendar-header-cell-textComputed: var(--kendo-color-subtle) |
| Description: The text color of the week number cells in the Calendar.
|
kendo-calendar-other-month-bg | null | null | Default: nullComputed: null |
| Description: The background color of the preceding/subsequent month cells in the Calendar.
|
kendo-calendar-other-month-text | $kendo-calendar-header-cell-text | var(--kendo-color-subtle) | Default: $kendo-calendar-header-cell-textComputed: var(--kendo-color-subtle) |
| Description: The text color of the preceding/subsequent month cells in the Calendar.
|
kendo-calendar-cell-border | null | null | Default: nullComputed: null |
| Description: The border color of the cells in the Calendar.
|
kendo-calendar-cell-hover-bg | color-mix( in srgb, currentColor 8%, transparent ) | color-mix(in srgb, currentColor 8%, transparent) | Default: color-mix( in srgb, currentColor 8%, transparent )Computed: color-mix(in srgb, currentColor 8%, transparent) |
| Description: The background color of the hovered cells in the Calendar.
|
kendo-calendar-cell-hover-text | k-color(on-app-surface) | var(--kendo-color-on-app-surface) | Default: k-color(on-app-surface)Computed: var(--kendo-color-on-app-surface) |
| Description: The text color of the hovered cells in the Calendar.
|
kendo-calendar-cell-hover-border | k-color(border) | var(--kendo-color-border) | Default: k-color(border)Computed: var(--kendo-color-border) |
| Description: The border color of the hovered cells in the Calendar.
|
kendo-calendar-cell-hover-gradient | null | null | Default: nullComputed: null |
| Description: The gradient of the hovered cells in the Calendar.
|
kendo-calendar-cell-selected-bg | k-color(primary) | var(--kendo-color-primary) | Default: k-color(primary)Computed: var(--kendo-color-primary) |
| Description: The background color of the selected cells in the Calendar.
|
kendo-calendar-cell-selected-text | k-color(on-primary) | var(--kendo-color-on-primary) | Default: k-color(on-primary)Computed: var(--kendo-color-on-primary) |
| Description: The text color of the selected cells in the Calendar.
|
kendo-calendar-cell-selected-border | k-color(border) | var(--kendo-color-border) | Default: k-color(border)Computed: var(--kendo-color-border) |
| Description: The border color of the selected cells in the Calendar.
|
kendo-calendar-cell-selected-gradient | null | null | Default: nullComputed: null |
| Description: The gradient of the selected cells in the Calendar.
|
kendo-calendar-cell-selected-hover-bg | k-color(primary-hover) | var(--kendo-color-primary-hover) | Default: k-color(primary-hover)Computed: var(--kendo-color-primary-hover) |
| Description: The background color of the selected and hovered cells in the Calendar.
|
kendo-calendar-cell-selected-hover-text | k-color(on-primary) | var(--kendo-color-on-primary) | Default: k-color(on-primary)Computed: var(--kendo-color-on-primary) |
| Description: The text color of the selected and hovered cells in the Calendar.
|
kendo-calendar-cell-selected-hover-border | null | null | Default: nullComputed: null |
| Description: The border color of the selected and hovered cells in the Calendar.
|
kendo-calendar-cell-selected-hover-gradient | null | null | Default: nullComputed: null |
| Description: The gradient of the selected and hovered cells in the Calendar.
|
kendo-calendar-cell-focus-shadow | inset 0 0 0 2px color-mix(in srgb, currentColor 8%, transparent) | (inset 0 0 0 2px color-mix(in srgb, currentColor 8%, transparent)) | Default: inset 0 0 0 2px color-mix(in srgb, currentColor 8%, transparent)Computed: (inset 0 0 0 2px color-mix(in srgb, currentColor 8%, transparent)) |
| Description: The shadow of the focused cells in the Calendar.
|
kendo-calendar-cell-selected-focus-shadow | $kendo-calendar-cell-focus-shadow | (inset 0 0 0 2px color-mix(in srgb, currentColor 8%, transparent)) | Default: $kendo-calendar-cell-focus-shadowComputed: (inset 0 0 0 2px color-mix(in srgb, currentColor 8%, transparent)) |
| Description: The shadow of the selected and focused cells in the Calendar.
|
kendo-calendar-navigation-width | 5em | 5em | Default: 5emComputed: 5em |
| Description: The width of the Calendar navigation.
|
kendo-calendar-navigation-item-height | 2em | 2em | Default: 2emComputed: 2em |
| Description: The height of the items in the Calendar navigation.
|
kendo-calendar-navigation-bg | $kendo-calendar-header-bg | var(--kendo-color-surface) | Default: $kendo-calendar-header-bgComputed: var(--kendo-color-surface) |
| Description: The background color of the Calendar navigation.
|
kendo-calendar-navigation-text | k-color(on-app-surface) | var(--kendo-color-on-app-surface) | Default: k-color(on-app-surface)Computed: var(--kendo-color-on-app-surface) |
| Description: The text color of the Calendar navigation.
|
kendo-calendar-navigation-border | $kendo-calendar-header-border | var(--kendo-color-border) | Default: $kendo-calendar-header-borderComputed: var(--kendo-color-border) |
| Description: The border color of the Calendar navigation.
|
kendo-calendar-navigation-hover-text | k-color(primary-on-surface) | var(--kendo-color-primary-on-surface) | Default: k-color(primary-on-surface)Computed: var(--kendo-color-primary-on-surface) |
| Description: The text color of the hovered items in the Calendar navigation.
|
kendo-calendar-navigation-marker-text | currentColor | currentColor | Default: currentColorComputed: currentColor |
| Description: The text color of the marker in the Calendar navigation.
|
kendo-calendar-range-bg | color-mix(in srgb, k-color(primary) 25%, transparent) | color-mix(in srgb, var(--kendo-color-primary) 25%, transparent) | Default: color-mix(in srgb, k-color(primary) 25%, transparent)Computed: color-mix(in srgb, var(--kendo-color-primary) 25%, transparent) |
| Description: The background color of the Calendar range selection.
|
kendo-infinite-calendar-header-padding-x | k-spacing(4) | var(--kendo-spacing-4) | Default: k-spacing(4)Computed: var(--kendo-spacing-4) |
| Description: The horizontal padding of the header in the Infinite Calendar.
|
kendo-infinite-calendar-header-padding-y | k-spacing(2) | var(--kendo-spacing-2) | Default: k-spacing(2)Computed: var(--kendo-spacing-2) |
| Description: The vertical padding of the header in the Infinite Calendar.
|
kendo-infinite-calendar-view-padding-x | k-spacing(4) | var(--kendo-spacing-4) | Default: k-spacing(4)Computed: var(--kendo-spacing-4) |
| Description: The horizontal padding of the Calendar view in the Infinite Calendar.
|
kendo-infinite-calendar-view-padding-y | k-spacing(0) | var(--kendo-spacing-0) | Default: k-spacing(0)Computed: var(--kendo-spacing-0) |
| Description: The vertical padding of the Calendar view in the Infinite Calendar.
|
kendo-infinite-calendar-view-height | ( $kendo-calendar-cell-size * 9 ) | 288px | Default: ( $kendo-calendar-cell-size * 9 )Computed: 288px |
| Description: The height of the Calendar view in the Infinite Calendar.
|
kendo-calendar-range-cell-border-radius | k-border-radius(lg) | var(--kendo-border-radius-lg) | Default: k-border-radius(lg)Computed: var(--kendo-border-radius-lg) |
| Description: The border radius of the range cells in the Multiview Calendar.
|
kendo-calendar-sm-font-size | var(--kendo-font-size) | var(--kendo-font-size) | Default: var(--kendo-font-size)Computed: var(--kendo-font-size) |
| Description: The font size of the small Calendar.
|
kendo-calendar-sm-line-height | var(--kendo-line-height) | var(--kendo-line-height) | Default: var(--kendo-line-height)Computed: var(--kendo-line-height) |
| Description: The line height of the small Calendar.
|
kendo-calendar-sm-cell-size | 28px | 28px | Default: 28pxComputed: 28px |
| Description: The size of the cells in the small Calendar.
|
kendo-calendar-sm-cell-padding-x | k-spacing(0.5) | var(--kendo-spacing-0\.5) | Default: k-spacing(0.5)Computed: var(--kendo-spacing-0\.5) |
| Description: The horizontal padding of the cells in the small Calendar.
|
kendo-calendar-sm-cell-padding-y | k-spacing(0.5) | var(--kendo-spacing-0\.5) | Default: k-spacing(0.5)Computed: var(--kendo-spacing-0\.5) |
| Description: The vertical padding of the cells in the small Calendar.
|
kendo-calendar-md-font-size | var(--kendo-font-size) | var(--kendo-font-size) | Default: var(--kendo-font-size)Computed: var(--kendo-font-size) |
| Description: The font size of the medium Calendar.
|
kendo-calendar-md-line-height | var(--kendo-line-height) | var(--kendo-line-height) | Default: var(--kendo-line-height)Computed: var(--kendo-line-height) |
| Description: The line height of the medium Calendar.
|
kendo-calendar-md-cell-size | 32px | 32px | Default: 32pxComputed: 32px |
| Description: The size of the cells in the medium Calendar.
|
kendo-calendar-md-cell-padding-x | k-spacing(1) | var(--kendo-spacing-1) | Default: k-spacing(1)Computed: var(--kendo-spacing-1) |
| Description: The horizontal padding of the cells in the medium Calendar.
|
kendo-calendar-md-cell-padding-y | k-spacing(1) | var(--kendo-spacing-1) | Default: k-spacing(1)Computed: var(--kendo-spacing-1) |
| Description: The vertical padding of the cells in the medium Calendar.
|
kendo-calendar-lg-font-size | var(--kendo-font-size-lg) | var(--kendo-font-size-lg) | Default: var(--kendo-font-size-lg)Computed: var(--kendo-font-size-lg) |
| Description: The font size of the large Calendar.
|
kendo-calendar-lg-line-height | var(--kendo-line-height-lg) | var(--kendo-line-height-lg) | Default: var(--kendo-line-height-lg)Computed: var(--kendo-line-height-lg) |
| Description: The line height of the large Calendar.
|
kendo-calendar-lg-cell-size | 40px | 40px | Default: 40pxComputed: 40px |
| Description: The size of the cells in the large Calendar.
|
kendo-calendar-lg-cell-padding-x | k-spacing(2) | var(--kendo-spacing-2) | Default: k-spacing(2)Computed: var(--kendo-spacing-2) |
| Description: The horizontal padding of the cells in the large Calendar.
|
kendo-calendar-lg-cell-padding-y | k-spacing(2) | var(--kendo-spacing-2) | Default: k-spacing(2)Computed: var(--kendo-spacing-2) |
| Description: The vertical padding of the cells in the large Calendar.
|
kendo-calendar-sizes | | sm: | "font-size":"var(--kendo-font-size)","line-height":"var(--kendo-line-height)","cell-size":"28px","cell-padding-x":"var(--kendo-spacing-0\\.5)","cell-padding-y":"var(--kendo-spacing-0\\.5)" | | md: | "font-size":"var(--kendo-font-size)","line-height":"var(--kendo-line-height)","cell-size":"32px","cell-padding-x":"var(--kendo-spacing-1)","cell-padding-y":"var(--kendo-spacing-1)" | | lg: | "font-size":"var(--kendo-font-size-lg)","line-height":"var(--kendo-line-height-lg)","cell-size":"40px","cell-padding-x":"var(--kendo-spacing-2)","cell-padding-y":"var(--kendo-spacing-2)" |
| Computed: (sm: (font-size: var(--kendo-font-size), line-height: var(--kendo-line-height), cell-size: 28px, cell-padding-x: var(--kendo-spacing-0\.5), cell-padding-y: var(--kendo-spacing-0\.5)), md: (font-size: var(--kendo-font-size), line-height: var(--kendo-line-height), cell-size: 32px, cell-padding-x: var(--kendo-spacing-1), cell-padding-y: var(--kendo-spacing-1)), lg: (font-size: var(--kendo-font-size-lg), line-height: var(--kendo-line-height-lg), cell-size: 40px, cell-padding-x: var(--kendo-spacing-2), cell-padding-y: var(--kendo-spacing-2))) |
| Description: The sizes map of the Calendar.
|
