Skip to content

Instantly share code, notes, and snippets.

Revisions

  1. cobbman revised this gist May 3, 2016. 1 changed file with 99 additions and 3 deletions.
    102 changes: 99 additions & 3 deletions _gravity-forms-bootstrap.scss
    Original file line number Diff line number Diff line change
    @@ -18,7 +18,7 @@
    .ginput_container input,
    .ginput_container select,
    .ginput_container textarea {
    @extend .form-control;
    @extend .form-control;
    background-color: white;
    }

    @@ -27,8 +27,8 @@
    }

    .gform_button {
    @extend .btn;
    @extend .btn-primary;
    @extend .btn;
    @extend .btn-primary;
    }

    .gform_wrapper .gfield_error {
    @@ -56,4 +56,100 @@
    .gform_confirmation_message {
    min-height: 200px;
    text-align: center;
    }

    // Hide the ajax spinner
    .gform_ajax_spinner {
    display: none;
    }

    // Hide honeypot
    .gform_validation_container {
    display: none;
    position: absolute;
    left: -9000px;
    }

    // Checkboxes
    .gfield_checkbox {
    input[type=checkbox] {
    width: 1em;
    height: .95em;
    display: inline;
    border: none;
    box-shadow: none;
    }
    }

    // Footer fix
    .gform_footer {
    clear: both;
    }

    // READY CLASSES & Media

    @media screen and ( min-width: @screen-xs-min ) {
    .gform_wrapper {

    // 2 columns
    .gf_left_half {
    margin: 0 0 8px 0;
    width: 49%;
    float: left;
    clear: left;
    }
    .gf_right_half {
    margin: 0 0 8px 0;
    width: 49%;
    float: right;
    clear: right;
    }

    // 3 columns
    .gf_left_third,
    .gf_middle_third,
    .gf_right_third {
    margin: 0 0 0.50em 0;
    width: 32%;
    }
    .gf_left_third {
    float: left;
    clear: left;
    }
    .gf_middle_third {
    float: left;
    clear: none;
    margin-left: 2%;
    }
    .gf_right_third {
    float: right;
    clear: right;
    }

    // for complex parts, such as addresses
    .ginput_left {
    width: 49%;
    float: left;
    clear: left;
    }
    .ginput_right {
    width: 49%;
    float: right;
    clear: right;
    }
    .gf_clear, .gf_clear_complex {
    clear: both;
    }

    // lists
    .gf_list_inline ul.gfield_checkbox li,
    .gf_list_inline ul.gfield_radio li {
    width: auto !important;
    float: none !important;
    margin: 0 0.625em 0.625em 0;
    display: -moz-inline-stack;
    display: inline-block;
    zoom: 1;
    }
    }
    }
  2. @craigpearson craigpearson created this gist Mar 21, 2016.
    59 changes: 59 additions & 0 deletions _gravity-forms-bootstrap.scss
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,59 @@
    .gform_wrapper ul {
    @extend .list-unstyled;
    }

    .gform_wrapper li {
    @extend .form-group;
    }

    .gform_wrapper form {
    margin-bottom: 0;
    }

    .gform_wrapper .gfield_required {
    padding-left: 1px;
    color: $state-danger-text;
    }

    .ginput_container input,
    .ginput_container select,
    .ginput_container textarea {
    @extend .form-control;
    background-color: white;
    }

    .ginput_container textarea {
    height: auto;
    }

    .gform_button {
    @extend .btn;
    @extend .btn-primary;
    }

    .gform_wrapper .gfield_error {
    .gfield_label {
    color: $state-danger-text;
    }
    input,
    select,
    textarea {
    border-color: $alert-danger-border;
    background-color: $alert-danger-bg;
    color: $alert-danger-text;
    @include form-control-focus($alert-danger-text);
    }
    }
    .validation_error {
    @extend .alert;
    @extend .alert-danger;
    }
    #gforms_confirmation_message {
    @extend .alert;
    @extend .alert-success;
    }

    .gform_confirmation_message {
    min-height: 200px;
    text-align: center;
    }