IconExamples.scss

.icons-example {
    .dark-toggle {
        margin-right: 5px;
    }

    .icon-set {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-end;
        margin: 20px 0;

        &.dark {
            background: #333;

            .icon-label {
                color: #efefef;
            }
        }

        .icon {
            width: 20%;
            min-width: 200px;
            margin: 15px 20px;
            padding: 10px;
            text-align: center;

            &.is-expanded {
                border: 1px solid #efefef;
            }

            svg {
                max-width: 100%;
                max-height: 250px;
            }

            .props-section {
                margin: 5px 0;
                padding: 10px 0;
            }

            &.is-expanded .props-section {
                background-color: #f5f5f5;
            }

            .props-code {
                display: block;
                padding: 0 10px;
                overflow: scroll;
                font-size: 85%;
                font-family: monospace;
                white-space: pre;
                text-align: left;
            }

            .btn-toggle-props {
                margin-top: 10px;
            }
        }

        .icon-label {
            display: block;
        }
    }
}