lightspeeddevelopment/lsx-customizer

View on GitHub
assets/css/popup-maker/popup-maker.scss

Summary

Maintainability
Test Coverage
@import '../scss/global/variables';
@import '../scss/global/mixins';
@import '../scss/global/placeholders';

// Placeholders and Mixins

%bootstrap-form-control {
    display: block;
    width: 100%;
    height: 50px;
    color: #4a4a4a;
    background-color: #fff;
    background-image: none;
    border: 2px solid #DDD;
    border-radius: 2px;


    // lsx-form-control
    box-shadow: none;
    font-size: 18px;
    line-height: 1.33;
    padding: 10px 20px;
    transition: all 150ms ease;

    &:focus {
        border-color: nth($blue,1);
    }
}

.pum {
    &.pum-theme-default-theme,
    &.pum-theme-lightbox,
    &.pum-theme-enterprise-blue,
    &.pum-theme-hello-box,
    &.pum-theme-cutting-edge,
    &.pum-theme-framed-border,
    &.pum-overlay {
        background-color: rgba(0,0,0,0.75);
        .pum-container {
            background-color: white;
            box-shadow: none;
            border-radius: 0;
            @include media('<tablet') {
                max-width: 80% !important;
            }
        }
        .pum-content {
            color: nth($gray, 3);
            + .pum-close {
                //border: 4px solid nth( $blue, 1 );
                border-radius: 50%;
                background: white;
                color: black;
                width: 34px;
                height: 34px;
                top: -20px;
                right: -20px;
                box-shadow: none;
                padding: 0;
            }
        }
    }
    .pum-content {
        .popmake-tcp-box {
            height: 100% !important;
        }
        .aligncenter {
            margin: 0 auto;
        }
        .pum-form__field--consent {
            display: none;
        }
        .wp-block-columns {
            margin-bottom: 0;
        }
        img {
            width: 100%;
        }
        .wp-block-lsx-blocks-lsx-container {
            .lsx-container-inside {
                .lsx-container-content {
                    @include media('<tablet') {
                        padding: 0em;
                    }
                }
            }
        }
    }
    form,
    .pum-form--style-default,
    .pum-age-form {
        input,
        input[type="email"],
        input[type="date"],
        input[type="datetime"],
        input[type="datetime-local"],
        input[type="month"],
        input[type="number"],
        input[type="password"],
        input[type="search"],
        input[type="tel"],
        input[type="text"],
        input[type="time"],
        input[type="week"],
        input[type="url"] {
            @extend %lsx-form-field;
            display: block;
            width: 100%;
            min-height: 50px;
            color: nth($gray, 3);
            background-color: white;
            background-image: none;
            border: 2px solid #DDD;
            border-radius: 2px;
            &:focus {
                border-color: nth( $blue, 1 );
                outline: 0;
            }
        }
        button {
            @include lsx-button-scaffolding();
            @include lsx-button-colour();
        }
    }
    .wpforms-submit-container {
        margin: 0;
    }
    .wpforms-container.inline-fields {
        .wpforms-submit {
            width: 99%;
        }
    }
}
.pum-container {
    border: 6px solid nth( $blue, 1 );
}