/* | |
* A CSS snippet for Ecwid to alter buy now buttons. | |
* The button CSS styles is from this list: http://hellohappy.org/css3-buttons/ ('Shiny blue') | |
*/ | |
/* This code prevents the button height issues and default IE fallbacks in Ecwid */ | |
button.ecwid-AccentedButton, | |
button.ecwid-AccentedButton:hover, | |
button.ecwid-AccentedButton:active { | |
height: auto; | |
filter: none; | |
background-image: none; | |
} | |
/* Button style in normal state. Pay attention to the class - it should be '.ecwid-AccentedButton' */ | |
button.ecwid-AccentedButton { | |
background-color: #759ae9; | |
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #759ae9), color-stop(50%, #376fe0), color-stop(50%, #1a5ad9), color-stop(100%, #2463de)); | |
background-image: -webkit-linear-gradient(top, #759ae9 0%, #376fe0 50%, #1a5ad9 50%, #2463de 100%); | |
background-image: -moz-linear-gradient(top, #759ae9 0%, #376fe0 50%, #1a5ad9 50%, #2463de 100%); | |
background-image: -ms-linear-gradient(top, #759ae9 0%, #376fe0 50%, #1a5ad9 50%, #2463de 100%); | |
background-image: -o-linear-gradient(top, #759ae9 0%, #376fe0 50%, #1a5ad9 50%, #2463de 100%); | |
background-image: linear-gradient(top, #759ae9 0%, #376fe0 50%, #1a5ad9 50%, #2463de 100%); | |
border-top: 1px solid #1f58cc; | |
border-right: 1px solid #1b4db3; | |
border-bottom: 1px solid #174299; | |
border-left: 1px solid #1b4db3; | |
border-radius: 4px; | |
-webkit-box-shadow: inset 0 0 2px 0 rgba(57, 140, 255, 0.8); | |
box-shadow: inset 0 0 2px 0 rgba(57, 140, 255, 0.8); | |
color: #fff; | |
font: bold 12px/1 "helvetica neue", helvetica, arial, sans-serif; | |
padding: 7px 0; | |
text-shadow: 0 -1px 1px #1a5ad9; | |
width: 150px; | |
} | |
/* Button style in hover state (when a visitor mouses over the button) */ | |
button.ecwid-AccentedButton:hover { | |
background-color: #5d89e8; | |
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5d89e8), color-stop(50%, #2261e0), color-stop(50%, #044bd9), color-stop(100%, #0d53de)); | |
background-image: -webkit-linear-gradient(top, #5d89e8 0%, #2261e0 50%, #044bd9 50%, #0d53de 100%); | |
background-image: -moz-linear-gradient(top, #5d89e8 0%, #2261e0 50%, #044bd9 50%, #0d53de 100%); | |
background-image: -ms-linear-gradient(top, #5d89e8 0%, #2261e0 50%, #044bd9 50%, #0d53de 100%); | |
background-image: -o-linear-gradient(top, #5d89e8 0%, #2261e0 50%, #044bd9 50%, #0d53de 100%); | |
background-image: linear-gradient(top, #5d89e8 0%, #2261e0 50%, #044bd9 50%, #0d53de 100%); | |
cursor: pointer; | |
} | |
/* Button style in active state (when a visitor presses the button) */ | |
button.ecwid-AccentedButton:active { | |
border-top: 1px solid #1b4db3; | |
border-right: 1px solid #174299; | |
border-bottom: 1px solid #133780; | |
border-left: 1px solid #174299; | |
-webkit-box-shadow: inset 0 0 5px 2px #1a47a0, 0 1px 0 #eeeeee; | |
box-shadow: inset 0 0 5px 2px #1a47a0, 0 1px 0 #eeeeee; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment