Skip to content

Instantly share code, notes, and snippets.

@reachkamrul
Last active May 8, 2023 11:16
Show Gist options
  • Save reachkamrul/ec0afbb15661450e37a4d9ca1438e998 to your computer and use it in GitHub Desktop.
Save reachkamrul/ec0afbb15661450e37a4d9ca1438e998 to your computer and use it in GitHub Desktop.
WP Fluent Forms Custom CSS
/* Change button style*/
form.fluent_form_149 .ff-btn-submit {
background-color: #000000; /* change button background color */
color: #ffffff; /*change button font color*/
border-radius: 10px; /*change button round corners*/
}
/*Change button hover style*/
form.fluent_form_149 .ff-btn-submit:hover {
background-color: #ff0606; /*change button background color on hover*/
color: #000000; /*change button font color on hover*/
}
/*input style*/
form.fluent_form_149 .ff-el-form-control{
padding: 6px 12px; /*change padding*/
font-size: 16px; /*change font size*/
line-height: 1.5; /*change line height*/
color: #495057; /*change font color*/
background-color: #fff; /*change background color*/
border: 1px solid #ced4da; /*change border width and color*/
border-radius: 10px; /*change corner round/ border radius*/
}
/*Change label styles*/
.ff-el-input--label{
font-size:22px; /*change label font size*/
color:red; /*change label color*/
}
/* Change Rating Star Color */
form.fluent_form_149 .ff-el-ratings label.active svg {
fill: red;
}
/*Change Step button styles*/
form.fluent_form_149 .step-nav button{
background-color: #000000; /* change step button background color */
color: #ffffff; /*change step button font color*/
border-radius: 10px; /*change step button round corners*/
}
/*Change Step button styles on hover*/
form.fluent_form_149 .step-nav button:hover{
background-color: #ff0606; /*change step button background color on hover*/
color: #000000; /*change step button font color on hover*/
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment