devexpress-dashboard 19.2.2-beta → 19.2.3

package/scss/designer/dashboard-property-grid.scss

@@ -1 +1 @@
-@import "../styles/_imports.scss";
    .dx-shadow {
        position: absolute;
        left: 0;
        width: 100%;
        height: 2px;
        &.dx-shadow-top {
            top: 0;
            box-shadow: inset 0px 20px 10px -20px rgba(0, 0, 0, 0.10);
            visibility: hidden;
        }
        &.dx-shadow-bottom {
            bottom: 0;
            box-shadow: inset 0px -20px 10px -20px rgba(0, 0, 0, 0.10);
        }
    }
    .dx-popup-content {
        overflow: visible;
    }
    .dx-accordion-item.dx-accordion-item-closed {
        border-bottom: none;
    }
    .dx-accordion-item, .dx-accordion-item.dx-accordion-item-opened {
        .dx-dashboard-accordion-group {
            > .dx-accordion-item-title {
                padding: 0;
            }
            margin: $accordionPadding (-$accordionPadding) (-$accordionPadding) (-$accordionPadding);
            padding: 0 $accordionPadding $accordionPadding $accordionPadding;
            background-color: $dashboard-item-binding-menu-bg;
            border-top: 1px solid $dashboard-border-color;
            h5 {
                @include dx-dashboard-binding-header;
            }
        }
        .dx-accordion-item-title.dx-dashboard-item-type-selector {
            height: 80px;
            h5 {
                height: 20px;
                line-height: 20px;
                vertical-align: initial;
                position: relative;
                margin: 0px;
                vertical-align: middle;
                transition: color 0.15s;
                @include dx-dashboard-binding-header;
            }
        }
        &.dx-dashboard-accordion-item-no-border .dx-dashboard-item-type-selector {
            cursor: default;
            .dx-shadow {
                visibility: hidden;
            }
        }
        .dx-accordion-item-title.dx-dashboard-items-wrapper {
            font-size: 14px;
        }
        .dx-dashboard-items-wrapper {
            padding: 0;
            cursor: default;
            dx-dashboard-group-data-items {
                display: block;
                padding: 10px 20px;
                .dx-dashboard-data-item:first-of-type {
                    margin-top: 0px;
                }
            }
        }
    }
    .dx-accordion-item {
        border-left: none;
        border-right: none;
        &.dx-dashboard-accordion-item-no-border {
            border-top: none;
            &.dx-state-hover, &.dx-state-active {
                .dx-accordion-item-title {
                    background-color: transparent;
                }
            }
        }
    }
    .dx-accordion-item-title {
        height: $accordionTitleHeight;
        line-height: $accordionTitleHeight;
        vertical-align: middle;
        padding: 0 $accordionPadding;
        transition: background-color 0.15s;
        &::before {
            display: none;
        }
        h4 {
            position: absolute;
            vertical-align: middle;
            padding: 0;
            @include dx-dashboard-binding-header;
        }
        .dx-dashboard-accordion-title-content {
            display: flex;
            text-align: left;
            justify-content: flex-end;
            position: relative;
            height: 100%;
            h5 {
                flex-shrink: 1000000000;
                min-width: 0;
                transition: color 0.15s;
                margin: 0px;
                @include dx-dashboard-binding-header;
                @include dx-dashboard-text-overflow;
            }
            &:hover {
                .dx-dashboard-properties-header-button {
                    display: inline-block;
                }
            }
            h6 {
                text-align: right;
                flex-grow: 1;
                vertical-align: middle;
                font-size: $smallFontSize;
                font-weight: normal;
                margin: 0;
                padding-right: 1px;
                color: $dashboard-designer-sub-header-color;
                @include dx-dashboard-text-overflow;
                .dx-dashboard-properties-header-button {
                    @include dx-dashboard-icon-hovered-image($defaultIconSize);
                    display: none;
                    margin-top: ($accordionTitleHeight - $defaultIconSize)/2;
                    margin-bottom: ($accordionTitleHeight - $defaultIconSize)/2;
                    cursor: pointer;
                    &.dx-state-disabled {
                        svg use {
                            color: $dashboard-disabled-icon-color;
                        }
                    }
                }
            }
        }
    }
    .dx-accordion-item.dx-state-active:not(.dx-accordion-item-opened) > .dx-accordion-item-title {
        color: inherit;
        background-color: inherit;
    }
    .dx-accordion-item-body {
        position: relative;
        padding: 0 $accordionPadding 20px;
    }
    h4 {
        padding: 10px 0 5px 0;
        @include dx-dashboard-binding-header;
    }
    .dx-accordion-item.dx-accordion-item-opened {
        h5 {
            color: $dashboard-designer-sub-header-color;
        }
    }
    .dx-accordion-item {
        &.dx-accordion-item-opened {
            .dx-accordion-item-title {
                cursor: default;
                .dx-shadow-top {
                    visibility: visible;
                }
            }
            > :not(.dx-dashboard-item-type-selector) {
                background-color: $dashboard-item-binding-menu-bg;
            }
        }
    }
    .propertygrid-editor-displayName {
        @include dx-dashboard-binding-header;
        margin-bottom: $propertiesCaptionMargin;
    }
    .dx-dashboard-field-chooser {
        height: 100%;
        width: 100%;
        padding-bottom: 7px;
        &.dx-dashboard-include-summary + div {
            min-height: 60px;
        }
    }
    .dx-dashboard-properties .dx-editors .dx-fieldset .dx-field-value {
        padding-bottom: 7px;
    }
    .dx-editors {
        .dx-fieldset .dx-field {
            background-color: transparent;
            padding: 0;
        }
        .dx-editor .dx-field-label.dx-accordion-header {
            left: 0;
        }
    }
    .dx-editors .dx-editor .dx-field-label.dx-accordion-header {
        position: static;
        width: $editorsWidth;
        padding-bottom: 2px;
    }
    .dx-field-label {
        float: none;
        width: $editorsWidth;
    }
    .dx-field-value:not(.dx-switch):not(.dx-checkbox):not(.dx-button), .dx-field-value-static {
        width: $editorsWidth;
        float: none;
    }
    .propertygrid-editor-checkbox {
        position: absolute;
        right: 0;
        top: -36px;
    }
    margin: 10px -5px;
    display: flex;
    .dx-button {
        flex: auto;
        margin: 0 5px;
        .dx-button-content {
            padding: 7px 15px;
        }
    }
