Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Round Corner Transparent Button Style - BB Theme
/** Default State styling **/
button,
input[type=button],
input[type=submit] {
background: transparent; /* Background color for button */
color: #428bca; /* text color */
font-size: 14px;
line-height: 20px;
padding: 6px 12px;
font-weight: normal;
text-shadow: none;
border: 3px solid #2d6ca2; /* broder weight, style and color */
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
border-radius: 50px;
}
/** Hover state styling **/
button:hover,
input[type=button]:hover,
input[type=submit]:hover {
background: #2d6ca2;
color: #ffffff;
border: 3px solid #2d6ca2;
text-decoration: none;
}
/** Adding some transition **/
button,
input[type=button],
input[type=submit],
button:hover,
input[type=button]:hover,
input[type=submit]:hover {
transition: all ease-in 0.2s;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment