armentieres: fix suggest block layout, make whole block clikable in mobile (#70745)

This commit is contained in:
Corentin Sechet 2022-11-21 22:00:41 +01:00
parent 6202594b08
commit 11f89ae38a
1 changed files with 67 additions and 0 deletions

View File

@ -373,6 +373,73 @@ div.wcscurrentformscell {
}
}
.arm-suggest {
&--content {
height: 80px;
padding: 0.5rem 0 0.5rem 1rem;
display: grid;
grid-template-columns: 1fr auto;
grid-auto-rows: auto;
align-items: center;
@media($max-mobile-viewport) {
justify-items: stretch;
align-items: center;
}
}
&--title {
margin: 0 !important;
grid-area: 1 / 1 / 2 / 2;
@media($max-mobile-viewport) {
grid-area: 1 / 1 / 3 / 3;
}
}
&--text {
margin: 0 !important;
grid-area: 2 / 1 / 3 / 2;
@media($max-mobile-viewport) {
display: none;
}
}
&--button {
@extend %black-button;
height: 40px;
margin: 0;
grid-area: 1 / 2 / 3 / 3;
@media($max-mobile-viewport) {
height: 100%;
display: flex;
justify-content: end;
grid-area: 1 / 1 / 3 / 3;
background: transparent !important;
color: transparent !important;
box-shadow: none !important;
}
&::after {
margin-left: 1rem;
font-family: FontAwesome;
font-size: $fz-small;
color: white;
content: "\f054";
@media($max-mobile-viewport) {
font-size: $fz-3;
}
}
}
}
@mixin arm-link-icon($name) {
& > li.arm-icon-#{$name} {
display: flex;