lightspeeddevelopment/lsx-search

View on GitHub
assets/css/scss/_cmb_tabbed_theme.scss

Summary

Maintainability
Test Coverage
/**
 * The CMB2 Settings Page Tabbed Theme.
 *
 * @package lsx-search
 */

/* CMB2 Settings Styles */
.wp-admin.settings_page_lsx-search-settings {
    span.version {
        font-size: .4em;
        font-weight: 700;
        position: relative;
        top: -4px;
        left: 5px;
        padding: 2px 5px;
        border: 1px solid #ccc;
        background: #f5f5f5;
        -webkit-border-radius: 10px;
        border-radius: 10px;
        -moz-background-clip: padding;
        -webkit-background-clip: padding-box;
        background-clip: padding-box;
    }
    .wp-filter {
        background: none;
        border: none;
        box-shadow: none;
        margin: 0;
        padding-left: 0;
        .filter-links {
            .current {
                border-bottom: none;
                font-weight: 600;
                color: #23282d;

                &:hover {
                    color: #23282d;
                }
            }
            >li {
                >a {
                    color: #0073aa;
                    border-bottom: none;
                    margin: 2px;

                    &:hover {
                        color: #00a0d2;
                    }
                }

                &:nth-of-type(1) {
                    >a {
                        margin-left: 0;
                    }
                }
            }
        }
    }

    .cmb2-wrap {
        &.form-table {
            margin-top: 0;
            border: 1px solid transparent;

            .tab.tab-nav {
                .cmb-row {
                    display: flex;
                    flex-direction: row;

                    @media only screen and (min-width: 1000px) {
                        &.cmb-type-colorpicker {
                            .cmb-td {
                                display: -webkit-box;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-orient: horizontal;
                                -webkit-box-direction: normal;
                                    -ms-flex-direction: row;
                                        flex-direction: row;
                            }
                        }
                    }

                    h3.cmb2-metabox-title {
                        color: #23282d;
                        font-size: 17px;
                        margin: 1em 0;
                        font-weight: 600;
                        -webkit-font-smoothing: subpixel-antialiased;
                        line-height: 1.4em;
                        margin-bottom: 0px;
                    }

                    div.cmb-th {
                        text-align: left;
                        padding: 20px 10px 20px 0;
                        width: 200px;
                        font-size: 14px;
                        line-height: 1.3;
                        font-weight: 600;
                        color: #23282d;
                        text-shadow: none;
                        vertical-align: baseline;
                        min-width: 210px !important;
                    }

                    div.cmb-td {
                        text-align: left !important;
                        padding: 20px 10px 20px 0 !important;

                        &:nth-of-type(1) {
                            padding-top: 0px !important;
                        }

                        .cmb2-metabox-title {
                            margin-top: 0px;
                        }

                        select {
                            font-size: 14px;
                            line-height: 2;
                            color: #32373c;
                            border-color: #7e8993;
                            box-shadow: none;
                            border-radius: 3px;
                            padding: 0 24px 0 8px;
                            min-height: 30px;
                            max-width: 25rem;
                            -webkit-appearance: none;
                            background-size: 16px 16px;
                            cursor: pointer;
                            vertical-align: middle;
                        }

                        .cmb2-media-status {
                            padding-top: 10px;
                        }
                        input {
                            &.cmb2-upload-file {
                                margin-right:15px;
                            }
                        }

                        margin-right: 15px;
                    }

                    p.cmb2-metabox-description {
                        margin: 2px 0 5px;
                        color: #666;
                        font-style: italic;
                        line-height: 1.5;
                        margin-top: 4px;
                        margin-bottom: 0;
                    }

                    input[type=radio] {
                        margin-top: -4px;
                        margin-right: 4px;
                        float: none;
                    }
                }
            }
        }
    }
}