inspec/www/source/stylesheets/_buttons.scss
hannah-radish 23434f3606 Bug fixes for Inspec.io
- Added banner for webinars (present and future)
- CSS support for IE10, IE11, Edge
- Fixed URL bug for demo
- Fixed Edge browser resize bug
- Changes to relative path, update event info

Signed-off-by: Hannah Maddy <hmaddy@chef.io>
2017-03-03 12:25:33 -08:00

73 lines
1.4 KiB
SCSS

// Normal Links
a {
@extend %transition;
color: $color_link;
font-family: $main-font;
}
// All CTA's
.btn {
@extend %transition;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0.52rem 1.25rem;
color: $color_purple;
border: 1px solid transparent;
border-right: 1px solid $color_link;
border-left: 1px solid $color_purple;
border-radius: 4px;
background: transparent;
background-image: linear-gradient(
to right,
$color_purple 0,
$color_link 100%
),
linear-gradient(
to right,
$color_purple 0,
$color_link 100%
);
background-repeat : no-repeat;
background-position: 0 0, 0 100%;
background-size: 100% 1px;
&:hover {
color: $color_white;
border-color: $color_purple;
background-image: initial;
background-color: $color_purple;
}
&.btn-inverse {
color: $color_purple;
&:hover {
color: $color_white;
background-color: $color_purple;
}
}
//mobile
@media screen and (max-width: 40.063em) {
float: initial;
padding: 0.8rem 1.6rem;
margin: 0 auto;
text-align: center;
}
}
// Form Buttons
button {
@extend %transition;
padding: 0.6rem 1.25rem;
color: $color_white;
border: 2px $color-purple;
border-radius: 4px;
background: $color_purple;
&:hover {
opacity: 0.8;
}
}