18 lines
1.0 KiB
SCSS
18 lines
1.0 KiB
SCSS
|
|
$bubbleshape: '<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 757.18 757.18"><path d="M755.59,378.59c0-1.81,0-3.62,0-5.43,0-14.52-.25-29-.85-43.23-3.4-94.25-19.29-182.2-84.5-243-60.77-65.09-148.54-81-242.62-84.44-14.4-.61-29-.86-43.62-.86H373.16c-14.65,0-29.21.25-43.61.86C235.47,5.87,147.69,21.79,86.92,86.88,21.71,147.73,5.83,235.68,2.42,329.93c-.59,14.28-.84,28.71-.84,43.23,0,1.81,0,3.62,0,5.43s0,3.61,0,5.42c0,14.53.25,29,.84,43.23,3.41,94.25,19.29,182.21,84.5,243.06,60.77,65.08,148.55,81,242.63,84.44,14.4.6,29,.86,43.61.86H384c14.66,0,29.22-.26,43.62-.86,94.08-3.44,181.85-19.36,242.62-84.44,65.21-60.85,81.1-148.81,84.5-243.06.6-14.27.85-28.7.85-43.23C755.6,382.2,755.59,380.4,755.59,378.59Z"/></svg>';
|
|
|
|
.bg-bubble {
|
|
mask-image: url("data:image/svg+xml;charset=utf-8,#{$bubbleshape}");
|
|
}
|
|
|
|
.icon-bubble {
|
|
display: flex;
|
|
text-align: center;
|
|
|
|
img {
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin: auto;
|
|
width: 65%;
|
|
}
|
|
} |