WP Residence Help WP Residence Help

  • WPRESIDENCE
  • Video Tutorials
  • Client Support
  • API
Home / Technical how to | Custom Code Required / New Buttons Design – How to change hover effect

New Buttons Design – How to change hover effect

4037 views 0

This is the css for default button and hover color to apply and edit.

.comment-form #submit, 
.wpresidence_button {
text-shadow: none;
margin-bottom: 15px;
border-radius: 0;
text-transform: capitalize;
padding: 8px 34px;
border: 1px solid;
line-height: 2;
border-color: #2470af;
color: #fff;
background-color: #2470af!important;
background-image: -webkit-gradient(linear,left top,right top,color-stop(50%,transparent),color-stop(50%,#2470af));
background-image: linear-gradient(to right,transparent 500%,#2470af 50%);
background-size: 200% 100%;
background-position: right bottom;
display: inline-block;
font-size: 15px;
font-weight: 700;
text-decoration: none;
}

.comment-form #submit:hover, 
.wpresidence_button:hover {
text-decoration: none;
background-color: #f1bf7f!important;
background-position: left bottom;
color: #fff;
border-color: #f1bf7f!important;
transition: all 300ms ease;
webkit-transition: all 300ms ease;
-o-transition: all 300ms ease;
cursor: pointer;
}

​

Please copy in custom css or child theme (where you make custom changes) and replace the color codes

OR try this css

.comment-form #submit:hover, .shortcode_contact_form.sh_form_align_center #btn-cont-submit_sh:hover, .single-content input[type="submit"]:hover, .agent_contanct_form input[type="submit"]:hover, #agent_submit:hover, .wpresidence_button:hover {
    border-color: #195045!important;
    background-color: #c7c3c3!important;
    color: white;
    border:1px solid #c7c3c3!important;
}
Technical how to | Custom Code Required

Related Articles

  • Technical: Change the Schedule Tour Email Text and the Form Default Message
  • Property list filter customization
  • Technical – How to Change the Minimum Image Dimensions for Property Uploads in WPResidence
  • Introduction to WPResidence Header Customization

Help Categories

  • 18Agent, Agency & Developers
  • 5Blog Posts & Blog Lists
  • 39Elementor Shortcodes Built-In
  • 46FAQ
  • 15Footer
  • 5Getting Started
  • 37Header
  • 2IDX & MLSImport
  • 6Installation & Setup
  • 24Installation FAQ
  • 23Maps & Location Settings
  • 21Multi-Language - Third Party Plugins
  • 6Other Third party Plugins
  • 21Pages
  • 4Payments & Monetization
  • 20Property Lists, Categories & Archive
  • 37Property Pages & Layouts
  • 31Search & Filtering
  • 162Technical how to | Custom Code Required
  • 8Technical: Actions and filters
  • 7Technical: Child Theme
  • 86Theme Options & Global Settings
  • 7Translations & Languages
  • 16WPBakery Shortcodes
  • 50WPEstate / WPResidence Translate Plugin
  • 51WPResidence / WPEstate CRM
  • 50WPResidence 5.0 Documentation
  • 9WPResidence Elementor Studio

Join Us On

Powered by WP Estate - All Rights Reserved
  • WPRESIDENCE
  • Video Tutorials
  • Client Support
  • API