@progress/kendo-theme-bootstrap 5.5.1-dev.1 → 5.5.1-dev.2

package/dist/all.css

@@ -11350,6 +11350,7 @@ kendo-sortable {
 
 .k-list-md {
     font-size: 1rem;
+    line-height: 1.5;
 }
 
 .k-list-md .k-list-group-sticky-header {
@@ -11366,6 +11367,7 @@ kendo-sortable {
 
 .k-list-lg {
     font-size: 1rem;
+    line-height: 1.5;
 }
 
 .k-list-lg .k-list-group-sticky-header {
@@ -17475,6 +17477,45 @@ kendo-label > .k-label {
     -ms-grid-row-align: start;
 }
 
+.k-circular-progressbar {
+    display: inline-block;
+    text-align: left;
+    position: relative;
+}
+
+.k-circular-progressbar-surface {
+    height: 100%;
+}
+
+.k-circular-progressbar-surface > div {
+    width: 100%;
+    height: 100%;
+}
+
+.k-circular-progressbar-surface svg {
+    width: 100%;
+    height: 100%;
+}
+
+.k-circular-progressbar-scale {
+    fill: none;
+}
+
+.k-circular-progressbar-arc {
+    transform-box: fill-box;
+    transform-origin: center center;
+    transform: rotate(-90deg);
+    stroke-linecap: round;
+    fill: none;
+}
+
+.k-circular-progressbar-label {
+    position: absolute;
+    text-align: center;
+    padding: 0;
+    margin: 0;
+}
+
 @keyframes progressbar-indeterminate-animation {
     from {
         background-position: 0 0;
@@ -17507,6 +17548,15 @@ kendo-label > .k-label {
     animation: progressbar-indeterminate-animation 1s linear infinite;
 }
 
+.k-circular-progressbar-scale {
+    stroke: #e9ecef;
+}
+
+.k-circular-progressbar-arc {
+    stroke: #0d6efd;
+    transition: stroke .5s ease;
+}
+
 .k-radio {
     border-radius: 50%;
     margin: 0;
@@ -18324,6 +18374,8 @@ kendo-label > .k-label {
 }
 
 .k-calendar {
+    inline-size: var(--INTERNAL--kendo-calendar-width, min-content);
+    block-size: var(--INTERNAL--kendo-calendar-height, min-content);
     border-width: 1px;
     border-style: solid;
     box-sizing: border-box;
@@ -18344,14 +18396,8 @@ kendo-label > .k-label {
     border: 0;
 }
 
-.k-calendar .k-link {
-    white-space: normal;
-    position: relative;
-    overflow: hidden;
-}
-
 .k-calendar-table {
-    margin: 0;
+    margin: 0 auto;
     border-width: 0;
     border-color: inherit;
     border-spacing: 0;
@@ -18359,8 +18405,7 @@ kendo-label > .k-label {
     table-layout: fixed;
     text-align: center;
     outline: 0;
-    display: inline-table;
-    vertical-align: top;
+    display: table;
     position: relative;
     z-index: 1;
 }
@@ -18399,9 +18444,28 @@ kendo-label > .k-label {
 
 .k-calendar-td {
     border-radius: 0.25rem;
+    inline-size: var(--INTERNAL--kendo-calendar-cell-size, min-content);
+    block-size: var(--INTERNAL--kendo-calendar-cell-size, min-content);
     border-color: transparent;
 }
 
+.k-calendar .k-calendar-cell-inner, .k-calendar .k-link {
+    border-radius: 0.25rem;
+    padding: 0.5rem 0.5rem;
+    padding-inline: var(--INTERNAL--kendo-calendar-cell-padding-x, 0.5rem);
+    padding-block: var(--INTERNAL--kendo-calendar-cell-padding-y, 0.5rem);
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    white-space: normal;
+    position: relative;
+    overflow: hidden;
+}
+
 .k-calendar .k-header {
     padding: 0.25rem 0.25rem;
     border-bottom-width: 1px;
@@ -18454,6 +18518,7 @@ kendo-label > .k-label {
     margin: auto;
     padding: 0 0.25rem;
     width: 266px;
+    inline-size: var(--INTERNAL--kendo-calendar-view-width, 266px);
     min-height: 266px;
     box-sizing: content-box;
     gap: 1rem;
@@ -18462,58 +18527,45 @@ kendo-label > .k-label {
     overflow: hidden;
 }
 
-.k-calendar-view .k-link {
-    border-radius: 0.25rem;
-    padding: 0.5rem 0.5rem;
-    box-sizing: border-box;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-}
-
 .k-week-number .k-calendar-view {
     width: 304px;
 }
 
+.k-month-calendar .k-calendar-td,
 .k-calendar-monthview .k-calendar-td {
     width: 38px;
     height: 38px;
+    inline-size: var(--INTERNAL--kendo-calendar-cell-size, 38px);
+    block-size: var(--INTERNAL--kendo-calendar-cell-size, 38px);
 }
 
-.k-calendar-monthview .k-link {
-    width: 38px;
-    height: 38px;
-}
-
+.k-year-calendar .k-calendar-td,
 .k-calendar-yearview .k-calendar-td {
-    width: auto;
-    height: auto;
-}
-
-.k-calendar-yearview .k-link {
     width: 66.5px;
     height: 66.5px;
+    inline-size: var(--INTERNAL--kendo-calendar-cell-size, 66.5px);
+    block-size: var(--INTERNAL--kendo-calendar-cell-size, 66.5px);
 }
 
+.k-decade-calendar .k-calendar-td,
 .k-calendar-decadeview .k-calendar-td {
-    width: auto;
-    height: auto;
-}
-
-.k-calendar-decadeview .k-link {
     width: 66.5px;
     height: 66.5px;
+    inline-size: var(--INTERNAL--kendo-calendar-cell-size, 66.5px);
+    block-size: var(--INTERNAL--kendo-calendar-cell-size, 66.5px);
 }
 
+.k-century-calendar .k-calendar-td,
 .k-calendar-centuryview .k-calendar-td {
-    width: auto;
-    height: auto;
+    width: 66.5px;
+    height: 66.5px;
+    inline-size: var(--INTERNAL--kendo-calendar-cell-size, 66.5px);
+    block-size: var(--INTERNAL--kendo-calendar-cell-size, 66.5px);
 }
 
+.k-century-calendar .k-calendar-cell-inner, .k-century-calendar .k-link,
+.k-calendar-centuryview .k-calendar-cell-inner,
 .k-calendar-centuryview .k-link {
-    width: 66.5px;
-    height: 66.5px;
     text-align: left;
 }
 
@@ -18551,6 +18603,90 @@ kendo-label > .k-label {
     right: 0;
 }
 
+.k-calendar-sm {
+    --INTERNAL--kendo-calendar-view-width: 256px;
+    --INTERNAL--kendo-calendar-cell-padding-x: var( --kendo-calendar-sm-cell-padding-x, 0.125rem );
+    --INTERNAL--kendo-calendar-cell-padding-y: var( --kendo-calendar-sm-cell-padding-y, 0.125rem );
+    font-size: 1rem;
+    line-height: 1.5;
+}
+
+.k-calendar-sm.k-month-calendar,
+.k-calendar-sm .k-calendar-monthview {
+    --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-sm-month-cell-size, 32px );
+}
+
+.k-calendar-sm.k-year-calendar,
+.k-calendar-sm .k-calendar-yearview {
+    --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-sm-year-cell-size, 56px );
+}
+
+.k-calendar-sm.k-decade-calendar,
+.k-calendar-sm .k-calendar-decadeview {
+    --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-sm-decade-cell-size, 56px );
+}
+
+.k-calendar-sm.k-century-calendar,
+.k-calendar-sm .k-calendar-centuryview {
+    --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-sm-century-cell-size, 56px );
+}
+
+.k-calendar-md {
+    --INTERNAL--kendo-calendar-view-width: 288px;
+    --INTERNAL--kendo-calendar-cell-padding-x: var( --kendo-calendar-md-cell-padding-x, 0.25rem );
+    --INTERNAL--kendo-calendar-cell-padding-y: var( --kendo-calendar-md-cell-padding-y, 0.25rem );
+    font-size: 1rem;
+    line-height: 1.5;
+}
+
+.k-calendar-md.k-month-calendar,
+.k-calendar-md .k-calendar-monthview {
+    --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-md-month-cell-size, 36px );
+}
+
+.k-calendar-md.k-year-calendar,
+.k-calendar-md .k-calendar-yearview {
+    --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-md-year-cell-size, 63px );
+}
+
+.k-calendar-md.k-decade-calendar,
+.k-calendar-md .k-calendar-decadeview {
+    --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-md-decade-cell-size, 63px );
+}
+
+.k-calendar-md.k-century-calendar,
+.k-calendar-md .k-calendar-centuryview {
+    --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-md-century-cell-size, 63px );
+}
+
+.k-calendar-lg {
+    --INTERNAL--kendo-calendar-view-width: 320px;
+    --INTERNAL--kendo-calendar-cell-padding-x: var( --kendo-calendar-lg-cell-padding-x, 0.25rem );
+    --INTERNAL--kendo-calendar-cell-padding-y: var( --kendo-calendar-lg-cell-padding-y, 0.25rem );
+    font-size: 1.25rem;
+    line-height: 2;
+}
+
+.k-calendar-lg.k-month-calendar,
+.k-calendar-lg .k-calendar-monthview {
+    --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-lg-month-cell-size, 40px );
+}
+
+.k-calendar-lg.k-year-calendar,
+.k-calendar-lg .k-calendar-yearview {
+    --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-lg-year-cell-size, 70px );
+}
+
+.k-calendar-lg.k-decade-calendar,
+.k-calendar-lg .k-calendar-decadeview {
+    --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-lg-decade-cell-size, 70px );
+}
+
+.k-calendar-lg.k-century-calendar,
+.k-calendar-lg .k-calendar-centuryview {
+    --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-lg-century-cell-size, 70px );
+}
+
 .k-calendar-infinite {
     box-sizing: content-box;
     display: inline-flex;
@@ -18760,7 +18896,7 @@ kendo-label > .k-label {
     color: #0d6efd;
 }
 
-.k-calendar .k-nav-today:hover, .k-calendar .k-nav-today.k-hover, .k-calendar .k-nav-today.k-state-hover, .k-calendar .k-nav-today:focus, .k-calendar .k-nav-today.k-state-focus, .k-calendar .k-nav-today.k-focus {
+.k-calendar .k-nav-today:hover, .k-calendar .k-nav-today.k-hover, .k-calendar .k-nav-today.k-state-hover, .k-calendar .k-nav-today:focus, .k-calendar .k-nav-today.k-focus, .k-calendar .k-nav-today.k-state-focus {
     color: #0a58ca;
 }
 
@@ -18771,12 +18907,13 @@ kendo-label > .k-label {
     color: #6c757d;
 }
 
-.k-calendar .k-calendar-view .k-today .k-link {
+.k-calendar .k-calendar-view .k-today .k-calendar-cell-inner, .k-calendar .k-calendar-view .k-today .k-link {
     box-shadow: inset 0 0 0 1px #0d6efd;
 }
 
-.k-calendar .k-calendar-view .k-today.k-state-focused .k-link,
-.k-calendar .k-calendar-view .k-today.k-focus .k-link {
+.k-calendar .k-calendar-view .k-today.k-focus .k-calendar-cell-inner, .k-calendar .k-calendar-view .k-today.k-focus .k-link,
+.k-calendar .k-calendar-view .k-today.k-state-focused .k-calendar-cell-inner,
+.k-calendar .k-calendar-view .k-today.k-state-focused .k-link {
     box-shadow: inset 0 0 0 1px #0d6efd, inset 0 0 0 0.25rem rgba(228, 231, 235, 0.5);
 }
 
@@ -18794,45 +18931,49 @@ kendo-label > .k-label {
     visibility: hidden;
 }
 
-.k-calendar .k-calendar-td:hover .k-link,
-.k-calendar .k-calendar-td.k-state-hover .k-link,
-.k-calendar .k-calendar-td.k-hover .k-link {
+.k-calendar .k-calendar-td:hover .k-calendar-cell-inner, .k-calendar .k-calendar-td:hover .k-link,
+.k-calendar .k-calendar-td.k-hover .k-calendar-cell-inner,
+.k-calendar .k-calendar-td.k-hover .k-link,
+.k-calendar .k-calendar-td.k-state-hover .k-calendar-cell-inner,
+.k-calendar .k-calendar-td.k-state-hover .k-link {
     border-color: #d6d9dc;
     color: #212529;
     background-color: #e9ecef;
 }
 
-.k-calendar .k-calendar-td.k-state-selected .k-link,
-.k-calendar .k-calendar-td.k-selected .k-link {
+.k-calendar .k-calendar-td.k-selected .k-calendar-cell-inner, .k-calendar .k-calendar-td.k-selected .k-link,
+.k-calendar .k-calendar-td.k-state-selected .k-calendar-cell-inner,
+.k-calendar .k-calendar-td.k-state-selected .k-link {
     border-color: #0c65e9;
     color: white;
     background-color: #0d6efd;
 }
 
-.k-calendar .k-calendar-td.k-state-selected:hover .k-link,
-.k-calendar .k-calendar-td.k-selected:hover .k-link,
-.k-calendar .k-calendar-td.k-state-selected.k-state-hover .k-link,
+.k-calendar .k-calendar-td.k-selected:hover .k-calendar-cell-inner, .k-calendar .k-calendar-td.k-selected:hover .k-link,
+.k-calendar .k-calendar-td.k-selected.k-hover .k-calendar-cell-inner,
 .k-calendar .k-calendar-td.k-selected.k-hover .k-link,
-.k-calendar .k-calendar-td.k-selected:hover .k-link,
-.k-calendar .k-calendar-td.k-selected.k-hover .k-link {
+.k-calendar .k-calendar-td.k-state-selected:hover .k-calendar-cell-inner,
+.k-calendar .k-calendar-td.k-state-selected:hover .k-link {
     border-color: #e4e5e6;
     color: white;
     background-color: #0c6af3;
 }
 
-.k-calendar .k-calendar-td.k-state-focused .k-link,
+.k-calendar .k-calendar-td:focus .k-calendar-cell-inner, .k-calendar .k-calendar-td:focus .k-link,
+.k-calendar .k-calendar-td.k-focus .k-calendar-cell-inner,
 .k-calendar .k-calendar-td.k-focus .k-link,
+.k-calendar .k-calendar-td.k-state-focus .k-calendar-cell-inner,
 .k-calendar .k-calendar-td.k-state-focus .k-link,
-.k-calendar .k-calendar-td.k-focus .k-link {
+.k-calendar .k-calendar-td.k-state-focused .k-calendar-cell-inner,
+.k-calendar .k-calendar-td.k-state-focused .k-link {
     box-shadow: inset 0 0 0 0.25rem rgba(228, 231, 235, 0.5);
 }
 
-.k-calendar .k-calendar-td.k-state-selected.k-state-focused .k-link,
-.k-calendar .k-calendar-td.k-selected.k-focused .k-link,
-.k-calendar .k-calendar-td.k-state-selected.k-state-focus .k-link,
+.k-calendar .k-calendar-td.k-selected:focus .k-calendar-cell-inner, .k-calendar .k-calendar-td.k-selected:focus .k-link,
+.k-calendar .k-calendar-td.k-selected.k-focus .k-calendar-cell-inner,
 .k-calendar .k-calendar-td.k-selected.k-focus .k-link,
-.k-calendar .k-calendar-td.k-selected:focus .k-link,
-.k-calendar .k-calendar-td.k-selected.k-focus .k-link {
+.k-calendar .k-calendar-td.k-state-selected.k-state-focus .k-calendar-cell-inner,
+.k-calendar .k-calendar-td.k-state-selected.k-state-focus .k-link {
     box-shadow: inset 0 0 0 2px rgba(2, 82, 201, 0.5);
 }
 
@@ -18843,8 +18984,8 @@ kendo-label > .k-label {
 }
 
 .k-calendar .k-calendar-navigation li:hover,
-.k-calendar .k-calendar-navigation li.k-state-hover,
-.k-calendar .k-calendar-navigation li.k-hover {
+.k-calendar .k-calendar-navigation li.k-hover,
+.k-calendar .k-calendar-navigation li.k-state-hover {
     color: #0a58ca;
 }
 
@@ -18871,13 +19012,6 @@ kendo-label > .k-label {
 .k-calendar .k-range-start,
 .k-calendar .k-range-end,
 .k-calendar .k-range-mid {
-    background-image: linear-gradient(transparent 1px, rgba(13, 110, 253, 0.25) 1px, rgba(13, 110, 253, 0.25) calc(100% - 1px), transparent calc(100% - 1px));
-}
-
-.k-ie .k-calendar .k-range-start, .k-ie
-.k-calendar .k-range-end, .k-ie
-.k-calendar .k-range-mid {
-    background-image: none;
     background-color: rgba(13, 110, 253, 0.25);
 }
 
@@ -18886,15 +19020,19 @@ kendo-label > .k-label {
     background-color: transparent;
 }
 
-.k-calendar .k-range-start .k-link,
+.k-calendar .k-range-start .k-calendar-cell-inner, .k-calendar .k-range-start .k-link,
+.k-calendar .k-range-end .k-calendar-cell-inner,
 .k-calendar .k-range-end .k-link {
     background-color: #0d6efd;
 }
 
+.k-calendar .k-range-start.k-active .k-calendar-cell-inner, .k-calendar .k-range-start.k-active .k-link,
+.k-calendar .k-range-start.k-state-active .k-calendar-cell-inner,
 .k-calendar .k-range-start.k-state-active .k-link,
-.k-calendar .k-range-start.k-active .k-link,
-.k-calendar .k-range-end.k-state-active .k-link,
-.k-calendar .k-range-end.k-active .k-link {
+.k-calendar .k-range-end.k-active .k-calendar-cell-inner,
+.k-calendar .k-range-end.k-active .k-link,
+.k-calendar .k-range-end.k-state-active .k-calendar-cell-inner,
+.k-calendar .k-range-end.k-state-active .k-link {
     box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.2);
 }
 
@@ -18908,8 +19046,8 @@ kendo-label > .k-label {
     content: "";
     display: block;
     position: absolute;
-    top: 1px;
-    bottom: 1px;
+    top: 0;
+    bottom: 0;
     width: 5px;
 }
 
@@ -19122,6 +19260,63 @@ kendo-label > .k-label {
     top: calc( 0.65625rem);
 }
 
+.k-timeselector-sm {
+    font-size: 0.875rem;
+    line-height: 1.4285714286;
+}
+
+.k-timeselector-sm .k-time-highlight,
+.k-timeselector-sm .k-time-list-highlight {
+    height: calc( 1.25rem + 0.5rem);
+}
+
+.k-timeselector-sm .k-time-separator {
+    height: calc( 1.25rem + 0.5rem);
+}
+
+.k-timeselector-sm .k-time-list-item,
+.k-timeselector-sm .k-time-list .k-item {
+    padding: 0.25rem 1rem;
+}
+
+.k-timeselector-md {
+    font-size: 1rem;
+    line-height: 1.5;
+}
+
+.k-timeselector-md .k-time-highlight,
+.k-timeselector-md .k-time-list-highlight {
+    height: calc( 1.5rem + 0.5rem);
+}
+
+.k-timeselector-md .k-time-separator {
+    height: calc( 1.5rem + 0.5rem);
+}
+
+.k-timeselector-md .k-time-list-item,
+.k-timeselector-md .k-time-list .k-item {
+    padding: 0.25rem 1rem;
+}
+
+.k-timeselector-lg {
+    font-size: 1rem;
+    line-height: 1.5;
+}
+
+.k-timeselector-lg .k-time-highlight,
+.k-timeselector-lg .k-time-list-highlight {
+    height: calc( 1.5rem + 1rem);
+}
+
+.k-timeselector-lg .k-time-separator {
+    height: calc( 1.5rem + 1rem);
+}
+
+.k-timeselector-lg .k-time-list-item,
+.k-timeselector-lg .k-time-list .k-item {
+    padding: 0.5rem 1rem;
+}
+
 .k-timeselector {
     border-color: #dee2e6;
     color: #212529;
@@ -21662,12 +21857,41 @@ kendo-label > .k-label {
     box-sizing: border-box;
 }
 
-.k-actionsheet-header {
+.k-actionsheet-fullscreen {
+    max-height: 100%;
+    height: 100%;
+}
+
+.k-actionsheet-header, .k-actionsheet-titlebar {
     padding: 0.5rem 1rem;
     border-width: 0;
     border-style: solid;
     border-color: transparent;
     box-sizing: border-box;
+    flex: none;
+}
+
+.k-actionsheet-titlebar {
+    display: flex;
+    flex-flow: row nowrap;
+    align-items: center;
+}
+
+.k-actionsheet-title {
+    flex: 1;
+}
+
+.k-actionsheet-actions {
+    flex: none;
+}
+
+.k-actionsheet-content {
+    flex: 1;
+    overflow: auto;
+}
+
+.k-actionsheet-footer {
+    flex: none;
 }
 
 .k-actionsheet-items {
@@ -21757,6 +21981,33 @@ kendo-label > .k-label {
     transform: none;
 }
 
+.k-adaptive-actionsheet {
+    max-width: 100%;
+    width: 100%;
+    display: flex;
+    flex-flow: column nowrap;
+}
+
+.k-adaptive-actionsheet .k-calendar {
+    margin-inline: auto;
+    border-width: 0;
+    display: flex;
+}
+
+.k-adaptive-actionsheet .k-timeselector {
+    height: 100%;
+    border-width: 0;
+    overflow: hidden;
+}
+
+.k-adaptive-actionsheet .k-timeselector .k-time-part {
+    display: contents;
+}
+
+.k-adaptive-actionsheet .k-timeselector .k-time-list-wrapper {
+    height: 100%;
+}
+
 .k-actionsheet {
     border-color: #dee2e6;
     color: #212529;