core/src/scss/utilities/placeholders/components/_cta.scss
/// CTA base styling.
///
/// @name %cta-base
///
%cta-base {
position: relative;
display: flex;
flex-direction: column;
overflow: hidden;
line-height: 0;
text-decoration: none;
.su-cta__img {
width: 100%;
min-height: 1px; //IE fix
z-index: 0;
transition: transform 0.3s ease-out;
}
.su-cta__button {
@include button-big;
@include margin(null null 0);
@include grid-media('xs') {
width: 100%;
z-index: 100;
}
font-weight: $su-font-regular;
}
.su-cta__icon {
display: none;
}
&:hover {
.su-cta__img {
transform: scale(1.02, 1.02);
}
.su-cta__button {
background-color: color(bg--reverse);
text-decoration: none;
}
}
}