Is this code still necessary to change the color of the survey button in GoHighLevel software?

By | July 19, 2023


Do we still need this code to turn the survey button a different color?

@charset “UTF-8”;
#_builder-form > div.ghl-footer {
background: #ffffff;
position: relative;
bottom: 0;
top: auto;
left: 0;
right: 0;
width: 100%;
margin: 0 auto;
padding: 5px 0;
height: 50px;
-webkit-box-shadow: none !important;
box-shadow: none !important;
z-index: 0;
overflow: none;
text-align: center;
display: block;
border-radius: 0 0 6px 6px !important;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#_builder-form > div.ghl-footer > div.ghl-button-bar > div > button {
background-color: #2E9CD8!important;
}
.hl-app .ghl-button-bar .ghl-next-button .right-pointing-triangle::after {
content: “Next” !important;
font-family: “Spartan”, sans-serif !important;
font-size: 20px !important;
font-weight: 600 !important;
letter-spacing: 0 !important;
}
.hl-app .ghl-button-bar {
display: block !important;
margin: 100 auto !important;
position: relative !important;
z-index: 2;
direction: rtl;
text-align: center !important;
width: 100% !important;
}
.hl-app .ghl-footer .ghl-btn-align {
float: none !important;
right: inherit !important;
position: relative !important;
top: 0 !important;
width: 100% !important;
}
.hl-app .ghl-button-bar .ghl-next-button {
float: none !important;
height: auto !important;
width: auto !important;
min-width: 100% !important;
margin: 0 auto !important;
text-align: center !important;
border: 0 !important;
border-radius: 50 !important;
padding: 0 5px !important;
font-weight: 600 !important;
font-family: ‘Roboto', sans-serif;
position: absolute !important;
right: 10px !important;
top: 5px !important;
}
#_builder-form > div.ghl-footer > div.ghl-progress-bar {
position: relative !important;
bottom: 0 !important;
width: 85% !important;
height: 20px !important;
zoom: 1 !important;
-moz-zoom: 2 !important;
line-height: 20px !important;
clear: both !important;
-webkit-box-pack: center !important;
-ms-flex-pack: center !important;
justify-content: center !important;
-webkit-box-align: center !important;
-ms-flex-align: center !important;
align-items: center !important;
top: 75px !important;
left: 0% !important;
display: -webkit-box !important;
display: -ms-flexbox !important;
display: flex !important;
-ms-flex-wrap: nowrap !important;
flex-wrap: nowrap !important;
-webkit-box-orient: horizontal !important;
-webkit-box-direction: normal !important;
-ms-flex-direction: row !important;
flex-direction: row !important;
margin: 0 auto !important;
}
#_builder-form > div.ghl-footer > div.ghl-progress-bar > div.ghl-progress-bar-text {
color: #fff;
background-color: #2E9CD8!important;
font-size: 14px !important;
width: 150px !important;
text-align: center !important;
border-radius: 20px 0 0 20px !important;
float: left !important;
height: 30px !important;
display: -webkit-box !important;
display: -ms-flexbox !important;
display: flex !important;
-ms-flex-wrap: nowrap !important;
flex-wrap: nowrap !important;
-webkit-box-pack: center !important;
-ms-flex-pack: center !important;
justify-content: center !important;
-webkit-box-align: center !important;
-ms-flex-align: center !important;
align-items: center !important;
-webkit-box-orient: horizontal !important;
-webkit-box-direction: normal !important;
-ms-flex-direction: row !important;
flex-direction: row !important;
}
#_builder-form > div.ghl-footer > div.ghl-progress-bar > div.ghl-progress-bar-background {
width: 95% !important;
background-color: #d6dee8 !important;
border-left: 1px solid #fff !important;
float: left !important;
border-radius: 0 20px 20px 0 !important;
display: -webkit-box !important;
display: -ms-flexbox !important;
display: flex !important;
-ms-flex-wrap: nowrap !important;
flex-wrap: nowrap !important;
-webkit-box-pack: left !important;
-ms-flex-pack: left !important;
justify-content: left !important;
-webkit-box-align: center !important;
-ms-flex-align: center !important;
align-items: center !important;
height: 30px !important;
padding: 0 !important;
margin: 0 auto !important;
-webkit-box-orient: horizontal !important;
-webkit-box-direction: normal !important;
-ms-flex-direction: row !important;
flex-direction: row !important;
}
#_builder-form > div.ghl-footer > div.ghl-progress-bar > div.ghl-progress-bar-background > div {
background-color: #2E9CD8!important;
height: 100% !important;
border-radius: 0 10px 10px 0 !important;
}
#nextButton {
color: #fff !important;
background-color: #2E9CD8!important;
font-size: 15px !important;
font-family: ‘Roboto', sans-serif;
}
.hl-app .ghl-question-set.ghl-ques-wrap-big .custom-vue-select.form-control,
.hl-app .ghl-question-set.ghl-ques-wrap-big input[type=”email”],
.hl-app .ghl-question-set.ghl-ques-wrap-big input[type=”number”],
.hl-app .ghl-question-set.ghl-ques-wrap-big input[type=”phone”],
.hl-app .ghl-question-set.ghl-ques-wrap-big input[type=”text”],
.hl-app .ghl-question-set.ghl-ques-wrap-big textarea {
width: 100% !important;
}
.hl-app .ghl-button-bar .ghl-back-button {
float: none !important;
height: auto !important;
width: auto !important;
min-width: auto !important;
margin: 0 auto !important;
text-align: center !important;
border: 0 !important;
border-radius: 0 !important;
padding: 0 10px !important;
font-weight: 600 !important;
font-family: ‘Roboto', sans-serif;
position: absolute !important;
left: 0 !important;
top: 5px !important;
}
@media only screen and (max-width: 650px) {
#_builder-form > div.ghl-footer {
height: 50px !important;
}
}
/*# sourceMappingURL=style.css.map */
.hl-app .ghl-button-bar .ghl-next-button,
#nextButton {
color: #fff !important;
background-color: #2E9CD8!important;
font-size: 20px !important;
font-family: ‘Roboto', sans-serif !important;
min-height: 40px !important;
padding: 0.5rem !important;
font-weight: 600 !important;
font-family: ‘Roboto', sans-serif !important;
}


The original post is asking if a particular code is still necessary to change the color of the survey button in GoHighLevel CRM software. The code provided includes CSS properties that modify the appearance of various elements in the software's form footer and button bar.

Based on the code provided, it seems that the intention is to change the background color of the survey button to “#2E9CD8”. Additionally, the code specifies the font style, size, and weight for the button label.

From the code, it appears that the survey button is located within the GoHighLevel form footer and button bar elements. The code also includes properties to adjust the positioning and styling of these elements.

Overall, the code provided suggests that it is still necessary to use this code to change the color of the survey button in GoHighLevel CRM software.

To get more information and updates on this topic, I would recommend checking the comments below this article and visiting the source link for additional responses and updates from the GoHighLevel community.


Source