@progress/kendo-theme-classic 4.41.2-dev.2 → 5.0.0-next.2

package/modules/@progress/kendo-theme-default/scss/pivotgrid/_layout.scss

@@ -1,730 +0,0 @@
-@include exports("pivotgrid/layout") {
-
-    // Pivotgrid
-    .k-pivotgrid {
-        padding: $pivotgrid-padding-y $pivotgrid-padding-x;
-        border-width: $pivotgrid-border-width;
-        border-style: solid;
-        box-sizing: content-box;
-        font-size: $pivotgrid-font-size;
-        font-family: $pivotgrid-font-family;
-        line-height: $pivotgrid-line-height;
-        text-align: left;
-        vertical-align: top;
-        display: grid;
-        grid-template-columns: $pivotgrid-row-header-width auto;
-        grid-template-rows: $pivotgrid-column-header-height auto;
-        position: relative;
-
-        table {
-            margin: 0;
-            width: 100%;
-            max-width: none;
-            border-width: 0;
-            border-color: inherit;
-            border-collapse: separate;
-            border-spacing: 0;
-            outline: 0;
-            empty-cells: show;
-        }
-
-        thead,
-        tbody,
-        th,
-        tr,
-        td {
-            border-color: inherit;
-        }
-    }
-
-
-    // Table Layout
-    .k-pivotgrid-table {
-        table-layout: fixed;
-
-        th {
-            font-weight: 400;
-            text-transform: initial;
-        }
-
-        .k-pivotgrid-header-root {
-            font-weight: 600;
-            text-transform: uppercase;
-        }
-    }
-
-
-    // Header empty cell
-    .k-pivotgrid-empty-cell {
-        border-right-style: solid;
-        border-right-width: $pivotgrid-cell-border-width;
-        border-bottom-style: solid;
-        border-bottom-width: $pivotgrid-cell-border-width;
-    }
-
-
-    // Column Headers
-    .k-pivotgrid-column-headers {
-        overflow: hidden;
-    }
-
-    .k-pivotgrid-column-headers .k-pivotgrid-table {
-        padding-inline-start: 0;
-        padding-inline-end: var(--kendo-scrollbar-width, #{$default-scrollbar-width});
-    }
-
-    .k-pivotgrid-column-headers .k-pivotgrid-cell {
-        border-bottom-style: solid;
-        border-bottom-width: $pivotgrid-cell-border-width;
-        border-left-style: solid;
-        border-left-width: $pivotgrid-cell-border-width;
-
-        &:first-child {
-            border-left-width: 0;
-        }
-
-        &.k-first {
-            border-left-width: $pivotgrid-cell-border-width;
-        }
-    }
-
-
-    // Row Headers
-    .k-pivotgrid-row-headers {
-        overflow: hidden;
-    }
-
-    .k-pivotgrid-row-headers .k-pivotgrid-table {
-        padding-bottom: var(--kendo-scrollbar-width, #{$default-scrollbar-width});
-    }
-
-    .k-pivotgrid-row-headers .k-pivotgrid-cell {
-        border-right-style: solid;
-        border-right-width: $pivotgrid-cell-border-width;
-        border-bottom-style: solid;
-        border-bottom-width: $pivotgrid-cell-border-width;
-        white-space: nowrap;
-    }
-
-
-    // Values
-    .k-pivotgrid-values {
-        border-color: inherit;
-        overflow: scroll;
-    }
-
-    .k-pivotgrid-values .k-pivotgrid-cell {
-        border-bottom-style: solid;
-        border-bottom-width: $pivotgrid-cell-border-width;
-        border-left-style: solid;
-        border-left-width: $pivotgrid-cell-border-width;
-
-        &:first-child {
-            border-left-width: 0;
-        }
-    }
-
-    .k-pivotgrid-cell {
-        padding: $pivotgrid-cell-padding-y $pivotgrid-cell-padding-x;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-        vertical-align: top;
-        overflow: hidden;
-    }
-
-    .k-pivotgrid-cell .k-icon {
-        cursor: pointer;
-    }
-
-    .k-pivotgrid-total {
-        font-weight: 600;
-    }
-
-    // Column menus
-    .k-column-menu .k-treeview {
-        padding: $pivotgrid-treeview-padding-y $pivotgrid-treeview-padding-x;
-        overflow: auto;
-    }
-
-}
-
-
-
-@include exports("pivotgrid/layout/configurator") {
-
-    // Configurator
-    .k-pivotgrid-configurator {
-        display: flex;
-    }
-
-    .k-pivotgrid-configurator-panel {
-        padding: $pivotgrid-configurator-padding-y $pivotgrid-configurator-padding-x;
-        border-width: $pivotgrid-configurator-border-width;
-        border-style: solid;
-        box-sizing: border-box;
-        display: flex;
-        flex-direction: column;
-        overflow: hidden;
-        z-index: 2;
-    }
-
-    // Configurator Button
-    .k-pivotgrid-configurator-button {
-        padding: $pivotgrid-configurator-button-padding-y $pivotgrid-configurator-button-padding-x;
-        border-width: $pivotgrid-configurator-button-border-width;
-        border-style: solid;
-        box-sizing: border-box;
-        cursor: pointer;
-        user-select: none;
-
-        .k-flex-row &,
-        .k-flex-row-reverse & {
-            display: flex;
-            align-items: center;
-
-            span {
-                writing-mode: vertical-rl;
-            }
-            .k-icon {
-                vertical-align: baseline;
-            }
-        }
-        .k-flex-row-reverse & > span {
-            transform: rotate(-180deg);
-        }
-
-        .k-flex-col &,
-        .k-flex-col-reverse & {
-            text-align: center;
-        }
-    }
-
-
-    // Modes
-    .k-pivotgrid-configurator-overlay {
-        position: absolute;
-        overflow: hidden;
-        z-index: 2;
-
-        .k-flex-row & {
-            right: $pivotgrid-configurator-button-size;
-        }
-        .k-flex-row-reverse & {
-            left: $pivotgrid-configurator-button-size;
-        }
-        .k-flex-col & {
-            bottom: $pivotgrid-configurator-button-size;
-        }
-        .k-flex-col-reverse & {
-            top: $pivotgrid-configurator-button-size;
-        }
-    }
-
-
-    // Panel Content
-    .k-pivotgrid-configurator-header {
-        padding: $pivotgrid-configurator-header-padding-y $pivotgrid-configurator-header-padding-x;
-        font-size: $pivotgrid-configurator-header-font-size;
-        font-weight: $pivotgrid-configurator-header-font-weight;
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-    }
-
-    .k-pivotgrid-configurator-header-text {
-        word-break: normal;
-        overflow-wrap: anywhere;
-    }
-
-    .k-pivotgrid-configurator-content {
-        padding: $pivotgrid-configurator-content-padding-y $pivotgrid-configurator-content-padding-x;
-        flex: 1 1 auto;
-        overflow: auto;
-
-        .k-form {
-            .k-label {
-                font-size: 16px;
-                font-weight: 500;
-                align-items: flex-start;
-            }
-            .k-dropdown {
-                max-width: 90px;
-            }
-            .k-textbox {
-                flex-basis: 50%;
-            }
-        }
-
-        // Rows, Cols and Filters
-        .k-row-fields,
-        .k-column-fields,
-        .k-filter-fields {
-            margin-top: $pivotgrid-configurator-fields-margin-y;
-            flex-wrap: wrap;
-
-            > * {
-                margin-bottom: $pivotgrid-configurator-fields-margin-y;
-            }
-
-            > *:last-child {
-                margin-bottom: 0;
-            }
-        }
-
-        // Values
-        .k-value-fields {
-            margin: $pivotgrid-configurator-fields-margin-y $pivotgrid-configurator-fields-margin-x;
-            display: flex;
-            flex-direction: column;
-            gap: ($pivotgrid-spacer / 2);
-        }
-
-        .k-select-all .k-checkbox {
-            margin-inline-end: map-get($spacing, 1);
-        }
-
-        .k-fields-list-wrapper {
-            max-height: 200px;
-            border-width: 1px;
-            border-style: solid;
-            flex: 1 1 auto;
-            overflow-x: hidden;
-            overflow-y: auto;
-        }
-
-        .k-settings-description {
-            margin-top: map-get( $spacing, 4 );
-            text-align: center;
-        }
-
-        .k-chip-content {
-            padding-inline-end: map-get($spacing, 1);
-        }
-
-        .k-treeview {
-            padding: $pivotgrid-treeview-padding-y $pivotgrid-treeview-padding-x;
-            overflow: auto;
-        }
-    }
-
-    .k-pivotgrid-configurator-actions {
-        padding: $pivotgrid-configurator-actions-padding-y $pivotgrid-configurator-actions-padding-x;
-    }
-
-
-    // Calculated field
-    .k-calculated-field {
-        padding: $pivotgrid-calculated-field-padding-y $pivotgrid-calculated-field-padding-x;
-        border-width: $pivotgrid-calculated-field-border-width;
-        border-radius: $pivotgrid-calculated-field-border-radius;
-        border-style: solid;
-        box-sizing: border-box;
-        display: flex;
-        flex-direction: column;
-        gap: $pivotgrid-calculated-field-gap;
-    }
-    .k-calculated-field-header {
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-    }
-
-    .k-calculated-field-header .k-textbox {
-        min-width: 200px;
-    }
-
-    .k-calculated-field-header-text {
-        margin-right: 5px;
-        word-break: normal;
-        overflow-wrap: anywhere;
-    }
-
-    .k-calculated-field-header-actions {
-        flex-shrink: 0;
-        align-self: flex-start;
-    }
-
-    .k-calculated-field-content .k-textbox {
-        width: 100%;
-    }
-
-    .k-calculated-field-actions {
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-
-        .k-icon {
-            margin-right: map-get( $spacing, 2 );
-        }
-        .k-dropdown {
-            max-width: 100px;
-        }
-    }
-
-    .k-filter-menu .k-calculated-item {
-        border-bottom-width: 1px;
-        border-bottom-style: solid;
-    }
-
-
-    // Vertical Layout
-    .k-pivotgrid-configurator-vertical {
-        min-width: $pivotgrid-configurator-vertical-width;
-    }
-
-    .k-pivotgrid-configurator-vertical.k-pivotgrid-configurator-push .k-pivotgrid-configurator-panel {
-        .k-flex-row &,
-        .k-flex-row-reverse & {
-            border-right-width: 0;
-            border-left-width: 0;
-        }
-    }
-
-
-    // Horizontal Layout
-    .k-pivotgrid-configurator-horizontal {
-        width: 100%;
-        height: $pivotgrid-configurator-horizontal-height;
-
-        .k-pivotgrid-configurator-content {
-            .k-form {
-                display: flex;
-                flex-direction: row;
-            }
-
-            .k-form-field-wrapper {
-                padding-left: $pivotgrid-spacer;
-
-                & > *:first-child {
-                    margin-top: 0;
-                }
-                &:first-child {
-                    padding-left: 0;
-                    flex: 1 1 30%;
-                }
-                &:nth-child(2) {
-                    flex: 1 1 30%;
-                }
-
-                &:last-child {
-                    border-left-width: 1px;
-                    border-left-style: solid;
-                    flex: 1 1 40%;
-                }
-            }
-
-            .k-row-fields,
-            .k-column-fields,
-            .k-filter-fields {
-                max-height: 100px;
-                overflow-x: hidden;
-                overflow-y: auto;
-            }
-            .k-value-fields {
-                max-height: 250px;
-                flex-direction: row;
-                flex-wrap: wrap;
-                overflow-x: hidden;
-                overflow-y: auto;
-            }
-        }
-
-        &.k-pivotgrid-configurator-push .k-pivotgrid-configurator-panel {
-            .k-flex-col &,
-            .k-flex-col-reverse & {
-                border-top-width: 0;
-                border-bottom-width: 0;
-            }
-        }
-    }
-
-}
-
-
-
-@include exports("pivotgrid/layout/rtl") {
-
-    .k-pivotgrid {
-        .k-rtl &,
-        &.k-rtl,
-        [dir="rtl"] &,
-        &[dir="rtl"] {
-
-        }
-    }
-
-}
-
-
-@include exports("pivotgrid/layout/legacy") {
-
-    .k-pivot {
-        border-width: $pivotgrid-border-width;
-        border-style: solid;
-        position: relative;
-
-        .k-grid td {
-            white-space: nowrap;
-        }
-
-        .k-grid-content {
-            flex: 1 1 auto;
-        }
-    }
-
-    .k-pivot-toolbar {
-        border-width: 0 0 1px;
-        border-style: solid;
-        align-items: start;
-        flex-wrap: wrap;
-
-        > * {
-            max-width: 100%;
-        }
-
-        &::before {
-            display: none;
-        }
-    }
-
-    .k-pivot-toolbar .k-button,
-    .k-fieldselector .k-list li.k-item {
-        @include border-radius( $border-radius );
-        padding: $button-padding-y $button-padding-x;
-        padding-right: calc( #{$button-padding-x} + #{$icon-size * 3} );
-        min-height: auto;
-        font-size: $font-size;
-        line-height: $button-line-height;
-        text-align: left;
-        white-space: normal;
-        word-break: break-word;
-        position: relative;
-        cursor: move;
-
-        .k-field-actions .k-setting-delete {
-            box-sizing: content-box;
-        }
-    }
-
-    .k-field-actions {
-        position: absolute;
-        right: $button-padding-y;
-        top: $button-padding-y;
-        line-height: 1;
-        cursor: pointer;
-    }
-
-    .k-pivot-layout {
-        border-spacing: 0;
-        table-layout: auto;
-
-        .k-grid-footer,
-        .k-grid .k-alt {
-            font-weight: bold;
-        }
-    }
-
-    .k-pivot-layout > tbody,
-    .k-pivot td {
-        vertical-align: top;
-    }
-
-    .k-pivot-layout > tbody > tr > td {
-        padding: 0;
-    }
-
-    .k-pivot-rowheaders > .k-grid,
-    .k-pivot-table > .k-grid {
-        border-width: 0;
-    }
-
-    .k-pivot-rowheaders > .k-grid td:first-child,
-    .k-pivot-table .k-grid-header .k-header.k-first {
-        border-left-width: 1px;
-    }
-
-    .k-pivot-rowheaders > .k-grid td.k-first {
-        border-left-width: 0;
-    }
-
-    .k-pivot-rowheaders > .k-grid {
-        overflow: hidden;
-    }
-
-    .k-pivot-table {
-        border-left-width: 1px;
-        border-left-style: solid;
-    }
-
-    .k-pivot-table .k-grid-header-wrap {
-        margin-right: -1px;
-    }
-
-    .k-pivot-table .k-grid-header-wrap > table {
-        height: 100%;
-    }
-
-    .k-pivot .k-grid-header .k-header {
-        vertical-align: top;
-    }
-
-    .k-pivot .k-grid tr {
-        .k-grid-footer {
-            border-bottom-width: 0;
-        }
-        &:last-child:not(.k-grid-footer) {
-            td:not(.k-grid-footer) {
-                border-bottom-width: 1px;
-            }
-        }
-    }
-
-    .k-pivot-layout .k-grid td {
-        border-bottom-width: 1px;
-    }
-
-    .k-pivot-layout .k-grid-footer > td {
-        border-top-width: 0;
-    }
-
-    .k-pivot-filter-window .k-treeview {
-        max-height: 600px;
-    }
-
-}
-
-
-
-
-@include exports("pivotgrid/configurator/layout/legacy") {
-
-
-    .k-fieldselector {
-        border-width: 1px;
-        border-style: solid;
-        box-sizing: border-box;
-        outline: 0;
-        font-family: $pivotgrid-font-family;
-        font-size: $pivotgrid-font-size;
-        line-height: $pivotgrid-line-height;
-        -webkit-touch-callout: none;
-        -webkit-tap-highlight-color: $rgba-transparent;
-
-        .k-columns {
-            display: flex;
-            align-items: stretch;
-
-            > div {
-                padding: $table-cell-padding-y;
-                width: 50%;
-                box-sizing: border-box;
-                border-width: 0;
-                border-style: solid;
-                float: left;
-                overflow: auto;
-            }
-            > div + div {
-                border-left-width: 1px;
-            }
-        }
-
-
-        p {
-            margin: 0 0 $padding-y-sm;
-            text-transform: uppercase;
-        }
-        p .k-icon {
-            margin: 0 $icon-spacing 0 0;
-        }
-
-
-        // Treeview
-        .k-treeview {
-            border-width: 0;
-            overflow: visible;
-        }
-
-        .k-edit-label {
-            width: 16%;
-        }
-        .k-edit-field {
-            width: 77%;
-        }
-
-        .k-edit-buttons {
-            > input,
-            > label {
-                float: left;
-                margin-top: .4em;
-            }
-        }
-
-
-        // List container
-        .k-list-container {
-            margin-bottom: $spacer;
-            padding: $padding-y-sm;
-            border-width: 1px;
-            border-style: solid;
-        }
-        .k-list {
-            padding-bottom: $spacer;
-        }
-        .k-list .k-item {
-            border-width: 1px;
-            border-style: solid;
-        }
-        .k-list .k-item + .k-item {
-            margin-top: ($spacer / 2);
-        }
-
-    }
-
-}
-
-
-
-@include exports("pivotgrid/layout/ie11-fixes/legacy") {
-
-    // Pivotgrid is stretched beyond container in IE 11
-    // see https://github.com/telerik/kendo-theme-default/issues/647
-    // see https://github.com/telerik/kendo-themes/issues/1880
-    .k-ie11 {
-        .k-pivot .k-grid {
-            display: block;
-        }
-        .k-pivotgrid {
-            display: flex;
-            flex-direction: column;
-
-            & > div {
-                display: flex;
-                flex-direction: row;
-                overflow: hidden;
-            }
-
-            .k-pivotgrid-empty-cell,
-            .k-pivotgrid-row-headers {
-                flex: 1 1 30%;
-            }
-
-            .k-pivotgrid-column-headers,
-            .k-pivotgrid-values {
-                flex: 1 1 70%;
-            }
-        }
-        .k-pivotgrid-column-headers {
-            padding-right: $default-scrollbar-width;
-            padding-left: 0;
-        }
-
-        [dir = "rtl"],
-        .k-rtl {
-            .k-pivotgrid-column-headers {
-                padding-right: 0;
-                padding-left: $default-scrollbar-width;
-            }
-        }
-    }
-
-}