@progress/kendo-ui/css/web/Default/window/_layout.less

This package is part of the [Kendo UI for jQuery](http://www.telerik.com/kendo-ui) suite.

@window-line-height: (20 / 14);


// Window
.k-window {
    padding: 0;
    border-width: @window-border-width;
    border-style: @window-border-style;
    line-height: @window-line-height;
    box-sizing: border-box;
    display: inline-flex;
    flex-direction: column;
    position: absolute;
    z-index: 10001;

    .k-overlay {
        position: absolute;
        opacity: 0;
    }

    &.k-window-maximized {
        border-radius: 0;
        box-shadow: none;

        .k-window-titlebar,
        .k-window-content {
            border-radius: 0;
        }
    }
}


// Window sizes
each(@window-sizes, {
    .k-window-@{key} {
        width: @value;
    }
});


// Title bar
.k-window-titlebar {
    padding: @window-titlebar-padding-y @window-titlebar-padding-x;
    border-width: @window-titlebar-border-width;
    border-style: @window-titlebar-border-style;
    width: 100%;
    box-sizing: border-box;
    background-position: 0 0;
    background-repeat: repeat-x;
    white-space: nowrap;
    min-height: 16px; // icon size
    position: relative;
    flex-shrink: 0;
    align-items: center;
}


// Title bar title text
.k-window-title {
    font-size: @window-title-font-size;
    line-height: @window-title-line-height;
    font-weight: @window-title-font-weight;
    flex: 1;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    cursor: default;
}
.k-window-title::before {
    // Empty title height fix
    content: "";
    display: inline-block;
}


// Title bar actions
.k-window-titlebar .k-window-actions {
    margin: 0 calc( @window-titlebar-padding-x / -2 );
    margin-inline-end: calc( @window-titlebar-padding-x / -2 );
    flex-shrink: 0;
    align-items: center;
}
.k-window-titlebar .k-window-action {
    padding: 2px;
    width: 20px;
    height: 20px;
    border-width: 0;
    border-style: solid;
    border-color: transparent;
    color: inherit;
    box-sizing: content-box;
    opacity: .7;

    &:hover { opacity: 1; }

    .k-icon { opacity: 1; }
}


// Content
.k-window-content,
.k-prompt-container {
    padding: @window-inner-padding-y @window-inner-padding-x;
    box-sizing: border-box;
    overflow: auto;
    position: relative;
    flex: 1 1 auto;
    outline: 0;
}
.k-window-content + .k-prompt-container {
    margin-top: -@window-inner-padding-y;
}
.k-prompt-container .k-textbox {
    width: 100%;
}

.k-window-iframecontent {
    padding: 0;
    overflow: visible;

    .k-content-frame {
        vertical-align: top;
        border: 0;
        width: 100%;
        height: 100%;
    }
}

.k-window-content > .km-scroll-container {
    height: 100%;
}


.k-window > .k-resize-handle {
    position: absolute;
    z-index: 1;
    background-color: #fff;
    font-size: 0;
    line-height: 6px;
    opacity: 0;
    zoom: 1;
}

.k-resize-n { top: 0; left: 0; width: 100%; height: 6px; cursor: n-resize; }
.k-resize-e { top: 0; right: 0; width: 6px; height: 100%; cursor: e-resize; }
.k-resize-s { bottom: 0; left: 0; width: 100%; height: 6px; cursor: s-resize; }
.k-resize-w { top: 0; left: 0; width: 6px; height: 100%; cursor: w-resize; }
.k-resize-se { bottom: 0; right: 0; width: 6px; height: 6px; cursor: se-resize; }
.k-resize-sw { bottom: 0; left: 0; width: 6px; height: 6px; cursor: sw-resize; }
.k-resize-ne { top: 0; right: 0; width: 6px; height: 6px; cursor: ne-resize; }
.k-resize-nw { top: 0; left: 0; width: 6px; height: 6px; cursor: nw-resize; }

.k-overlay {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10001;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: .5;
    -webkit-backface-visibility: hidden;
}


.k-window > .k-action-buttons,
.k-window-content > .k-action-buttons {
    border-width: 1px 0 0;
    border-style: solid;
}

.k-ie9 {
    .k-window-content {
        height: ~"calc( 100% - ((@{window-title-line-height} * 1em) + (@{window-titlebar-padding-y} * 2)) )";
        border-radius: 0;
    }

    .k-window-titlebar .k-window-actions,
    .k-window-title {
        display: inline-block;
    }
}


// RTL
.k-rtl .k-window-titlebar .k-window-actions {
    right: auto;
    left: (@window-titlebar-padding-x / 2);
}