devextreme/less/sources/widgets/common/toolbar.less

HTML5 JavaScript Component Suite for Responsive Web Development

/**
* DevExtreme (widgets/common/toolbar.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) "./list.less";
@import (once) "./actionSheet.less";
@import (once) "./dropDownMenu.less";
@import (once) "./button.less";
@import (once) "./checkBox.less";
@import (once) "./dateBox.less";
@import (once) "./menu.less";
@import (once) "./selectBox.less";
@import (once) "./tabs.less";
@import (once) "./textBox.less";
@import (once) "./buttonGroup.less";
@import (once) "./dropDownButton.less";

.dx-toolbar {
    width: 100%;

    .dx-button-content:after {
        display: none;
    }

    &.dx-toolbar-multiline {
        .dx-toolbar-items-container {
            height: 100%;

            .dx-toolbar-before {
                position: relative;
            }
        }

        .dx-toolbar-item {
            display: inline-block;
        }
    }
}

.dx-toolbar .dx-button .dx-icon {
    box-sizing: content-box;
}

.dx-toolbar-items-container {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.dx-toolbar-item() {
    display: table-cell;
    padding: 0 5px;
    vertical-align: middle;
    box-sizing: content-box;

    .dx-tabs {
        table-layout: auto;
    }

    img {
        display: block;
    }
}

.dx-toolbar-item {
    .dx-toolbar-item();
}

.dx-toolbar-menu-container {
    .dx-toolbar-item();
}

.dx-toolbar-group {
    float: left;
    margin: 0 10px;
}

.dx-toolbar-before,
.dx-toolbar-after {
    position: absolute;
}

.dx-toolbar-center:empty {
    display: none;
}

.dx-toolbar-before {
    left: 0;
}

.dx-toolbar-after {
    right: 0;
}

.dx-toolbar-label {
    white-space: nowrap;
    -webkit-user-drag: none;

    .dx-toolbar-item-content > div {
        .dx-overflow();
    }
}

.dx-toolbar-label > div {
    .dx-overflow();

    // NOTE: Prevent croping of italic text in label (T126187)
    margin: 0 -5px;
    padding: 0 5px;
}

.dx-toolbar-center {
    margin: 0 auto;
    height: 100%;
    text-align: center;
}
// B232272
.dx-toolbar-center,
.dx-toolbar-before,
.dx-toolbar-after {
    top: 0;
    display: table;
    height: 100%;
}

.dx-rtl {
    .dx-toolbar-before {
        right: 0;
        left: auto;
    }

    .dx-toolbar-after {
        right: auto;
        left: 0;
    }
}

.dx-toolbar-menu-section:empty {
    display: none;
}

.dx-dropdownmenu-popup-wrapper .dx-toolbar-menu-custom > .dx-list-item-content,
.dx-toolbar-menu-section .dx-toolbar-hidden-button > .dx-list-item-content {
    padding: 0;
}

.dx-toolbar-menu-section.dx-toolbar-menu-last-section {
    border-bottom: none;
}

.dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button {
    border: none;
    background: none;
    margin: 0;
    width: 100%;
    text-align: left;
    padding: 10px;

    .dx-button-text {
        line-height: normal;
    }

    .dx-button-content {
        text-align: left;

        .dx-rtl&,
        .dx-rtl & {
            text-align: right;
        }
    }
}

.dx-toolbar-menu-section .dx-toolbar-hidden-button {
    .dx-toolbar-item-auto-hide {
        padding: 0;
    }
}

.dx-toolbar-text-auto-hide .dx-button .dx-button-text {
    display: none;
}

.dx-toolbar .dx-texteditor {
    width: 150px;
}

.dx-toolbar-item-invisible {
    display: none;
}

.dx-toolbar-hidden-button-group {
    &.dx-state-hover {
        background-color: transparent;
    }

    .dx-list-item-content {
        padding: 0;

        .dx-toolbar-item-auto-hide {
            padding: 0;
        }
    }

    .dx-buttongroup {
        width: 100%;

        .dx-buttongroup-wrapper {
            flex-direction: column;

            .dx-buttongroup-item {
                border: none;
                text-align: left;

                .dx-rtl&,
                .dx-rtl & {
                    text-align: right;
                }
            }
        }
    }
}