+@import "../styles/_imports.scss";
    .dx-shadow {
        position: absolute;
        left: 0;
        width: 100%;
        height: 2px;
        &.dx-shadow-top {
            top: 0;
            box-shadow: inset 0px 20px 10px -20px rgba(0, 0, 0, 0.10);
            visibility: hidden;
        }
        &.dx-shadow-bottom {
            bottom: 0;
            box-shadow: inset 0px -20px 10px -20px rgba(0, 0, 0, 0.10);
        }
    }
    .dx-popup-content {
        overflow: visible;
    }
    .dx-accordion-item.dx-accordion-item-closed {
        border-bottom: none;
    }
    .dx-accordion-item, .dx-accordion-item.dx-accordion-item-opened {
        .dx-dashboard-accordion-group {
            > .dx-accordion-item-title {
                padding: 0;
            }
            margin: $accordionPadding (-$accordionPadding) (-$accordionPadding) (-$accordionPadding);
            padding: 0 $accordionPadding $accordionPadding $accordionPadding;
            background-color: $dashboard-item-binding-menu-bg;
            border-top: 1px solid $dashboard-border-color;
            h5 {
                @include dx-dashboard-binding-header;
            }
        }
        .dx-accordion-item-title.dx-dashboard-item-type-selector {
            height: 80px;
            h5 {
                height: 20px;
                line-height: 20px;
                vertical-align: initial;
                position: relative;
                margin: 0px;
                vertical-align: middle;
                transition: color 0.15s;
                @include dx-dashboard-binding-header;
            }
        }
        &.dx-dashboard-accordion-item-no-border .dx-dashboard-item-type-selector {
            cursor: default;
            .dx-shadow {
                visibility: hidden;
            }
        }
        .dx-accordion-item-title.dx-dashboard-items-wrapper {
            font-size: 14px;
        }
        .dx-dashboard-items-wrapper {
            padding: 0;
            cursor: default;
            dx-dashboard-group-data-items {
                display: block;
                padding: 10px 20px;
                .dx-dashboard-data-item:first-of-type {
                    margin-top: 0px;
                }
            }
        }
    }
    .dx-accordion-item {
        border-left: none;
        border-right: none;
        &.dx-dashboard-accordion-item-no-border {
            border-top: none;
            &.dx-state-hover, &.dx-state-active {
                .dx-accordion-item-title {
                    background-color: transparent;
                }
            }
        }
    }
    .dx-accordion-item-title {
        height: $accordionTitleHeight;
        vertical-align: middle;
        padding: 0 $accordionPadding;
        transition: background-color 0.15s;
        h4, h5, h6 {
            line-height: $accordionTitleHeight;
        }
        &::before {
            display: none;
        }
        h4 {
            position: absolute;
            vertical-align: middle;
            padding: 0;
            @include dx-dashboard-binding-header;
        }
        .dx-dashboard-accordion-title-content {
            display: flex;
            text-align: left;
            justify-content: flex-end;
            position: relative;
            height: 100%;
            h5 {
                flex-shrink: 1000000000;
                min-width: 0;
                transition: color 0.15s;
                margin: 0px;
                @include dx-dashboard-binding-header;
                @include dx-dashboard-text-overflow;
            }
            &:hover {
                .dx-dashboard-properties-header-button {
                    display: inline-block;
                }
            }
            h6 {
                text-align: right;
                flex-grow: 1;
                vertical-align: middle;
                font-size: $smallFontSize;
                font-weight: normal;
                margin: 0;
                padding-right: 1px;
                color: $dashboard-designer-sub-header-color;
                @include dx-dashboard-text-overflow;
                .dx-dashboard-properties-header-button {
                    @include dx-dashboard-icon-hovered-image($defaultIconSize);
                    display: none;
                    margin-top: ($accordionTitleHeight - $defaultIconSize)/2;
                    margin-bottom: ($accordionTitleHeight - $defaultIconSize)/2;
                    cursor: pointer;
                    &.dx-state-disabled {
                        svg use {
                            color: $dashboard-disabled-icon-color;
                        }
                    }
                }
            }
        }
    }
    .dx-accordion-item.dx-state-active:not(.dx-accordion-item-opened) > .dx-accordion-item-title {
        color: inherit;
        background-color: inherit;
    }
    .dx-accordion-item-body {
        position: relative;
        padding: 0 $accordionPadding 20px;
    }
    h4 {
        padding: 10px 0 5px 0;
        @include dx-dashboard-binding-header;
    }
    .dx-accordion-item.dx-accordion-item-opened {
        h5 {
            color: $dashboard-designer-sub-header-color;
        }
    }
    .dx-accordion-item {
        &.dx-accordion-item-opened {
            .dx-accordion-item-title {
                cursor: default;
                .dx-shadow-top {
                    visibility: visible;
                }
            }
            > :not(.dx-dashboard-item-type-selector) {
                background-color: $dashboard-item-binding-menu-bg;
            }
        }
    }
    .propertygrid-editor-displayName {
        @include dx-dashboard-binding-header;
        margin-bottom: $propertiesCaptionMargin;
    }
    .dx-dashboard-field-chooser {
        height: 100%;
        width: 100%;
        padding-bottom: 7px;
        &.dx-dashboard-include-summary + div {
            min-height: 60px;
        }
    }
    .dx-dashboard-properties .dx-editors .dx-fieldset .dx-field-value {
        padding-bottom: 7px;
    }
    .dx-editors {
        .dx-fieldset .dx-field {
            background-color: transparent;
            padding: 0;
        }
        .dx-editor .dx-field-label.dx-accordion-header {
            left: 0;
        }
    }
    .dx-editors .dx-editor .dx-field-label.dx-accordion-header {
        position: static;
        width: $editorsWidth;
        padding-bottom: 2px;
    }
    .dx-field-label {
        float: none;
        width: $editorsWidth;
    }
    .dx-field-value:not(.dx-switch):not(.dx-checkbox):not(.dx-button), .dx-field-value-static {
        width: $editorsWidth;
        float: none;
    }
    .propertygrid-editor-checkbox {
        position: absolute;
        right: 0;
        top: -36px;
    }
    margin: 10px -5px;
    display: flex;
    .dx-button {
        flex: auto;
        margin: 0 5px;
        .dx-button-content {
            padding: 7px 15px;
        }
    }