devextreme/less/sources/widgets/ios7/menuBase.ios7.less

HTML5 JavaScript Component Suite for Responsive Web Development

/**
* DevExtreme (widgets/ios7/menuBase.ios7.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/
*/
@IOS7_MENU_ARROW_IMAGE_WIDTH: 8px;
@IOS7_MENU_ARROW_IMAGE_HEIGHT: 19px;
@IOS7_MENU_ICON_SIZE: 24px;
@IOS7_MENU_ICON_OFFSET: 8px;

.dx-menu-base {
    .dx-base-typography();

    .dx-menu-item-content {
        .dx-state-disabled & {
            color: @IOS7_MENU_ITEM_DISABLED_COLOR;
            opacity: 0.7;
        }
    }

    .dx-menu-item-text {
        padding-left: @IOS7_MENU_ICON_OFFSET + @IOS7_MENU_ICON_SIZE;

        .dx-menu-no-icons & {
            padding-left: 0;
        }

        .dx-rtl &,
        .dx-rtl& {
            padding-left: 0;
            padding-right: @IOS7_MENU_ICON_OFFSET + @IOS7_MENU_ICON_SIZE;
        }
    }

    .dx-menu-item-selected,
    .dx-menu-item-selected.dx-state-focused {
        background-color: @IOS7_MENU_ITEM_SELECTED_BACKGROUND;
    }

    .dx-menu-item.dx-state-focused,
    .dx-menu-item.dx-state-active {
        background-color: @IOS7_SELECTION_BACKGROUND;
    }

    .dx-menu-item-popout {
        min-width: @IOS7_MENU_ARROW_IMAGE_WIDTH;
        min-height: @IOS7_MENU_ARROW_IMAGE_HEIGHT;
    }

    .dx-icon {
        .dx-icon-sizing(@IOS7_MENU_ICON_SIZE);
    }

    .dx-menu-item-has-text {
        .dx-icon {
            margin: 0 -@IOS7_MENU_ICON_SIZE 0 0;

            .dx-rtl &,
            .dx-rtl& {
                margin: 0 0 0 -@IOS7_MENU_ICON_SIZE;
            }
        }
    }

    &.dx-rtl {
        .dx-menu-item-popout-container {
            margin-left: 0;
            margin-right: auto;
        }
    }
}