polestar-ui-kit/styles/components/panel/index.less

## Install

@import '../../themes/default/index';
@import '../../mixins/index';

@ps-panel-prefix-cls: ~"@{polestar-prefix}-panel";

.@{ps-panel-prefix-cls} {
    
    /* 이상 없으면 삭제
    display: flex;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 100%;
    flex-direction: column; */
    
    border-top: @modal-border-width-base @modal-border-style-base @modal-border-color;
    border-bottom: @modal-border-width-base @modal-border-style-base @modal-border-color;

    &-header {
        display: flex;
        
        /* 이상 없으면 삭제
        flex-grow: 1;
        flex-shrink: 1;
        flex-basis: 100%;
        flex-direction: row; */

        padding: 0 10px;
        background: @modal-header-bg;
        border-bottom: @modal-border-width-base @modal-border-style-base @modal-border-color;
        .@{ps-panel-prefix-cls}-title {
            display: flex;
            justify-content: flex-start;
            align-items: center;
            flex-grow: 1;
            .font-noto();
            font-size: @font-size-lg;
        }
        .@{ps-panel-prefix-cls}-action-items {
            display: flex;
            justify-content: flex-end;
            flex-grow: 1;
            align-items: center;
            margin: 5px 0;
            
            .@{ps-panel-prefix-cls}-custom-buttons {
                display: flex;
                align-items: center;
                
                .@{ps-button-prefix-cls}-container {
                    .@{ps-button-prefix-cls} {
                        border: @border-width-base @border-style-base @gray-3;
                        background: @white;
                    }
                }
            }
            .@{ps-button-prefix-cls}-container {
                .@{ps-button-prefix-cls} {
                    border: unset;
                    background: unset;
                }
            }
        }
    }
    &-content,
    &-footer {
        padding: 10px;
    }
}