devextreme/less/sources/widgets/common/dateBox.less

HTML5 JavaScript Component Suite for Responsive Web Development

/**
* DevExtreme (widgets/common/dateBox.less)
* Version: 20.1.4
* Build date: Tue Jun 02 2020
*
* Copyright (c) 2012 - 2020 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
@import (once) "./timeView.less";
@import (once) "./dateView.less";
@import (once) "./box.less";
@import (once) "./calendar.less";
@import (once) "./list.less";

.dx-texteditor {
    input[type=date] {
        &::-webkit-inner-spin-button {
            height: 20px;
        }
    }
}

.dx-datebox-native {
    &.dx-state-focused.dx-texteditor-empty {
        .dx-placeholder {
            display: none;
        }
    }
}

.dx-datebox {
    max-width: 100%;

    .dx-texteditor-input::-webkit-datetime-edit {
        .dx-overflow();
    }
}

.dx-datebox.dx-texteditor-empty {
    input::-webkit-datetime-edit {
        color: transparent;
    }

    &.dx-state-focused {
        input::-webkit-datetime-edit {
            color: inherit;
        }
    }
}

.dx-datebox-wrapper {
    .dx-popup-content {
        padding-top: 20px;
        padding-bottom: 20px;
    }
}

.dx-rtl {
    .dx-texteditor-input {
        text-align: right;
    }
}

.dx-datebox-button-cell {
    .dx-button {
        min-width: 90px;

        &.dx-datebox-apply-button {
            margin-right: 10px;
            margin-left: 0;
        }

        &.dx-datebox-cancel-button {
            margin-right: 0;
            margin-left: 0;
        }
    }
}

.dx-datebox-buttons-container {
    text-align: right;
    width: 100%;
}

.dx-colorview-container-cell {
    float: left;
}