Button style

Hmm, I really think a theme should style all the buttons on a page.
Their CSS targets WooCommerce specifically, and also their own contact form.

I am not really planning to target a ‘.et_pb_button’ class in my plugin, just for this theme. Currently the plugin uses Bootstrap classes like ‘.btn’ and ‘btn-default’.
If they can tell what classes they support, then I could add it if it is a sensible class name.

I see they do support ‘.form-submit’ for the div around the input, but all that does is give it a ‘float:right;’, so that doesn’t help.

Ok thanks, I think it’s weird as well that Divi doesn’t support general button styles. I guess I’ll just have to stick with using custom CSS since their support unfortunately doesn’t seem to know much about Divi itself.

Hi Yohan,
Struggling with the same. Did you solve the issue with custom css and can you share it?

Hello,

To get the exact same style as the Divi buttons I had to use a workaround with filters, custom CSS and javascript code which isn’t ideal. But to get similar buttons you can use the following custom CSS and just change the colors:

#gwolle_gb input.btn.btn-default, input.btn.btn-primary {
font-size: 18px;
background: #68121b!important;
padding: 0.3em 1em;
border: 2px solid;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
font-size: 20px;
color: #fff;
cursor: pointer;
font-weight: 500;
line-height: 1.7em !important;
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
transition: all 0.2s;
}
#gwolle_gb_write_button .btn-default:hover{
padding: 0.3em 1.5em 0.3em 1em !important;
}
#gwolle_gb_write_button:after{
position: absolute;
top:10px;
margin-left: -1em;
opacity: 0;
font-size: 32px;
line-height: 1em;
content: "\35";
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
transition: all 0.2s;
font-family: "ETmodules" !important;
font-weight: normal;
font-style: normal;
font-variant: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
line-height: 1;
text-transform: none;
speak: none;
color:#fff;
margin-right: 2em !important;
}
#gwolle_gb_write_button:hover:after{
margin-left:-1em;
opacity: 1;
}

Thanks a lot Johan! Worked very well and did a few color and border edits.
Rob