<div class="card">
  <div class="header">
    <div class="left">
      <span class="title">Likes</span>
      <span class="number">259</span>
    </div>
    <span class="like"
      ><svg
        viewBox="-1.35 0 1504.4 1504.4"
        id="Layer_1"
        xmlns="http://www.w3.org/2000/svg"
        fill="#000000"
      >
        <g id="SVGRepo_bgCarrier" stroke-width="0"></g>
        <g
          id="SVGRepo_tracerCarrier"
          stroke-linecap="round"
          stroke-linejoin="round"
        ></g>
        <g id="SVGRepo_iconCarrier">
          <title>Like</title>
          <ellipse
            class="st0"
            cx="750.8"
            cy="752.2"
            rx="750.8"
            ry="752.2"
          ></ellipse>
          <path
            class="st1"
            d="M378.3 667.5h165.1c13 0 23.6 10.5 23.6 23.6v379.1c0 13-10.5 23.6-23.6 23.6H378.3c-13 0-23.6-10.5-23.6-23.6V691c.1-13 10.6-23.5 23.6-23.5zM624.7 1004.7V733.1c.1-66.9 18.8-132.4 54.1-189.2 21.5-34.4 69.7-89.5 96.7-118 6-6.4 27.8-25.2 27.8-35.5 0-13.2 1.5-34.5 2-74.2.3-25.2 20.8-45.9 46-45.7h1.1c44.1.8 58.2 41.6 58.2 41.6s37.7 74.4 2.5 165.4c-29.7 76.9-35.8 83.1-35.8 83.1s-9.6 13.9 20.8 13.3c0 0 185.6-.8 192-.8 13.7 0 57.4 12.5 54.9 68.2-1.8 41.2-27.4 55.6-40.5 60.3-1.7.6-2.6 2.5-1.9 4.2.3.7.8 1.3 1.5 1.7 13.4 7.8 40.8 27.5 40.2 57.7-.8 36.6-15.5 50.1-46.1 58.5-1.7.4-2.8 2.2-2.3 3.9.2.9.8 1.6 1.5 2 11.6 6.6 31.5 22.7 30.3 55.3-1.2 33.2-25.2 44.9-38.3 48.9-1.7.5-2.7 2.3-2.2 4 .2.7.7 1.4 1.3 1.8 8.3 5.7 20.6 18.6 20 45.1-.3 14-5 24.2-10.9 31.5-9.3 11.5-23.9 17.5-38.7 17.6l-411.8.8c-.1-.1-22.4 0-22.4-29.9z"
          ></path>
        </g></svg
    ></span>
  </div>
  <div class="chart">
    <svg
      version="1.1"
      style="font-family: Roboto; font-size: 12px;"
      xmlns="http://www.w3.org/2000/svg"
      width="370"
      height="200"
      viewBox="0 0 370 200"
      aria-hidden="false"
      aria-label="Interactive chart"
    >
      <defs aria-hidden="true"><clipPath></clipPath></defs>
      <rect
        fill="none"
        x="44"
        y="10"
        width="316"
        height="175"
        aria-hidden="true"
      ></rect>
      <g data-z-index="0" aria-hidden="true"></g>
      <rect
        fill="none"
        data-z-index="1"
        x="44"
        y="10"
        width="316"
        height="175"
        aria-hidden="true"
      ></rect>
      <g data-z-index="1" aria-hidden="true">
        <path
          fill="none"
          stroke-dasharray="none"
          data-z-index="1"
          d="M 96.5 10 L 96.5 185"
          opacity="1"
        ></path>
        <path
          fill="none"
          stroke-dasharray="none"
          data-z-index="1"
          d="M 148.5 10 L 148.5 185"
          opacity="1"
        ></path>
        <path
          fill="none"
          stroke-dasharray="none"
          data-z-index="1"
          d="M 201.5 10 L 201.5 185"
          opacity="1"
        ></path>
        <path
          fill="none"
          stroke-dasharray="none"
          data-z-index="1"
          d="M 254.5 10 L 254.5 185"
          opacity="1"
        ></path>
        <path
          fill="none"
          stroke-dasharray="none"
          data-z-index="1"
          d="M 306.5 10 L 306.5 185"
          opacity="1"
        ></path>
        <path
          fill="none"
          stroke-dasharray="none"
          data-z-index="1"
          d="M 359.5 10 L 359.5 185"
          opacity="1"
        ></path>
        <path
          fill="none"
          stroke-dasharray="none"
          data-z-index="1"
          d="M 43.5 10 L 43.5 185"
          opacity="1"
        ></path>
      </g>
      <g data-z-index="1" aria-hidden="true">
        <path
          fill="none"
          stroke="#e6e6e6"
          stroke-width="1"
          stroke-dasharray="none"
          data-z-index="1"
          d="M 44 185.5 L 360 185.5"
          opacity="1"
        ></path>
        <path
          fill="none"
          stroke="#e6e6e6"
          stroke-width="1"
          stroke-dasharray="none"
          data-z-index="1"
          d="M 44 9.5 L 360 9.5"
          opacity="1"
        ></path>
        <path
          fill="none"
          stroke="#e6e6e6"
          stroke-width="1"
          stroke-dasharray="none"
          data-z-index="1"
          d="M 44 98.5 L 360 98.5"
          opacity="1"
        ></path>
      </g>
      <g data-z-index="2" aria-hidden="true">
        <path
          fill="none"
          stroke="#ccd6eb"
          stroke-width="1"
          data-z-index="7"
          d="M 44 185.5 L 360 185.5"
        ></path>
      </g>
      <g data-z-index="2" aria-hidden="true">
        <path fill="none" data-z-index="7" d="M 44 10 L 44 185"></path>
      </g>
      <g data-z-index="3" aria-hidden="false">
        <g
          data-z-index="0.1"
          opacity="1"
          transform="translate(44,10) scale(1 1)"
          clip-path="url(#highcharts-tsgnjcw-268-)"
          aria-hidden="true"
        >
          <path
            fill="rgba(111,88,233,0.35)"
            d="M 26.333333333333 119 C 26.333333333333 119 57.9333333333332 141.75 79 141.75 C 100.066666666664 141.75 110.599999999996 108.5 131.66666666666 108.5 C 152.73333333332798 108.5 163.26666666666202 119 184.33333333333 119 C 205.399999999998 119 215.93333333333197 15.75 237 15.75 C 258.066666666664 15.75 289.66666666666 92.75 289.66666666666 92.75 L 289.66666666666 175 C 289.66666666666 175 258.066666666664 175 237 175 C 215.93333333333197 175 205.399999999998 175 184.33333333333 175 C 163.26666666666202 175 152.73333333332798 175 131.66666666666 175 C 110.599999999996 175 100.066666666664 175 79 175 C 57.9333333333332 175 26.333333333333 175 26.333333333333 175 Z"
            data-z-index="0"
          ></path>
          <path
            fill="none"
            d="M 26.333333333333 119 C 26.333333333333 119 57.9333333333332 141.75 79 141.75 C 100.066666666664 141.75 110.599999999996 108.5 131.66666666666 108.5 C 152.73333333332798 108.5 163.26666666666202 119 184.33333333333 119 C 205.399999999998 119 215.93333333333197 15.75 237 15.75 C 258.066666666664 15.75 289.66666666666 92.75 289.66666666666 92.75"
            data-z-index="1"
            stroke="#6f58e9"
            stroke-width="2"
            stroke-linejoin="round"
            stroke-linecap="round"
          ></path>
          <path
            fill="none"
            d="M 26.333333333333 119 C 26.333333333333 119 57.9333333333332 141.75 79 141.75 C 100.066666666664 141.75 110.599999999996 108.5 131.66666666666 108.5 C 152.73333333332798 108.5 163.26666666666202 119 184.33333333333 119 C 205.399999999998 119 215.93333333333197 15.75 237 15.75 C 258.066666666664 15.75 289.66666666666 92.75 289.66666666666 92.75"
            data-z-index="2"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke="rgba(192,192,192,0.0001)"
            stroke-width="22"
            style="cursor: pointer;"
          ></path>
        </g>
        <g
          data-z-index="0.1"
          opacity="1"
          transform="translate(44,10) scale(1 1)"
          clip-path="none"
          style="cursor: pointer;"
          aria-hidden="false"
        >
          <path
            fill="#6f58e9"
            d="M 26 123 A 4 4 0 1 1 26.003999999333335 122.99999800000016 Z"
            opacity="1"
            tabindex="-1"
            role="img"
            aria-label="x, 0, 32 units. Item 1."
            style="outline: none;"
          ></path>
          <path
            fill="#6f58e9"
            d="M 79 145.75 A 4 4 0 1 1 79.00399999933333 145.74999800000018 Z"
            opacity="1"
            tabindex="-1"
            role="img"
            aria-label="x, 1, 19 units. Item 1."
            style="outline: none;"
          ></path>
          <path
            fill="#6f58e9"
            d="M 131 112.5 A 4 4 0 1 1 131.00399999933333 112.49999800000016 Z"
            opacity="1"
            tabindex="-1"
            role="img"
            aria-label="x, 2, 38 units. Item 1."
            style="outline: none;"
          ></path>
          <path
            fill="#6f58e9"
            d="M 184 123 A 4 4 0 1 1 184.00399999933333 122.99999800000016 Z"
            opacity="1"
            tabindex="-1"
            role="img"
            aria-label="x, 3, 32 units. Item 1."
            style="outline: none;"
          ></path>
          <path
            fill="#6f58e9"
            d="M 237 19.75 A 4 4 0 1 1 237.00399999933333 19.74999800000017 Z"
            opacity="1"
            tabindex="-1"
            role="img"
            aria-label="x, 4, 91 units. Item 1."
            style="outline: none;"
          ></path>
          <path
            fill="#6f58e9"
            d="M 289 96.75 A 4 4 0 1 1 289.00399999933336 96.74999800000016 Z"
            opacity="1"
            tabindex="-1"
            role="img"
            aria-label="x, 5, 47 units. Item 1."
            style="outline: none;"
          ></path>
        </g>
      </g>
      <g data-z-index="3" aria-hidden="true">
        <g
          stroke-linecap="round"
          style="cursor: pointer;"
          transform="translate(336,10)"
        >
          <title>Chart context menu</title>
          <text
            font-family="Roboto-Regular,Roboto"
            x="0"
            data-z-index="1"
            y="15.5"
            style="color: rgb(51, 51, 51); font-weight: normal; fill: rgb(51, 51, 51);"
          ></text>
        </g>
      </g>
      <text
        font-family="Roboto-Regular,Roboto"
        x="185"
        text-anchor="middle"
        data-z-index="4"
        style="color: rgb(51, 51, 51); font-size: 18px; fill: rgb(51, 51, 51);"
        y="24"
        aria-hidden="true"
      ></text>
      <text
        font-family="Roboto-Regular,Roboto"
        x="185"
        text-anchor="middle"
        data-z-index="4"
        style="color: rgb(102, 102, 102); fill: rgb(102, 102, 102);"
        y="24"
        aria-hidden="true"
      ></text>
      <text
        font-family="Roboto-Regular,Roboto"
        x="10"
        text-anchor="start"
        data-z-index="4"
        style="color: rgb(102, 102, 102); fill: rgb(102, 102, 102);"
        y="197"
        aria-hidden="true"
      ></text>
      <g data-z-index="7" aria-hidden="true">
        <text
          font-family="Roboto-Regular,Roboto"
          x="70.33333333333267"
          text-anchor="middle"
          transform="translate(0,0)"
          style="color: rgb(102, 102, 102); cursor: default; font-size: 11px; fill: rgb(102, 102, 102);"
          y="204"
          opacity="1"
        ></text>
        <text
          font-family="Roboto-Regular,Roboto"
          x="122.99999999999666"
          text-anchor="middle"
          transform="translate(0,0)"
          style="color: rgb(102, 102, 102); cursor: default; font-size: 11px; fill: rgb(102, 102, 102);"
          y="204"
          opacity="1"
        ></text>
        <text
          font-family="Roboto-Regular,Roboto"
          x="175.66666666666666"
          text-anchor="middle"
          transform="translate(0,0)"
          style="color: rgb(102, 102, 102); cursor: default; font-size: 11px; fill: rgb(102, 102, 102);"
          y="204"
          opacity="1"
        ></text>
        <text
          font-family="Roboto-Regular,Roboto"
          x="228.33333333332666"
          text-anchor="middle"
          transform="translate(0,0)"
          style="color: rgb(102, 102, 102); cursor: default; font-size: 11px; fill: rgb(102, 102, 102);"
          y="204"
          opacity="1"
        ></text>
        <text
          font-family="Roboto-Regular,Roboto"
          x="280.9999999999967"
          text-anchor="middle"
          transform="translate(0,0)"
          style="color: rgb(102, 102, 102); cursor: default; font-size: 11px; fill: rgb(102, 102, 102);"
          y="204"
          opacity="1"
        ></text>
        <text
          font-family="Roboto-Regular,Roboto"
          x="333.6666666666667"
          text-anchor="middle"
          transform="translate(0,0)"
          style="color: rgb(102, 102, 102); cursor: default; font-size: 11px; fill: rgb(102, 102, 102);"
          y="204"
          opacity="1"
        ></text>
      </g>
      <g data-z-index="7" aria-hidden="true">
        <text
          font-family="Roboto-Regular,Roboto"
          x="29"
          text-anchor="end"
          transform="translate(0,0)"
          style="color: rgb(102, 102, 102); cursor: default; font-size: 11px; fill: rgb(102, 102, 102);"
          y="190"
          opacity="1"
        >
          0
        </text>
        <text
          font-family="Roboto-Regular,Roboto"
          x="29"
          text-anchor="end"
          transform="translate(0,0)"
          style="color: rgb(102, 102, 102); cursor: default; font-size: 11px; fill: rgb(102, 102, 102);"
          y="15"
          opacity="1"
        >
          100
        </text>
        <text
          font-family="Roboto-Regular,Roboto"
          x="29"
          text-anchor="end"
          transform="translate(0,0)"
          style="color: rgb(102, 102, 102); cursor: default; font-size: 11px; fill: rgb(102, 102, 102);"
          y="102"
          opacity="1"
        >
          50
        </text>
      </g>
    </svg>
  </div>
</div>