modules/frontend/app/primitives/panel/index.scss

/*
 * Licensed to the Apache Software Foundation (ASF) under one or more
 * contributor license agreements.  See the NOTICE file distributed with
 * this work for additional information regarding copyright ownership.
 * The ASF licenses this file to You under the Apache License, Version 2.0
 * (the "License"); you may not use this file except in compliance with
 * the License.  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

@import '../../../public/stylesheets/variables';

.panel {
    &--ignite {
        border: none;
        border-radius: 0 0 4px 4px;

        background-color: white;
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);

        & > header {
            height: auto;
            padding: 22px 20px;

            background-color: initial;
            font-size: 16px;

            &:hover {
                text-decoration: none;
            }

            h5 {
                margin: 0;
                font-size: 16px;
                font-weight: normal;
                line-height: 36px;
            }
        }

        & > hr {
            margin: 0;
            border-top: 1px solid #ddd;
        }

        & > section {
            padding: 0 20px;
        }

        & > .panel-heading {
            height: auto;
            padding: 22px 20px;

            background-color: initial;
            border-bottom: 1px solid $table-border-color;

            &:hover {
                text-decoration: none;
            }

            & > .panel-title {
                font-size: 16px;
                line-height: 36px;

                & > .panel-selected {
                    font-size: 14px;
                    font-style: italic;
                    line-height: 36px;
                    cursor: default;
                }
            }
        }

        & > header.header-with-selector {
            margin: 0;
            padding: 14px 20px;
            min-height: 65px;

            border-bottom: 1px solid #ddd;

            sub {
                bottom: 0;
            }
        }
    }

    &--collapse {
        & > header {
            cursor: pointer;
        }

        [ignite-icon='expand'],
        [ignite-icon='collapse'] {
            width: 13px;
            height: 13px;

            margin-right: 9px;
        }

        [ignite-icon='expand'] {
            display: none;
        }

        [ignite-icon='collapse'] {
            display: inline-block;
        }

        &.in {
            [ignite-icon='expand'] {
                display: inline-block;
            }

            [ignite-icon='collapse'] {
                display: none;
            }
        }
    }
}

// Adding top border for panels in modals
.modal-body {
    .panel--ignite:not(.panel--ignite__without-border) {
        border-top: 1px solid #d4d4d4;
        border-radius: 4px 4px 0 0 ;
    }
}