25 lines
No EOL
687 B
CSS
25 lines
No EOL
687 B
CSS
.emoji {
|
|
font-size: 2.5rem;
|
|
}
|
|
textarea {
|
|
width: 300px;
|
|
max-width: 90%;
|
|
}
|
|
.heart {
|
|
height: 250px; /* adjust to control the size */
|
|
aspect-ratio: 1;
|
|
--_m: radial-gradient(#000 69%,#0000 70%) 84.5%/50%;
|
|
-webkit-mask-box-image: var(--_m);
|
|
mask-border: var(--_m);
|
|
clip-path: polygon(-41% 0,50% 91%, 141% 0);
|
|
background: #fb6f92;
|
|
}
|
|
/* fallback until better support for mask-border */
|
|
@supports not (-webkit-mask-box-image: var(--_m)) {
|
|
.heart {
|
|
mask:
|
|
radial-gradient(at 70% 31%,#000 29%,#0000 30%),
|
|
radial-gradient(at 30% 31%,#000 29%,#0000 30%),
|
|
conic-gradient(#000 0 0) bottom/100% 50% no-repeat;
|
|
}
|
|
} |