inspec/www/source/stylesheets/_buttons.scss

67 lines
1.4 KiB
SCSS
Raw Normal View History

// Normal Links
2017-01-07 04:53:01 +00:00
a {
@extend %transition;
color : $color_link;
font-family : $heading-font;
}
2016-09-19 22:06:36 +00:00
// All CTA's
2017-01-07 04:53:01 +00:00
.btn {
@extend %transition;
box-sizing : border-box;
padding : 0.6rem 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;
}
}
}
2017-01-07 04:53:01 +00:00
// Form Buttons
2017-01-07 04:53:01 +00:00
button {
@extend %transition;
padding : 0.6rem 1.25rem;
color : $color_white;
border : 2px $color-purple;
border-radius : 4px;
background : $color_purple;
2017-01-07 04:53:01 +00:00
}
button:hover {
opacity : 0.8;
2017-01-07 04:53:01 +00:00
}