Skip to content

Instantly share code, notes, and snippets.

@wpsoul

wpsoul/gist:e72f45fbcfca06bd8169

Created January 30, 2016 18:09
Show Gist options
  • Save wpsoul/e72f45fbcfca06bd8169 to your computer and use it in GitHub Desktop.
Save wpsoul/e72f45fbcfca06bd8169 to your computer and use it in GitHub Desktop.
Download ZIP
old buttons
Raw
gistfile1.txt
.wpsm-button.black { background: #505050; background: -moz-linear-gradient(top, #505050 0%, #101010 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #505050), color-stop(100%, #101010)); background: -webkit-linear-gradient(top, #505050 0%, #101010 100%); background: -o-linear-gradient(top, #505050 0%, #101010 100%); background: -ms-linear-gradient(top, #505050 0%, #101010 100%); background: linear-gradient(to bottom, #505050 0%, #101010 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#505050', endColorstr='#101010', GradientType=0 );
border: 1px solid #101010; }
.wpsm-button.black:active { background: #101010; background: -moz-linear-gradient(top, #101010 0%, #505050 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #101010), color-stop(100%, #505050)); background: -webkit-linear-gradient(top, #101010 0%, #505050 100%); background: -o-linear-gradient(top, #101010 0%, #505050 100%); background: -ms-linear-gradient(top, #101010 0%, #505050 100%); background: linear-gradient(to bottom, #101010 0%, #505050 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#101010', endColorstr='#505050', GradientType=0 );
}
.wpsm-button.black span.wpsm-button-inner { border-top: 1px solid #6e6e6e; }
.wpsm-button.red { background: #d01d10; background: -moz-linear-gradient(top, #f36d64 0%, #d01d10 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f36d64), color-stop(100%, #d01d10)); background: -webkit-linear-gradient(top, #f36d64 0%, #d01d10 100%); background: -o-linear-gradient(top, #f36d64 0%, #d01d10 100%); background: -ms-linear-gradient(top, #f36d64 0%, #d01d10 100%); background: linear-gradient(to bottom, #f36d64 0%, #d01d10 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f36d64', endColorstr='#d01d10', GradientType=0 );
border: 1px solid #d01d10; }
.wpsm-button.red span.wpsm-button-inner { border-top: 1px solid #f69a93; }
.wpsm-button.red:active { background: #d01d10; background: -moz-linear-gradient(top, #d01d10 0%, #f36d64 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #d01d10), color-stop(100%, #f36d64)); background: -webkit-linear-gradient(top, #d01d10 0%, #f36d64 100%); background: -o-linear-gradient(top, #d01d10 0%, #f36d64 100%); background: -ms-linear-gradient(top, #d01d10 0%, #f36d64 100%); background: linear-gradient(to bottom, #d01d10 0%, #f36d64 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d01d10', endColorstr='#f36d64', GradientType=0 );
}
.wpsm-button.orange { background: #fa9e19; background: -moz-linear-gradient(top, #fa9e19 0%, #fb6909 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fa9e19), color-stop(100%, #fb6909)); background: -webkit-linear-gradient(top, #fa9e19 0%, #fb6909 100%); background: -o-linear-gradient(top, #fa9e19 0%, #fb6909 100%); background: -ms-linear-gradient(top, #fa9e19 0%, #fb6909 100%); background: linear-gradient(to bottom, #fa9e19 0%, #fb6909 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fa9e19', endColorstr='#fb6909', GradientType=0 );
border: 1px solid #FB6909; }
.wpsm-button.orange span.wpsm-button-inner { border-top: 1px solid #fcc87d; }
.wpsm-button.orange:active { background: #fb6909; background: -moz-linear-gradient(top, #fb6909 0%, #fa9e19 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fb6909), color-stop(100%, #fa9e19)); background: -webkit-linear-gradient(top, #fb6909 0%, #fa9e19 100%); background: -o-linear-gradient(top, #fb6909 0%, #fa9e19 100%); background: -ms-linear-gradient(top, #fb6909 0%, #fa9e19 100%); background: linear-gradient(to bottom, #fb6909 0%, #fa9e19 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fb6909', endColorstr='#fa9e19', GradientType=0 );
}
.wpsm-button.blue { background: #1571f0; background: -moz-linear-gradient(top, #41a7fc 0%, #1571f0 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #41a7fc), color-stop(100%, #1571f0)); background: -webkit-linear-gradient(top, #41a7fc 0%, #1571f0 100%); background: -o-linear-gradient(top, #41a7fc 0%, #1571f0 100%); background: -ms-linear-gradient(top, #41a7fc 0%, #1571f0 100%); background: linear-gradient(to bottom, #41a7fc 0%, #1571f0 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#41a7fc', endColorstr='#1571f0', GradientType=0 );
border: 1px solid #1a6dd7; }
.wpsm-button.blue span.wpsm-button-inner { border-top: 1px solid #84c6fd; }
.wpsm-button.blue:active { background: #1571f0; background: -moz-linear-gradient(top, #1571f0 0%, #41a7fc 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1571f0), color-stop(100%, #41a7fc)); background: -webkit-linear-gradient(top, #1571f0 0%, #41a7fc 100%); background: -o-linear-gradient(top, #1571f0 0%, #41a7fc 100%); background: -ms-linear-gradient(top, #1571f0 0%, #41a7fc 100%); background: linear-gradient(to bottom, #1571f0 0%, #41a7fc 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1571f0', endColorstr='#41a7fc', GradientType=0 );
}
.wpsm-button.rosy { background: #f295a2; background: -moz-linear-gradient(top, #ee7787 0%, #e84a5f 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ee7787), color-stop(100%, #e84a5f)); background: -webkit-linear-gradient(top, #ee7787 0%, #e84a5f 100%); background: -o-linear-gradient(top, #ee7787 0%, #e84a5f 100%); background: -ms-linear-gradient(top, #ee7787 0%, #e84a5f 100%); background: linear-gradient(to bottom, #ee7787 0%, #e84a5f 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ee7787', endColorstr='#e84a5f', GradientType=0 );
border: 1px solid #e84a5f; }
.wpsm-button.rosy:active { background: #e84a5f; background: -moz-linear-gradient(top, #e84a5f 0%, #ee7787 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e84a5f), color-stop(100%, #ee7787)); background: -webkit-linear-gradient(top, #e84a5f 0%, #ee7787 100%); background: -o-linear-gradient(top, #e84a5f 0%, #ee7787 100%); background: -ms-linear-gradient(top, #e84a5f 0%, #ee7787 100%); background: linear-gradient(to bottom, #e84a5f 0%, #ee7787 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e84a5f', endColorstr='#ee7787', GradientType=0 );
}
.wpsm-button.rosy span.wpsm-button-inner { border-top: 1px solid #f3a4af; }
.wpsm-button.pink { background: #e3618d; background: -moz-linear-gradient(top, #e3618d 0%, #cb245c 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e3618d), color-stop(100%, #cb245c)); background: -webkit-linear-gradient(top, #e3618d 0%, #cb245c 100%); background: -o-linear-gradient(top, #e3618d 0%, #cb245c 100%); background: -ms-linear-gradient(top, #e3618d 0%, #cb245c 100%); background: linear-gradient(to bottom, #e3618d 0%, #cb245c 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e3618d', endColorstr='#cb245c', GradientType=0 );
border: 1px solid #cb245c; }
.wpsm-button.pink:active { background: #cb245c; background: -moz-linear-gradient(top, #cb245c 0%, #e3618d 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cb245c), color-stop(100%, #e3618d)); background: -webkit-linear-gradient(top, #cb245c 0%, #e3618d 100%); background: -o-linear-gradient(top, #cb245c 0%, #e3618d 100%); background: -ms-linear-gradient(top, #cb245c 0%, #e3618d 100%); background: linear-gradient(to bottom, #cb245c 0%, #e3618d 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cb245c', endColorstr='#e3618d', GradientType=0 );
}
.wpsm-button.pink span.wpsm-button-inner { border-top: 1px solid #eb8cac; }
.wpsm-button.green { color: #fff; background: #88dd48; background: -moz-linear-gradient(top, #88dd48 0%, #5fb139 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #88dd48), color-stop(100%, #5fb139)); background: -webkit-linear-gradient(top, #88dd48 0%, #5fb139 100%); background: -o-linear-gradient(top, #88dd48 0%, #5fb139 100%); background: -ms-linear-gradient(top, #88dd48 0%, #5fb139 100%); background: linear-gradient(to bottom, #88dd48 0%, #5fb139 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#88dd48', endColorstr='#5fb139', GradientType=0 );
border-color: #60AE40; }
.wpsm-button.green span.wpsm-button-inner { border-top: 1px solid #b7ea90; }
.wpsm-button.green:active { background: #5fb139; background: -moz-linear-gradient(top, #5fb139 0%, #88dd48 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5fb139), color-stop(100%, #88dd48)); background: -webkit-linear-gradient(top, #5fb139 0%, #88dd48 100%); background: -o-linear-gradient(top, #5fb139 0%, #88dd48 100%); background: -ms-linear-gradient(top, #5fb139 0%, #88dd48 100%); background: linear-gradient(to bottom, #5fb139 0%, #88dd48 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5fb139', endColorstr='#88dd48', GradientType=0 );
}
.wpsm-button.brown { background: #876565; background: -moz-linear-gradient(top, #876565 0%, #604848 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #876565), color-stop(100%, #604848)); background: -webkit-linear-gradient(top, #876565 0%, #604848 100%); background: -o-linear-gradient(top, #876565 0%, #604848 100%); background: -ms-linear-gradient(top, #876565 0%, #604848 100%); background: linear-gradient(to bottom, #876565 0%, #604848 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#876565', endColorstr='#604848', GradientType=0 );
border: 1px solid #604848; }
.wpsm-button.brown:active { background: #604848; background: -moz-linear-gradient(top, #604848 0%, #876565 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #604848), color-stop(100%, #876565)); background: -webkit-linear-gradient(top, #604848 0%, #876565 100%); background: -o-linear-gradient(top, #604848 0%, #876565 100%); background: -ms-linear-gradient(top, #604848 0%, #876565 100%); background: linear-gradient(to bottom, #604848 0%, #876565 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#604848', endColorstr='#876565', GradientType=0 );
}
.wpsm-button.brown span.wpsm-button-inner { border-top: 1px solid #ae9393; }
.wpsm-button.purple { background: #524656; background: -moz-linear-gradient(top, #aa66c7 0%, #763392 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #aa66c7), color-stop(100%, #763392)); background: -webkit-linear-gradient(top, #aa66c7 0%, #763392 100%); background: -o-linear-gradient(top, #aa66c7 0%, #763392 100%); background: -ms-linear-gradient(top, #aa66c7 0%, #763392 100%); background: linear-gradient(to bottom, #aa66c7 0%, #763392 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aa66c7', endColorstr='#763392', GradientType=0 );
border: 1px solid #372f3a; }
.wpsm-button.purple:active { background: #372f3a; background: -moz-linear-gradient(top, #763392 0%, #aa66c7 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #763392), color-stop(100%, #aa66c7)); background: -webkit-linear-gradient(top, #763392 0%, #aa66c7 100%); background: -o-linear-gradient(top, #763392 0%, #aa66c7 100%); background: -ms-linear-gradient(top, #763392 0%, #aa66c7 100%); background: linear-gradient(to bottom, #763392 0%, #aa66c7 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#763392', endColorstr='#aa66c7', GradientType=0 );
}
.wpsm-button.purple span.wpsm-button-inner { border-top: 1px solid #7e6c85; }
.wpsm-button.gold { background: #ffc750; background: -moz-linear-gradient(top, #ffc750 0%, #faaa00 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffc750), color-stop(100%, #faaa00)); background: -webkit-linear-gradient(top, #ffc750 0%, #faaa00 100%); background: -o-linear-gradient(top, #ffc750 0%, #faaa00 100%); background: -ms-linear-gradient(top, #ffc750 0%, #faaa00 100%); background: linear-gradient(to bottom, #ffc750 0%, #faaa00 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc750', endColorstr='#faaa00', GradientType=0 );
border: 1px solid #faaa00; }
.wpsm-button.gold:active { background: #faaa00; background: -moz-linear-gradient(top, #faaa00 0%, #ffc750 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #faaa00), color-stop(100%, #ffc750)); background: -webkit-linear-gradient(top, #faaa00 0%, #ffc750 100%); background: -o-linear-gradient(top, #faaa00 0%, #ffc750 100%); background: -ms-linear-gradient(top, #faaa00 0%, #ffc750 100%); background: linear-gradient(to bottom, #faaa00 0%, #ffc750 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#faaa00', endColorstr='#ffc750', GradientType=0 );
}
.wpsm-button.gold span.wpsm-button-inner { color: #844D1E; text-shadow: 1px 1px 1px #ffe2a5; border-top: 1px solid #ffd783; }
.wpsm-button.teal { background: #3c9091; background: -moz-linear-gradient(top, #3c9091 0%, #286061 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3c9091), color-stop(100%, #286061)); background: -webkit-linear-gradient(top, #3c9091 0%, #286061 100%); background: -o-linear-gradient(top, #3c9091 0%, #286061 100%); background: -ms-linear-gradient(top, #3c9091 0%, #286061 100%); background: linear-gradient(to bottom, #3c9091 0%, #286061 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3c9091', endColorstr='#286061', GradientType=0 );
border: 1px solid #286061; }
.wpsm-button.teal:active { background: #286061; background: -moz-linear-gradient(top, #286061 0%, #3c9091 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #286061), color-stop(100%, #3c9091)); background: -webkit-linear-gradient(top, #286061 0%, #3c9091 100%); background: -o-linear-gradient(top, #286061 0%, #3c9091 100%); background: -ms-linear-gradient(top, #286061 0%, #3c9091 100%); background: linear-gradient(to bottom, #286061 0%, #3c9091 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#286061', endColorstr='#3c9091', GradientType=0 );
}
.wpsm-button.teal span.wpsm-button-inner { border-top: 1px solid #63bdbf; }
.wpsm-button.navy { background: #2c76cf; background: -moz-linear-gradient(top, #2c76cf 0%, #1d4e89 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2c76cf), color-stop(100%, #1d4e89)); background: -webkit-linear-gradient(top, #2c76cf 0%, #1d4e89 100%); background: -o-linear-gradient(top, #2c76cf 0%, #1d4e89 100%); background: -ms-linear-gradient(top, #2c76cf 0%, #1d4e89 100%); background: linear-gradient(to bottom, #2c76cf 0%, #1d4e89 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c76cf', endColorstr='#1d4e89', GradientType=0 );
border: 1px solid #1d4e89; }
.wpsm-button.navy:active { background: #1d4e89; background: -moz-linear-gradient(top, #1d4e89 0%, #2c76cf 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1d4e89), color-stop(100%, #2c76cf)); background: -webkit-linear-gradient(top, #1d4e89 0%, #2c76cf 100%); background: -o-linear-gradient(top, #1d4e89 0%, #2c76cf 100%); background: -ms-linear-gradient(top, #1d4e89 0%, #2c76cf 100%); background: linear-gradient(to bottom, #1d4e89 0%, #2c76cf 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1d4e89', endColorstr='#2c76cf', GradientType=0 );
}
.wpsm-button.navy span.wpsm-button-inner { border-top: 1px solid #619ade; }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment