Where is the CSS changed?

Resolved steve49589
(@steve49589)

9 years, 2 months ago

Can you let me know where the changes are stored? I would prefer to make the changes and place the CSS code into my Child Theme instead of hidden somewhere.

Great plugin, helped me to easily make the change that I wanted. But I really prefer to know exactly what was changed (the CSS code) and place it into style.css for my Child Theme.

Thank you.

Viewing 6 replies - 1 through 6 (of 6 total)

Plugin Author

wpmonks

(@wpmonks)

9 years, 2 months ago

You can view the CSS in the source code of page where you have added the form.

In your page source code search for /*Option to add custom CSS */ . All the CSS can be found above it.

This reply was modified 9 years, 2 months ago by wpmonks.

Thread Starter

steve49589

(@steve49589)

9 years, 2 months ago

Thank you. To confirm, I’m using Gravity Forms and by changing JUST the field color from black to something close to white, it added all of this CSS… Seems like a lot?

body #gform_wrapper_1 {
}

body #gform_wrapper_1 .gform_heading {
        border-width: 0px;}

body #gform_wrapper_1 .gform_heading .gform_title {
        }

body #gform_wrapper_1 .gform_heading .gform_description {
        display:block;
}

body #gform_wrapper_1 .gform_footer input[type=submit] {
        border-width: 0px;}

body #gform_wrapper_1 .gform_footer button.mdl-button {
        border-width: 0px;}

body #gform_wrapper_1 .gform_footer {
    }

body #gform_wrapper_1 .gform_body .gform_fields .gfield input[type=text],
body #gform_wrapper_1 .gform_body .gform_fields .gfield input[type=email],
body #gform_wrapper_1 .gform_body .gform_fields .gfield input[type=tel],
body #gform_wrapper_1 .gform_body .gform_fields .gfield input[type=url],
body #gform_wrapper_1 .gform_body .gform_fields .gfield input[type=password]
{
 background-color:#fcfcfc;       border-width: 1px;}

body #gform_wrapper_1 .gform_body .gform_fields .gfield textarea {
            border-width: 1px;    background:#fcfcfc;                        }

body #gform_wrapper_1 .gform_body .gform_fields .gfield select {

             border-width: 1px;}

body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_radio li input[type=radio] {
   }

body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_checkbox li input[type=checkbox] {
   }

body #gform_wrapper_1 .gfield_radio label {
   }

body #gform_wrapper_1 .gfield_checkbox label {
    }

body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_description {
  }

body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_label {
    }

body #gform_wrapper_1 .gform_body .gform_fields .gsection .gsection_title {
   }

body #gform_wrapper_1 .gform_body .gform_fields .gsection .gsection_description {
   }

body #gform_wrapper_1 .gform_body .gform_fields .gfield .ginput_container {
}

body #gforms_confirmation_message_1  {
              border-width: 1px;}

body #gform_wrapper_1 .validation_error {
              border-width: 1px;}

body #gform_wrapper_1 .gform_body .gform_fields .gfield_error .validation_message {
}

body #gform_wrapper_1 .gform_body .gform_page_footer .gform_next_button {
                                   }

body #gform_wrapper_1 .gform_body .gform_page_footer .gform_previous_button {

                                    }

body #gform_wrapper_1 .gform_body .gform_fields .gfield .ginput_complex .ginput_full label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .ginput_complex .ginput_right label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .ginput_complex .ginput_left label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .name_first label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .name_last label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .address_line_1 label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .address_line_2 label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .address_city label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .address_state label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .address_zip label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .address_country label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_time_hour label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_time_minute label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_date_month label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_date_day label,
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_date_year label
 {
    }

body #gform_wrapper_1 .gform_body .gform_fields .gfield .ginput_list {
    }

body #gform_wrapper_1 .gform_body .gform_fields .gfield .ginput_list table.gfield_list thead th{
}

body #gform_wrapper_1 .gform_body .gform_fields .gfield .ginput_list table.gfield_list tbody tr td.gfield_list_cell input {
    }
body #gform_wrapper_1 .gform_body .gform_fields .gfield .ginput_list table.gfield_list tbody tr td.gfield_list_cell  {
    }

/* Option to style placeholder */
body #gform_wrapper_1 ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  }
body #gform_wrapper_1 ::-moz-placeholder { /* Firefox 19+ */
  }
body #gform_wrapper_1 :-ms-input-placeholder { /* IE 10+ */
  }
body #gform_wrapper_1 :-moz-placeholder { /* Firefox 18- */
  }

Thread Starter

steve49589

(@steve49589)

9 years, 2 months ago

Also, are these changes written to the database, or to a CSS file somewhere? Also wondering if there is a way to return to the default and wipe-out the changes made to a specific element?

Thank you again.

This reply was modified 9 years, 2 months ago by steve49589.

Plugin Author

wpmonks

(@wpmonks)

9 years, 2 months ago

You only need the to copy those parts which have properties like

body #gform_wrapper_1 .gform_body .gform_fields .gfield textarea { border-width: 1px; background:#fcfcfc;}

The changes are stored in database and they will work as long as the plugin is active (you can deactivate the plugin and when to you reactive it the styling will start working again).

The styling will also stay if your theme gets updated or you change the theme.

You can delete the styling for the form by going to Customizer-> ‘Styles & Layouts Gravity Forms’ -> General Settings

If you want to change only a single property then you can easily alter it by navigating to the panel from where you modified it.

Thread Starter

steve49589

(@steve49589)

9 years, 2 months ago

Excellent and thank you. I was able to pull out the CSS and place into the style.css file of the child theme.

Also looking at some of your paid plugins for Gravity Forms. Nice and I might get them soon.

Cheers.

Thread Starter

steve49589