86 lines
2.7 KiB
Vue
86 lines
2.7 KiB
Vue
<template>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
viewBox="0 0 400 400">
|
|
<defs>
|
|
<clipPath id="avatar-clip-path">
|
|
<circle
|
|
class="cls-1"
|
|
cx="200"
|
|
cy="200"
|
|
r="197"/>
|
|
</clipPath>
|
|
</defs>
|
|
<g id="bg">
|
|
<circle
|
|
class="cls-2"
|
|
cx="200"
|
|
cy="200"
|
|
r="197"/>
|
|
</g>
|
|
<g id="objects">
|
|
<g class="cls-3">
|
|
<path
|
|
class="cls-4"
|
|
d="M380.03229,346.82485l-99.89952-29.68554-75.91247-7.58045h-2.40707l-78.31955,7.58045-103.526,30.44984s75.62737,95.55272,183.04906,95.55272S380.03229,346.82485,380.03229,346.82485Z"/>
|
|
<path
|
|
class="cls-5"
|
|
d="M272.15765,65.53589a86.01591,86.01591,0,0,0-20.524-14.33295,103.61294,103.61294,0,0,0-49.8204-11.92284,103.61271,103.61271,0,0,0-49.8198,11.92255A86.01706,86.01706,0,0,0,131.4688,65.53589c-47.89186,45.957-59.684,136.053-53.17653,195.51559,22.30221,28.20465,70.43168,35.98046,103.97675,29.59277-1.699-28.98109-18.28465-55.36789-18.09824-84.40807,16.82179-9.95623,9.42329-59.11938,10.702-81.59916l26.94039-6.97556,26.9404,6.97556c1.27875,22.47978-6.11974,71.64293,10.70211,81.59916.18642,29.04018-16.39928,55.427-18.09824,84.40807,33.545,6.38769,81.67447-1.38812,103.97668-29.59277C331.84167,201.58886,320.04951,111.49293,272.15765,65.53589Z"/>
|
|
<path
|
|
class="cls-6"
|
|
d="M237.057,266.23162H166.56944c0,34.9025-27.34,45.73431-43.07576,50.90769,15.73577,67.03868,142.10688,67.03868,156.63909,0C260.78642,311.96593,241.52987,305.94826,237.057,266.23162Z"/>
|
|
<ellipse
|
|
class="cls-7"
|
|
cx="202.35227"
|
|
cy="179.47219"
|
|
rx="79.23803"
|
|
ry="97.02616"/>
|
|
<path
|
|
class="cls-8"
|
|
d="M117.61519,154.166c10.8764-3.25836,22.30778,5.29762,25.51206,19.09451,3.20424,13.7965-3.02464,27.64251-13.90108,30.90087-10.87644,3.25678-22.30919-5.29877-25.51339-19.09389-3.20425-13.79708,3.026-27.64273,13.90241-30.90149Z"/>
|
|
<path
|
|
class="cls-5"
|
|
d="M158.77973,88.35379c34.35007,53.44875,83.71361,66.59188,126.44529,82.83956C322.20435,145.19484,244.7734,11.96688,158.77973,88.35379Z"/>
|
|
<path
|
|
class="cls-5"
|
|
d="M181.50651,94.88021c-10.83147,33.057-30.31262,48.8307-55.51284,58.59347C109.4863,115.38906,134.25941,72.625,181.50651,94.88021Z"/>
|
|
</g>
|
|
</g>
|
|
</svg>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.cls-1 {
|
|
fill: none;
|
|
}
|
|
|
|
.cls-2 {
|
|
fill: #d1eee7;
|
|
}
|
|
|
|
.cls-3 {
|
|
clip-path: url(#avatar-clip-path);
|
|
}
|
|
|
|
.cls-4 {
|
|
fill: #17a887;
|
|
}
|
|
|
|
.cls-4, .cls-5, .cls-6, .cls-8 {
|
|
fill-rule: evenodd;
|
|
}
|
|
|
|
.cls-5 {
|
|
fill: #102d24;
|
|
}
|
|
|
|
.cls-6 {
|
|
fill: #e5f5f2;
|
|
}
|
|
|
|
.cls-7, .cls-8 {
|
|
fill: #fff;
|
|
}
|
|
</style>
|