"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var Styling_1 = require("../../Styling");
var MediumMediaQuery = "@media screen and (max-width: " + Styling_1.ScreenWidthMaxMedium + "px)";
var SmallMediaQuery = "@media screen and (max-width: " + Styling_1.ScreenWidthMaxSmall + "px)";
function getStyles(props) {
    var theme = props.theme, isCurrentItem = props.isCurrentItem;
    var palette = theme.palette, fonts = theme.fonts;
    // Sizing values.
    var chevronNormalSize = 12;
    var chevronSmallSize = 8;
    var height = 40;
    // Colors used by the crumb.
    var crumbHoverBackground = palette.neutralLighter;
    var crumbHoverColor = palette.neutralPrimary;
    var crumbActiveBackground = palette.neutralTertiaryAlt;
    var crumbActiveColor = palette.neutralPrimary;
    var chevronColor = palette.neutralSecondary;
    return {
        root: [
            'ms-Crumb',
            {
                margin: 0,
                display: 'flex'
            }
        ],
        chevron: [
            'ms-Crumb-chevron',
            {
                display: 'inline-block',
                verticalAlign: 'top',
                color: chevronColor,
                height: height,
                lineHeight: height + 6,
                overflow: 'hidden',
                fontSize: chevronNormalSize,
                userSelect: 'none',
                selectors: (_a = {},
                    _a[Styling_1.HighContrastSelector] = {
                        color: 'WindowText',
                        MsHighContrastAdjust: 'none'
                    },
                    _a[MediumMediaQuery] = {
                        lineHeight: height + 2
                    },
                    _a[SmallMediaQuery] = {
                        fontSize: chevronSmallSize
                    },
                    _a)
            }
        ],
        crumbButton: [
            'ms-Crumb-crumbButton',
            {
                textAlign: 'left',
                selectors: {
                    ':hover': {
                        backgroundColor: crumbHoverBackground,
                        color: crumbHoverColor,
                        cursor: 'pointer'
                    },
                    ':active': {
                        backgroundColor: crumbActiveBackground,
                        color: crumbActiveColor
                    }
                }
            },
        ],
        crumbLabel: [
            'ms-Crumb-crumbLabel',
            {
                padding: '0 4px'
            }
        ],
        overflowIcon: {
            height: height,
            lineHeight: height + 4
        },
        textContent: [
            'ms-Crumb-textContent',
            fonts.xLarge,
            {
                verticalAlign: 'top',
                height: height,
                lineHeight: height,
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
                selectors: (_b = {},
                    _b[MediumMediaQuery] = fonts.large,
                    _b[SmallMediaQuery] = fonts.medium,
                    _b)
            },
            !isCurrentItem && {
                maxWidth: 180
            }
        ]
    };
    var _a, _b;
}
exports.getStyles = getStyles;
//# sourceMappingURL=Crumb.styles.js.map