Skip to content

Instantly share code, notes, and snippets.

@sorXCode
Created January 23, 2021 04:49
Show Gist options
  • Save sorXCode/0aa24555c4c9fd05882cb6d0961ce140 to your computer and use it in GitHub Desktop.
Save sorXCode/0aa24555c4c9fd05882cb6d0961ce140 to your computer and use it in GitHub Desktop.
Activity Graph SVG
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title> Activity Graph </title>
<style>
.wday,
.calendar-graph text.month {
font-size: 12px;
fill: #767676;
margin-left: 12px;
}
.js-yearly-contributions h2 {
color: #586069;
font-size: 0.85rem;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
text-align: center;
}
.js-yearly-contributions {
background-color: #fff;
border-radius: 3px;
padding: 0.5em 1em 1em;
max-width: 790px;
margin: 0 auto;
}
.js-calendar-graph-svg {
display: block;
margin: 0 auto;
width: 790px;
height: 100%;
/*margin-left: -20px;*/
}
</style>
</head>
<body>
<div class="container">
<main>
<div class="js-yearly-contributions">
<div>
<h2>
Activity Graph
</h2>
<div>
<div>
<svg width="828" height="128" class="js-calendar-graph-svg">
<g transform="translate(10, 20)">
<g transform="translate(0, 0)">
<rect class="day" width="12" height="12" x="16" y="0" fill="#d1d3c9" data-count="0" data-date="2020-01-13"/>
<rect class="day" width="12" height="12" x="16" y="15" fill="#d1d3c9" data-count="0" data-date="2020-01-14"/>
<rect class="day" width="12" height="12" x="16" y="30" fill="#d1d3c9" data-count="0" data-date="2020-01-15"/>
<rect class="day" width="12" height="12" x="16" y="45" fill="#d1d3c9" data-count="0" data-date="2020-01-16"/>
<rect class="day" width="12" height="12" x="16" y="60" fill="#d1d3c9" data-count="0" data-date="2020-01-17"/>
<rect class="day" width="12" height="12" x="16" y="75" fill="#d1d3c9" data-count="0" data-date="2020-01-18"/>
<rect class="day" width="12" height="12" x="16" y="90" fill="#d1d3c9" data-count="0" data-date="2020-01-19"/>
</g>
<g transform="translate(16, 0)">
<rect class="day" width="12" height="12" x="15" y="0" fill="#d1d3c9" data-count="0" data-date="2020-01-20"/>
<rect class="day" width="12" height="12" x="15" y="15" fill="#d1d3c9" data-count="0" data-date="2020-01-21"/>
<rect class="day" width="12" height="12" x="15" y="30" fill="#d1d3c9" data-count="0" data-date="2020-01-22"/>
<rect class="day" width="12" height="12" x="15" y="45" fill="#d1d3c9" data-count="0" data-date="2020-01-23"/>
<rect class="day" width="12" height="12" x="15" y="60" fill="#d1d3c9" data-count="0" data-date="2020-01-24"/>
<rect class="day" width="12" height="12" x="15" y="75" fill="#d1d3c9" data-count="0" data-date="2020-01-25"/>
<rect class="day" width="12" height="12" x="15" y="90" fill="#d1d3c9" data-count="0" data-date="2020-01-26"/>
</g>
<g transform="translate(32, 0)">
<rect class="day" width="12" height="12" x="14" y="0" fill="#d1d3c9" data-count="0" data-date="2020-01-27"/>
<rect class="day" width="12" height="12" x="14" y="15" fill="#d1d3c9" data-count="0" data-date="2020-01-28"/>
<rect class="day" width="12" height="12" x="14" y="30" fill="#d1d3c9" data-count="0" data-date="2020-01-29"/>
<rect class="day" width="12" height="12" x="14" y="45" fill="#d1d3c9" data-count="0" data-date="2020-01-30"/>
<rect class="day" width="12" height="12" x="14" y="60" fill="#d1d3c9" data-count="0" data-date="2020-01-31"/>
<rect class="day" width="12" height="12" x="14" y="75" fill="#d1d3c9" data-count="0" data-date="2020-02-01"/>
<rect class="day" width="12" height="12" x="14" y="90" fill="#d1d3c9" data-count="0" data-date="2020-02-02"/>
</g>
<g transform="translate(48, 0)">
<rect class="day" width="12" height="12" x="13" y="0" fill="#d1d3c9" data-count="0" data-date="2020-02-03"/>
<rect class="day" width="12" height="12" x="13" y="15" fill="#d1d3c9" data-count="0" data-date="2020-02-04"/>
<rect class="day" width="12" height="12" x="13" y="30" fill="#d1d3c9" data-count="0" data-date="2020-02-05"/>
<rect class="day" width="12" height="12" x="13" y="45" fill="#d1d3c9" data-count="0" data-date="2020-02-06"/>
<rect class="day" width="12" height="12" x="13" y="60" fill="#d1d3c9" data-count="0" data-date="2020-02-07"/>
<rect class="day" width="12" height="12" x="13" y="75" fill="#d1d3c9" data-count="0" data-date="2020-02-08"/>
<rect class="day" width="12" height="12" x="13" y="90" fill="#d1d3c9" data-count="0" data-date="2020-02-09"/>
</g>
<g transform="translate(64, 0)">
<rect class="day" width="12" height="12" x="12" y="0" fill="#d1d3c9" data-count="0" data-date="2020-02-10"/>
<rect class="day" width="12" height="12" x="12" y="15" fill="#d1d3c9" data-count="0" data-date="2020-02-11"/>
<rect class="day" width="12" height="12" x="12" y="30" fill="#c6e48b" data-count="1" data-date="2020-02-12"/>
<rect class="day" width="12" height="12" x="12" y="45" fill="#d1d3c9" data-count="0" data-date="2020-02-13"/>
<rect class="day" width="12" height="12" x="12" y="60" fill="#d1d3c9" data-count="0" data-date="2020-02-14"/>
<rect class="day" width="12" height="12" x="12" y="75" fill="#d1d3c9" data-count="0" data-date="2020-02-15"/>
<rect class="day" width="12" height="12" x="12" y="90" fill="#d1d3c9" data-count="0" data-date="2020-02-16"/>
</g>
<g transform="translate(80, 0)">
<rect class="day" width="12" height="12" x="11" y="0" fill="#d1d3c9" data-count="0" data-date="2020-02-17"/>
<rect class="day" width="12" height="12" x="11" y="15" fill="#d1d3c9" data-count="0" data-date="2020-02-18"/>
<rect class="day" width="12" height="12" x="11" y="30" fill="#d1d3c9" data-count="0" data-date="2020-02-19"/>
<rect class="day" width="12" height="12" x="11" y="45" fill="#d1d3c9" data-count="0" data-date="2020-02-20"/>
<rect class="day" width="12" height="12" x="11" y="60" fill="#d1d3c9" data-count="0" data-date="2020-02-21"/>
<rect class="day" width="12" height="12" x="11" y="75" fill="#d1d3c9" data-count="0" data-date="2020-02-22"/>
<rect class="day" width="12" height="12" x="11" y="90" fill="#d1d3c9" data-count="0" data-date="2020-02-23"/>
</g>
<g transform="translate(96, 0)">
<rect class="day" width="12" height="12" x="10" y="0" fill="#d1d3c9" data-count="0" data-date="2020-02-24"/>
<rect class="day" width="12" height="12" x="10" y="15" fill="#d1d3c9" data-count="0" data-date="2020-02-25"/>
<rect class="day" width="12" height="12" x="10" y="30" fill="#d1d3c9" data-count="0" data-date="2020-02-26"/>
<rect class="day" width="12" height="12" x="10" y="45" fill="#d1d3c9" data-count="0" data-date="2020-02-27"/>
<rect class="day" width="12" height="12" x="10" y="60" fill="#d1d3c9" data-count="0" data-date="2020-02-28"/>
<rect class="day" width="12" height="12" x="10" y="75" fill="#d1d3c9" data-count="0" data-date="2020-03-01"/>
<rect class="day" width="12" height="12" x="10" y="90" fill="#d1d3c9" data-count="0" data-date="2020-03-02"/>
</g>
<g transform="translate(112, 0)">
<rect class="day" width="12" height="12" x="9" y="0" fill="#d1d3c9" data-count="0" data-date="2020-03-03"/>
<rect class="day" width="12" height="12" x="9" y="15" fill="#d1d3c9" data-count="0" data-date="2020-03-04"/>
<rect class="day" width="12" height="12" x="9" y="30" fill="#d1d3c9" data-count="0" data-date="2020-03-05"/>
<rect class="day" width="12" height="12" x="9" y="45" fill="#d1d3c9" data-count="0" data-date="2020-03-06"/>
<rect class="day" width="12" height="12" x="9" y="60" fill="#d1d3c9" data-count="0" data-date="2020-03-07"/>
<rect class="day" width="12" height="12" x="9" y="75" fill="#d1d3c9" data-count="0" data-date="2020-03-08"/>
<rect class="day" width="12" height="12" x="9" y="90" fill="#d1d3c9" data-count="0" data-date="2020-03-09"/>
</g>
<g transform="translate(128, 0)">
<rect class="day" width="12" height="12" x="8" y="0" fill="#d1d3c9" data-count="0" data-date="2020-03-10"/>
<rect class="day" width="12" height="12" x="8" y="15" fill="#d1d3c9" data-count="0" data-date="2020-03-11"/>
<rect class="day" width="12" height="12" x="8" y="30" fill="#d1d3c9" data-count="0" data-date="2020-03-12"/>
<rect class="day" width="12" height="12" x="8" y="45" fill="#d1d3c9" data-count="0" data-date="2020-03-13"/>
<rect class="day" width="12" height="12" x="8" y="60" fill="#d1d3c9" data-count="0" data-date="2020-03-14"/>
<rect class="day" width="12" height="12" x="8" y="75" fill="#d1d3c9" data-count="0" data-date="2020-03-15"/>
<rect class="day" width="12" height="12" x="8" y="90" fill="#d1d3c9" data-count="0" data-date="2020-03-16"/>
</g>
<g transform="translate(144, 0)">
<rect class="day" width="12" height="12" x="7" y="0" fill="#d1d3c9" data-count="0" data-date="2020-03-17"/>
<rect class="day" width="12" height="12" x="7" y="15" fill="#d1d3c9" data-count="0" data-date="2020-03-18"/>
<rect class="day" width="12" height="12" x="7" y="30" fill="#d1d3c9" data-count="0" data-date="2020-03-19"/>
<rect class="day" width="12" height="12" x="7" y="45" fill="#d1d3c9" data-count="0" data-date="2020-03-20"/>
<rect class="day" width="12" height="12" x="7" y="60" fill="#d1d3c9" data-count="0" data-date="2020-03-21"/>
<rect class="day" width="12" height="12" x="7" y="75" fill="#d1d3c9" data-count="0" data-date="2020-03-22"/>
<rect class="day" width="12" height="12" x="7" y="90" fill="#d1d3c9" data-count="0" data-date="2020-03-23"/>
</g>
<g transform="translate(160, 0)">
<rect class="day" width="12" height="12" x="6" y="0" fill="#d1d3c9" data-count="0" data-date="2020-03-24"/>
<rect class="day" width="12" height="12" x="6" y="15" fill="#d1d3c9" data-count="0" data-date="2020-03-25"/>
<rect class="day" width="12" height="12" x="6" y="30" fill="#d1d3c9" data-count="0" data-date="2020-03-26"/>
<rect class="day" width="12" height="12" x="6" y="45" fill="#d1d3c9" data-count="0" data-date="2020-03-27"/>
<rect class="day" width="12" height="12" x="6" y="60" fill="#d1d3c9" data-count="0" data-date="2020-03-28"/>
<rect class="day" width="12" height="12" x="6" y="75" fill="#d1d3c9" data-count="0" data-date="2020-03-29"/>
<rect class="day" width="12" height="12" x="6" y="90" fill="#d1d3c9" data-count="0" data-date="2020-03-30"/>
</g>
<g transform="translate(176, 0)">
<rect class="day" width="12" height="12" x="5" y="0" fill="#d1d3c9" data-count="0" data-date="2020-03-31"/>
<rect class="day" width="12" height="12" x="5" y="15" fill="#d1d3c9" data-count="0" data-date="2020-04-01"/>
<rect class="day" width="12" height="12" x="5" y="30" fill="#d1d3c9" data-count="0" data-date="2020-04-02"/>
<rect class="day" width="12" height="12" x="5" y="45" fill="#d1d3c9" data-count="0" data-date="2020-04-03"/>
<rect class="day" width="12" height="12" x="5" y="60" fill="#d1d3c9" data-count="0" data-date="2020-04-04"/>
<rect class="day" width="12" height="12" x="5" y="75" fill="#d1d3c9" data-count="0" data-date="2020-04-05"/>
<rect class="day" width="12" height="12" x="5" y="90" fill="#d1d3c9" data-count="0" data-date="2020-04-06"/>
</g>
<g transform="translate(192, 0)">
<rect class="day" width="12" height="12" x="4" y="0" fill="#d1d3c9" data-count="0" data-date="2020-04-07"/>
<rect class="day" width="12" height="12" x="4" y="15" fill="#d1d3c9" data-count="0" data-date="2020-04-08"/>
<rect class="day" width="12" height="12" x="4" y="30" fill="#d1d3c9" data-count="0" data-date="2020-04-09"/>
<rect class="day" width="12" height="12" x="4" y="45" fill="#d1d3c9" data-count="0" data-date="2020-04-10"/>
<rect class="day" width="12" height="12" x="4" y="60" fill="#d1d3c9" data-count="0" data-date="2020-04-11"/>
<rect class="day" width="12" height="12" x="4" y="75" fill="#d1d3c9" data-count="0" data-date="2020-04-12"/>
<rect class="day" width="12" height="12" x="4" y="90" fill="#d1d3c9" data-count="0" data-date="2020-04-13"/>
</g>
<g transform="translate(208, 0)">
<rect class="day" width="12" height="12" x="3" y="0" fill="#d1d3c9" data-count="0" data-date="2020-04-14"/>
<rect class="day" width="12" height="12" x="3" y="15" fill="#d1d3c9" data-count="0" data-date="2020-04-15"/>
<rect class="day" width="12" height="12" x="3" y="30" fill="#d1d3c9" data-count="0" data-date="2020-04-16"/>
<rect class="day" width="12" height="12" x="3" y="45" fill="#d1d3c9" data-count="0" data-date="2020-04-17"/>
<rect class="day" width="12" height="12" x="3" y="60" fill="#d1d3c9" data-count="0" data-date="2020-04-18"/>
<rect class="day" width="12" height="12" x="3" y="75" fill="#d1d3c9" data-count="0" data-date="2020-04-19"/>
<rect class="day" width="12" height="12" x="3" y="90" fill="#d1d3c9" data-count="0" data-date="2020-04-20"/>
</g>
<g transform="translate(224, 0)">
<rect class="day" width="12" height="12" x="2" y="0" fill="#d1d3c9" data-count="0" data-date="2020-04-21"/>
<rect class="day" width="12" height="12" x="2" y="15" fill="#d1d3c9" data-count="0" data-date="2020-04-22"/>
<rect class="day" width="12" height="12" x="2" y="30" fill="#d1d3c9" data-count="0" data-date="2020-04-23"/>
<rect class="day" width="12" height="12" x="2" y="45" fill="#d1d3c9" data-count="0" data-date="2020-04-24"/>
<rect class="day" width="12" height="12" x="2" y="60" fill="#d1d3c9" data-count="0" data-date="2020-04-25"/>
<rect class="day" width="12" height="12" x="2" y="75" fill="#d1d3c9" data-count="0" data-date="2020-04-26"/>
<rect class="day" width="12" height="12" x="2" y="90" fill="#d1d3c9" data-count="0" data-date="2020-04-27"/>
</g>
<g transform="translate(240, 0)">
<rect class="day" width="12" height="12" x="1" y="0" fill="#d1d3c9" data-count="0" data-date="2020-04-28"/>
<rect class="day" width="12" height="12" x="1" y="15" fill="#d1d3c9" data-count="0" data-date="2020-04-29"/>
<rect class="day" width="12" height="12" x="1" y="30" fill="#d1d3c9" data-count="0" data-date="2020-04-30"/>
<rect class="day" width="12" height="12" x="1" y="45" fill="#d1d3c9" data-count="0" data-date="2020-05-01"/>
<rect class="day" width="12" height="12" x="1" y="60" fill="#d1d3c9" data-count="0" data-date="2020-05-02"/>
<rect class="day" width="12" height="12" x="1" y="75" fill="#d1d3c9" data-count="0" data-date="2020-05-03"/>
<rect class="day" width="12" height="12" x="1" y="90" fill="#d1d3c9" data-count="0" data-date="2020-05-04"/>
</g>
<g transform="translate(256, 0)">
<rect class="day" width="12" height="12" x="0" y="0" fill="#d1d3c9" data-count="0" data-date="2020-05-05"/>
<rect class="day" width="12" height="12" x="0" y="15" fill="#d1d3c9" data-count="0" data-date="2020-05-06"/>
<rect class="day" width="12" height="12" x="0" y="30" fill="#d1d3c9" data-count="0" data-date="2020-05-07"/>
<rect class="day" width="12" height="12" x="0" y="45" fill="#d1d3c9" data-count="0" data-date="2020-05-08"/>
<rect class="day" width="12" height="12" x="0" y="60" fill="#d1d3c9" data-count="0" data-date="2020-05-09"/>
<rect class="day" width="12" height="12" x="0" y="75" fill="#d1d3c9" data-count="0" data-date="2020-05-10"/>
<rect class="day" width="12" height="12" x="0" y="90" fill="#d1d3c9" data-count="0" data-date="2020-05-11"/>
</g>
<g transform="translate(272, 0)">
<rect class="day" width="12" height="12" x="-1" y="0" fill="#d1d3c9" data-count="0" data-date="2020-05-12"/>
<rect class="day" width="12" height="12" x="-1" y="15" fill="#d1d3c9" data-count="0" data-date="2020-05-13"/>
<rect class="day" width="12" height="12" x="-1" y="30" fill="#d1d3c9" data-count="0" data-date="2020-05-14"/>
<rect class="day" width="12" height="12" x="-1" y="45" fill="#d1d3c9" data-count="0" data-date="2020-05-15"/>
<rect class="day" width="12" height="12" x="-1" y="60" fill="#d1d3c9" data-count="0" data-date="2020-05-16"/>
<rect class="day" width="12" height="12" x="-1" y="75" fill="#d1d3c9" data-count="0" data-date="2020-05-17"/>
<rect class="day" width="12" height="12" x="-1" y="90" fill="#d1d3c9" data-count="0" data-date="2020-05-18"/>
</g>
<g transform="translate(288, 0)">
<rect class="day" width="12" height="12" x="-2" y="0" fill="#d1d3c9" data-count="0" data-date="2020-05-19"/>
<rect class="day" width="12" height="12" x="-2" y="15" fill="#d1d3c9" data-count="0" data-date="2020-05-20"/>
<rect class="day" width="12" height="12" x="-2" y="30" fill="#d1d3c9" data-count="0" data-date="2020-05-21"/>
<rect class="day" width="12" height="12" x="-2" y="45" fill="#d1d3c9" data-count="0" data-date="2020-05-22"/>
<rect class="day" width="12" height="12" x="-2" y="60" fill="#d1d3c9" data-count="0" data-date="2020-05-23"/>
<rect class="day" width="12" height="12" x="-2" y="75" fill="#d1d3c9" data-count="0" data-date="2020-05-24"/>
<rect class="day" width="12" height="12" x="-2" y="90" fill="#d1d3c9" data-count="0" data-date="2020-05-25"/>
</g>
<g transform="translate(304, 0)">
<rect class="day" width="12" height="12" x="-3" y="0" fill="#d1d3c9" data-count="0" data-date="2020-05-26"/>
<rect class="day" width="12" height="12" x="-3" y="15" fill="#d1d3c9" data-count="0" data-date="2020-05-27"/>
<rect class="day" width="12" height="12" x="-3" y="30" fill="#d1d3c9" data-count="0" data-date="2020-05-28"/>
<rect class="day" width="12" height="12" x="-3" y="45" fill="#d1d3c9" data-count="0" data-date="2020-05-29"/>
<rect class="day" width="12" height="12" x="-3" y="60" fill="#d1d3c9" data-count="0" data-date="2020-05-30"/>
<rect class="day" width="12" height="12" x="-3" y="75" fill="#d1d3c9" data-count="0" data-date="2020-05-31"/>
<rect class="day" width="12" height="12" x="-3" y="90" fill="#d1d3c9" data-count="0" data-date="2020-06-01"/>
</g>
<g transform="translate(320, 0)">
<rect class="day" width="12" height="12" x="-4" y="0" fill="#d1d3c9" data-count="0" data-date="2020-06-02"/>
<rect class="day" width="12" height="12" x="-4" y="15" fill="#d1d3c9" data-count="0" data-date="2020-06-03"/>
<rect class="day" width="12" height="12" x="-4" y="30" fill="#d1d3c9" data-count="0" data-date="2020-06-04"/>
<rect class="day" width="12" height="12" x="-4" y="45" fill="#d1d3c9" data-count="0" data-date="2020-06-05"/>
<rect class="day" width="12" height="12" x="-4" y="60" fill="#d1d3c9" data-count="0" data-date="2020-06-06"/>
<rect class="day" width="12" height="12" x="-4" y="75" fill="#d1d3c9" data-count="0" data-date="2020-06-07"/>
<rect class="day" width="12" height="12" x="-4" y="90" fill="#d1d3c9" data-count="0" data-date="2020-06-08"/>
</g>
<g transform="translate(336, 0)">
<rect class="day" width="12" height="12" x="-5" y="0" fill="#d1d3c9" data-count="0" data-date="2020-06-09"/>
<rect class="day" width="12" height="12" x="-5" y="15" fill="#d1d3c9" data-count="0" data-date="2020-06-10"/>
<rect class="day" width="12" height="12" x="-5" y="30" fill="#d1d3c9" data-count="0" data-date="2020-06-11"/>
<rect class="day" width="12" height="12" x="-5" y="45" fill="#d1d3c9" data-count="0" data-date="2020-06-12"/>
<rect class="day" width="12" height="12" x="-5" y="60" fill="#d1d3c9" data-count="0" data-date="2020-06-13"/>
<rect class="day" width="12" height="12" x="-5" y="75" fill="#d1d3c9" data-count="0" data-date="2020-06-14"/>
<rect class="day" width="12" height="12" x="-5" y="90" fill="#d1d3c9" data-count="0" data-date="2020-06-15"/>
</g>
<g transform="translate(352, 0)">
<rect class="day" width="12" height="12" x="-6" y="0" fill="#d1d3c9" data-count="0" data-date="2020-06-16"/>
<rect class="day" width="12" height="12" x="-6" y="15" fill="#d1d3c9" data-count="0" data-date="2020-06-17"/>
<rect class="day" width="12" height="12" x="-6" y="30" fill="#d1d3c9" data-count="0" data-date="2020-06-18"/>
<rect class="day" width="12" height="12" x="-6" y="45" fill="#d1d3c9" data-count="0" data-date="2020-06-19"/>
<rect class="day" width="12" height="12" x="-6" y="60" fill="#d1d3c9" data-count="0" data-date="2020-06-20"/>
<rect class="day" width="12" height="12" x="-6" y="75" fill="#d1d3c9" data-count="0" data-date="2020-06-21"/>
<rect class="day" width="12" height="12" x="-6" y="90" fill="#d1d3c9" data-count="0" data-date="2020-06-22"/>
</g>
<g transform="translate(368, 0)">
<rect class="day" width="12" height="12" x="-7" y="0" fill="#d1d3c9" data-count="0" data-date="2020-06-23"/>
<rect class="day" width="12" height="12" x="-7" y="15" fill="#d1d3c9" data-count="0" data-date="2020-06-24"/>
<rect class="day" width="12" height="12" x="-7" y="30" fill="#d1d3c9" data-count="0" data-date="2020-06-25"/>
<rect class="day" width="12" height="12" x="-7" y="45" fill="#d1d3c9" data-count="0" data-date="2020-06-26"/>
<rect class="day" width="12" height="12" x="-7" y="60" fill="#d1d3c9" data-count="0" data-date="2020-06-27"/>
<rect class="day" width="12" height="12" x="-7" y="75" fill="#d1d3c9" data-count="0" data-date="2020-06-28"/>
<rect class="day" width="12" height="12" x="-7" y="90" fill="#d1d3c9" data-count="0" data-date="2020-06-29"/>
</g>
<g transform="translate(384, 0)">
<rect class="day" width="12" height="12" x="-8" y="0" fill="#d1d3c9" data-count="0" data-date="2020-06-30"/>
<rect class="day" width="12" height="12" x="-8" y="15" fill="#d1d3c9" data-count="0" data-date="2020-07-01"/>
<rect class="day" width="12" height="12" x="-8" y="30" fill="#d1d3c9" data-count="0" data-date="2020-07-02"/>
<rect class="day" width="12" height="12" x="-8" y="45" fill="#d1d3c9" data-count="0" data-date="2020-07-03"/>
<rect class="day" width="12" height="12" x="-8" y="60" fill="#d1d3c9" data-count="0" data-date="2020-07-04"/>
<rect class="day" width="12" height="12" x="-8" y="75" fill="#d1d3c9" data-count="0" data-date="2020-07-05"/>
<rect class="day" width="12" height="12" x="-8" y="90" fill="#d1d3c9" data-count="0" data-date="2020-07-06"/>
</g>
<g transform="translate(400, 0)">
<rect class="day" width="12" height="12" x="-9" y="0" fill="#d1d3c9" data-count="0" data-date="2020-07-07"/>
<rect class="day" width="12" height="12" x="-9" y="15" fill="#d1d3c9" data-count="0" data-date="2020-07-08"/>
<rect class="day" width="12" height="12" x="-9" y="30" fill="#d1d3c9" data-count="0" data-date="2020-07-09"/>
<rect class="day" width="12" height="12" x="-9" y="45" fill="#d1d3c9" data-count="0" data-date="2020-07-10"/>
<rect class="day" width="12" height="12" x="-9" y="60" fill="#d1d3c9" data-count="0" data-date="2020-07-11"/>
<rect class="day" width="12" height="12" x="-9" y="75" fill="#d1d3c9" data-count="0" data-date="2020-07-12"/>
<rect class="day" width="12" height="12" x="-9" y="90" fill="#d1d3c9" data-count="0" data-date="2020-07-13"/>
</g>
<g transform="translate(416, 0)">
<rect class="day" width="12" height="12" x="-10" y="0" fill="#d1d3c9" data-count="0" data-date="2020-07-14"/>
<rect class="day" width="12" height="12" x="-10" y="15" fill="#d1d3c9" data-count="0" data-date="2020-07-15"/>
<rect class="day" width="12" height="12" x="-10" y="30" fill="#d1d3c9" data-count="0" data-date="2020-07-16"/>
<rect class="day" width="12" height="12" x="-10" y="45" fill="#d1d3c9" data-count="0" data-date="2020-07-17"/>
<rect class="day" width="12" height="12" x="-10" y="60" fill="#d1d3c9" data-count="0" data-date="2020-07-18"/>
<rect class="day" width="12" height="12" x="-10" y="75" fill="#d1d3c9" data-count="0" data-date="2020-07-19"/>
<rect class="day" width="12" height="12" x="-10" y="90" fill="#d1d3c9" data-count="0" data-date="2020-07-20"/>
</g>
<g transform="translate(432, 0)">
<rect class="day" width="12" height="12" x="-11" y="0" fill="#d1d3c9" data-count="0" data-date="2020-07-21"/>
<rect class="day" width="12" height="12" x="-11" y="15" fill="#d1d3c9" data-count="0" data-date="2020-07-22"/>
<rect class="day" width="12" height="12" x="-11" y="30" fill="#d1d3c9" data-count="0" data-date="2020-07-23"/>
<rect class="day" width="12" height="12" x="-11" y="45" fill="#d1d3c9" data-count="0" data-date="2020-07-24"/>
<rect class="day" width="12" height="12" x="-11" y="60" fill="#d1d3c9" data-count="0" data-date="2020-07-25"/>
<rect class="day" width="12" height="12" x="-11" y="75" fill="#d1d3c9" data-count="0" data-date="2020-07-26"/>
<rect class="day" width="12" height="12" x="-11" y="90" fill="#d1d3c9" data-count="0" data-date="2020-07-27"/>
</g>
<g transform="translate(448, 0)">
<rect class="day" width="12" height="12" x="-12" y="0" fill="#d1d3c9" data-count="0" data-date="2020-07-28"/>
<rect class="day" width="12" height="12" x="-12" y="15" fill="#d1d3c9" data-count="0" data-date="2020-07-29"/>
<rect class="day" width="12" height="12" x="-12" y="30" fill="#d1d3c9" data-count="0" data-date="2020-07-30"/>
<rect class="day" width="12" height="12" x="-12" y="45" fill="#d1d3c9" data-count="0" data-date="2020-07-31"/>
<rect class="day" width="12" height="12" x="-12" y="60" fill="#d1d3c9" data-count="0" data-date="2020-08-01"/>
<rect class="day" width="12" height="12" x="-12" y="75" fill="#d1d3c9" data-count="0" data-date="2020-08-02"/>
<rect class="day" width="12" height="12" x="-12" y="90" fill="#d1d3c9" data-count="0" data-date="2020-08-03"/>
</g>
<g transform="translate(464, 0)">
<rect class="day" width="12" height="12" x="-13" y="0" fill="#d1d3c9" data-count="0" data-date="2020-08-04"/>
<rect class="day" width="12" height="12" x="-13" y="15" fill="#d1d3c9" data-count="0" data-date="2020-08-05"/>
<rect class="day" width="12" height="12" x="-13" y="30" fill="#d1d3c9" data-count="0" data-date="2020-08-06"/>
<rect class="day" width="12" height="12" x="-13" y="45" fill="#d1d3c9" data-count="0" data-date="2020-08-07"/>
<rect class="day" width="12" height="12" x="-13" y="60" fill="#d1d3c9" data-count="0" data-date="2020-08-08"/>
<rect class="day" width="12" height="12" x="-13" y="75" fill="#d1d3c9" data-count="0" data-date="2020-08-09"/>
<rect class="day" width="12" height="12" x="-13" y="90" fill="#d1d3c9" data-count="0" data-date="2020-08-10"/>
</g>
<g transform="translate(480, 0)">
<rect class="day" width="12" height="12" x="-14" y="0" fill="#d1d3c9" data-count="0" data-date="2020-08-11"/>
<rect class="day" width="12" height="12" x="-14" y="15" fill="#d1d3c9" data-count="0" data-date="2020-08-12"/>
<rect class="day" width="12" height="12" x="-14" y="30" fill="#d1d3c9" data-count="0" data-date="2020-08-13"/>
<rect class="day" width="12" height="12" x="-14" y="45" fill="#d1d3c9" data-count="0" data-date="2020-08-14"/>
<rect class="day" width="12" height="12" x="-14" y="60" fill="#d1d3c9" data-count="0" data-date="2020-08-15"/>
<rect class="day" width="12" height="12" x="-14" y="75" fill="#d1d3c9" data-count="0" data-date="2020-08-16"/>
<rect class="day" width="12" height="12" x="-14" y="90" fill="#d1d3c9" data-count="0" data-date="2020-08-17"/>
</g>
<g transform="translate(496, 0)">
<rect class="day" width="12" height="12" x="-15" y="0" fill="#d1d3c9" data-count="0" data-date="2020-08-18"/>
<rect class="day" width="12" height="12" x="-15" y="15" fill="#d1d3c9" data-count="0" data-date="2020-08-19"/>
<rect class="day" width="12" height="12" x="-15" y="30" fill="#d1d3c9" data-count="0" data-date="2020-08-20"/>
<rect class="day" width="12" height="12" x="-15" y="45" fill="#d1d3c9" data-count="0" data-date="2020-08-21"/>
<rect class="day" width="12" height="12" x="-15" y="60" fill="#d1d3c9" data-count="0" data-date="2020-08-22"/>
<rect class="day" width="12" height="12" x="-15" y="75" fill="#d1d3c9" data-count="0" data-date="2020-08-23"/>
<rect class="day" width="12" height="12" x="-15" y="90" fill="#7bc96f" data-count="6" data-date="2020-08-24"/>
</g>
<g transform="translate(512, 0)">
<rect class="day" width="12" height="12" x="-16" y="0" fill="#c6e48b" data-count="1" data-date="2020-08-25"/>
<rect class="day" width="12" height="12" x="-16" y="15" fill="#d1d3c9" data-count="0" data-date="2020-08-26"/>
<rect class="day" width="12" height="12" x="-16" y="30" fill="#d1d3c9" data-count="0" data-date="2020-08-27"/>
<rect class="day" width="12" height="12" x="-16" y="45" fill="#d1d3c9" data-count="0" data-date="2020-08-28"/>
<rect class="day" width="12" height="12" x="-16" y="60" fill="#d1d3c9" data-count="0" data-date="2020-08-29"/>
<rect class="day" width="12" height="12" x="-16" y="75" fill="#d1d3c9" data-count="0" data-date="2020-08-30"/>
<rect class="day" width="12" height="12" x="-16" y="90" fill="#d1d3c9" data-count="0" data-date="2020-08-31"/>
</g>
<g transform="translate(528, 0)">
<rect class="day" width="12" height="12" x="-17" y="0" fill="#d1d3c9" data-count="0" data-date="2020-09-01"/>
<rect class="day" width="12" height="12" x="-17" y="15" fill="#d1d3c9" data-count="0" data-date="2020-09-02"/>
<rect class="day" width="12" height="12" x="-17" y="30" fill="#d1d3c9" data-count="0" data-date="2020-09-03"/>
<rect class="day" width="12" height="12" x="-17" y="45" fill="#d1d3c9" data-count="0" data-date="2020-09-04"/>
<rect class="day" width="12" height="12" x="-17" y="60" fill="#d1d3c9" data-count="0" data-date="2020-09-05"/>
<rect class="day" width="12" height="12" x="-17" y="75" fill="#d1d3c9" data-count="0" data-date="2020-09-06"/>
<rect class="day" width="12" height="12" x="-17" y="90" fill="#d1d3c9" data-count="0" data-date="2020-09-07"/>
</g>
<g transform="translate(544, 0)">
<rect class="day" width="12" height="12" x="-18" y="0" fill="#d1d3c9" data-count="0" data-date="2020-09-08"/>
<rect class="day" width="12" height="12" x="-18" y="15" fill="#d1d3c9" data-count="0" data-date="2020-09-09"/>
<rect class="day" width="12" height="12" x="-18" y="30" fill="#d1d3c9" data-count="0" data-date="2020-09-10"/>
<rect class="day" width="12" height="12" x="-18" y="45" fill="#d1d3c9" data-count="0" data-date="2020-09-11"/>
<rect class="day" width="12" height="12" x="-18" y="60" fill="#d1d3c9" data-count="0" data-date="2020-09-12"/>
<rect class="day" width="12" height="12" x="-18" y="75" fill="#d1d3c9" data-count="0" data-date="2020-09-13"/>
<rect class="day" width="12" height="12" x="-18" y="90" fill="#d1d3c9" data-count="0" data-date="2020-09-14"/>
</g>
<g transform="translate(560, 0)">
<rect class="day" width="12" height="12" x="-19" y="0" fill="#d1d3c9" data-count="0" data-date="2020-09-15"/>
<rect class="day" width="12" height="12" x="-19" y="15" fill="#d1d3c9" data-count="0" data-date="2020-09-16"/>
<rect class="day" width="12" height="12" x="-19" y="30" fill="#d1d3c9" data-count="0" data-date="2020-09-17"/>
<rect class="day" width="12" height="12" x="-19" y="45" fill="#d1d3c9" data-count="0" data-date="2020-09-18"/>
<rect class="day" width="12" height="12" x="-19" y="60" fill="#d1d3c9" data-count="0" data-date="2020-09-19"/>
<rect class="day" width="12" height="12" x="-19" y="75" fill="#d1d3c9" data-count="0" data-date="2020-09-20"/>
<rect class="day" width="12" height="12" x="-19" y="90" fill="#d1d3c9" data-count="0" data-date="2020-09-21"/>
</g>
<g transform="translate(576, 0)">
<rect class="day" width="12" height="12" x="-20" y="0" fill="#d1d3c9" data-count="0" data-date="2020-09-22"/>
<rect class="day" width="12" height="12" x="-20" y="15" fill="#d1d3c9" data-count="0" data-date="2020-09-23"/>
<rect class="day" width="12" height="12" x="-20" y="30" fill="#d1d3c9" data-count="0" data-date="2020-09-24"/>
<rect class="day" width="12" height="12" x="-20" y="45" fill="#d1d3c9" data-count="0" data-date="2020-09-25"/>
<rect class="day" width="12" height="12" x="-20" y="60" fill="#d1d3c9" data-count="0" data-date="2020-09-26"/>
<rect class="day" width="12" height="12" x="-20" y="75" fill="#d1d3c9" data-count="0" data-date="2020-09-27"/>
<rect class="day" width="12" height="12" x="-20" y="90" fill="#d1d3c9" data-count="0" data-date="2020-09-28"/>
</g>
<g transform="translate(592, 0)">
<rect class="day" width="12" height="12" x="-21" y="0" fill="#d1d3c9" data-count="0" data-date="2020-09-29"/>
<rect class="day" width="12" height="12" x="-21" y="15" fill="#d1d3c9" data-count="0" data-date="2020-09-30"/>
<rect class="day" width="12" height="12" x="-21" y="30" fill="#d1d3c9" data-count="0" data-date="2020-10-01"/>
<rect class="day" width="12" height="12" x="-21" y="45" fill="#d1d3c9" data-count="0" data-date="2020-10-02"/>
<rect class="day" width="12" height="12" x="-21" y="60" fill="#d1d3c9" data-count="0" data-date="2020-10-03"/>
<rect class="day" width="12" height="12" x="-21" y="75" fill="#d1d3c9" data-count="0" data-date="2020-10-04"/>
<rect class="day" width="12" height="12" x="-21" y="90" fill="#d1d3c9" data-count="0" data-date="2020-10-05"/>
</g>
<g transform="translate(608, 0)">
<rect class="day" width="12" height="12" x="-22" y="0" fill="#7bc96f" data-count="6" data-date="2020-10-06"/>
<rect class="day" width="12" height="12" x="-22" y="15" fill="#c6e48b" data-count="2" data-date="2020-10-07"/>
<rect class="day" width="12" height="12" x="-22" y="30" fill="#d1d3c9" data-count="0" data-date="2020-10-08"/>
<rect class="day" width="12" height="12" x="-22" y="45" fill="#d1d3c9" data-count="0" data-date="2020-10-09"/>
<rect class="day" width="12" height="12" x="-22" y="60" fill="#d1d3c9" data-count="0" data-date="2020-10-10"/>
<rect class="day" width="12" height="12" x="-22" y="75" fill="#d1d3c9" data-count="0" data-date="2020-10-11"/>
<rect class="day" width="12" height="12" x="-22" y="90" fill="#d1d3c9" data-count="0" data-date="2020-10-12"/>
</g>
<g transform="translate(624, 0)">
<rect class="day" width="12" height="12" x="-23" y="0" fill="#d1d3c9" data-count="0" data-date="2020-10-13"/>
<rect class="day" width="12" height="12" x="-23" y="15" fill="#c6e48b" data-count="3" data-date="2020-10-14"/>
<rect class="day" width="12" height="12" x="-23" y="30" fill="#d1d3c9" data-count="0" data-date="2020-10-15"/>
<rect class="day" width="12" height="12" x="-23" y="45" fill="#d1d3c9" data-count="0" data-date="2020-10-16"/>
<rect class="day" width="12" height="12" x="-23" y="60" fill="#d1d3c9" data-count="0" data-date="2020-10-17"/>
<rect class="day" width="12" height="12" x="-23" y="75" fill="#d1d3c9" data-count="0" data-date="2020-10-18"/>
<rect class="day" width="12" height="12" x="-23" y="90" fill="#d1d3c9" data-count="0" data-date="2020-10-19"/>
</g>
<g transform="translate(640, 0)">
<rect class="day" width="12" height="12" x="-24" y="0" fill="#d1d3c9" data-count="0" data-date="2020-10-20"/>
<rect class="day" width="12" height="12" x="-24" y="15" fill="#d1d3c9" data-count="0" data-date="2020-10-21"/>
<rect class="day" width="12" height="12" x="-24" y="30" fill="#d1d3c9" data-count="0" data-date="2020-10-22"/>
<rect class="day" width="12" height="12" x="-24" y="45" fill="#d1d3c9" data-count="0" data-date="2020-10-23"/>
<rect class="day" width="12" height="12" x="-24" y="60" fill="#d1d3c9" data-count="0" data-date="2020-10-24"/>
<rect class="day" width="12" height="12" x="-24" y="75" fill="#d1d3c9" data-count="0" data-date="2020-10-25"/>
<rect class="day" width="12" height="12" x="-24" y="90" fill="#d1d3c9" data-count="0" data-date="2020-10-26"/>
</g>
<g transform="translate(656, 0)">
<rect class="day" width="12" height="12" x="-25" y="0" fill="#d1d3c9" data-count="0" data-date="2020-10-27"/>
<rect class="day" width="12" height="12" x="-25" y="15" fill="#d1d3c9" data-count="0" data-date="2020-10-28"/>
<rect class="day" width="12" height="12" x="-25" y="30" fill="#d1d3c9" data-count="0" data-date="2020-10-29"/>
<rect class="day" width="12" height="12" x="-25" y="45" fill="#d1d3c9" data-count="0" data-date="2020-10-30"/>
<rect class="day" width="12" height="12" x="-25" y="60" fill="#d1d3c9" data-count="0" data-date="2020-10-31"/>
<rect class="day" width="12" height="12" x="-25" y="75" fill="#d1d3c9" data-count="0" data-date="2020-11-01"/>
<rect class="day" width="12" height="12" x="-25" y="90" fill="#d1d3c9" data-count="0" data-date="2020-11-02"/>
</g>
<g transform="translate(672, 0)">
<rect class="day" width="12" height="12" x="-26" y="0" fill="#d1d3c9" data-count="0" data-date="2020-11-03"/>
<rect class="day" width="12" height="12" x="-26" y="15" fill="#d1d3c9" data-count="0" data-date="2020-11-04"/>
<rect class="day" width="12" height="12" x="-26" y="30" fill="#d1d3c9" data-count="0" data-date="2020-11-05"/>
<rect class="day" width="12" height="12" x="-26" y="45" fill="#d1d3c9" data-count="0" data-date="2020-11-06"/>
<rect class="day" width="12" height="12" x="-26" y="60" fill="#d1d3c9" data-count="0" data-date="2020-11-07"/>
<rect class="day" width="12" height="12" x="-26" y="75" fill="#d1d3c9" data-count="0" data-date="2020-11-08"/>
<rect class="day" width="12" height="12" x="-26" y="90" fill="#d1d3c9" data-count="0" data-date="2020-11-09"/>
</g>
<g transform="translate(688, 0)">
<rect class="day" width="12" height="12" x="-27" y="0" fill="#d1d3c9" data-count="0" data-date="2020-11-10"/>
<rect class="day" width="12" height="12" x="-27" y="15" fill="#d1d3c9" data-count="0" data-date="2020-11-11"/>
<rect class="day" width="12" height="12" x="-27" y="30" fill="#d1d3c9" data-count="0" data-date="2020-11-12"/>
<rect class="day" width="12" height="12" x="-27" y="45" fill="#d1d3c9" data-count="0" data-date="2020-11-13"/>
<rect class="day" width="12" height="12" x="-27" y="60" fill="#d1d3c9" data-count="0" data-date="2020-11-14"/>
<rect class="day" width="12" height="12" x="-27" y="75" fill="#d1d3c9" data-count="0" data-date="2020-11-15"/>
<rect class="day" width="12" height="12" x="-27" y="90" fill="#d1d3c9" data-count="0" data-date="2020-11-16"/>
</g>
<g transform="translate(704, 0)">
<rect class="day" width="12" height="12" x="-28" y="0" fill="#d1d3c9" data-count="0" data-date="2020-11-17"/>
<rect class="day" width="12" height="12" x="-28" y="15" fill="#d1d3c9" data-count="0" data-date="2020-11-18"/>
<rect class="day" width="12" height="12" x="-28" y="30" fill="#d1d3c9" data-count="0" data-date="2020-11-19"/>
<rect class="day" width="12" height="12" x="-28" y="45" fill="#d1d3c9" data-count="0" data-date="2020-11-20"/>
<rect class="day" width="12" height="12" x="-28" y="60" fill="#d1d3c9" data-count="0" data-date="2020-11-21"/>
<rect class="day" width="12" height="12" x="-28" y="75" fill="#d1d3c9" data-count="0" data-date="2020-11-22"/>
<rect class="day" width="12" height="12" x="-28" y="90" fill="#d1d3c9" data-count="0" data-date="2020-11-23"/>
</g>
<g transform="translate(720, 0)">
<rect class="day" width="12" height="12" x="-29" y="0" fill="#d1d3c9" data-count="0" data-date="2020-11-24"/>
<rect class="day" width="12" height="12" x="-29" y="15" fill="#d1d3c9" data-count="0" data-date="2020-11-25"/>
<rect class="day" width="12" height="12" x="-29" y="30" fill="#d1d3c9" data-count="0" data-date="2020-11-26"/>
<rect class="day" width="12" height="12" x="-29" y="45" fill="#d1d3c9" data-count="0" data-date="2020-11-27"/>
<rect class="day" width="12" height="12" x="-29" y="60" fill="#d1d3c9" data-count="0" data-date="2020-11-28"/>
<rect class="day" width="12" height="12" x="-29" y="75" fill="#d1d3c9" data-count="0" data-date="2020-11-29"/>
<rect class="day" width="12" height="12" x="-29" y="90" fill="#d1d3c9" data-count="0" data-date="2020-11-30"/>
</g>
<g transform="translate(736, 0)">
<rect class="day" width="12" height="12" x="-30" y="0" fill="#7bc96f" data-count="6" data-date="2020-12-01"/>
<rect class="day" width="12" height="12" x="-30" y="15" fill="#d1d3c9" data-count="0" data-date="2020-12-02"/>
<rect class="day" width="12" height="12" x="-30" y="30" fill="#d1d3c9" data-count="0" data-date="2020-12-03"/>
<rect class="day" width="12" height="12" x="-30" y="45" fill="#d1d3c9" data-count="0" data-date="2020-12-04"/>
<rect class="day" width="12" height="12" x="-30" y="60" fill="#d1d3c9" data-count="0" data-date="2020-12-05"/>
<rect class="day" width="12" height="12" x="-30" y="75" fill="#d1d3c9" data-count="0" data-date="2020-12-06"/>
<rect class="day" width="12" height="12" x="-30" y="90" fill="#d1d3c9" data-count="0" data-date="2020-12-07"/>
</g>
<g transform="translate(752, 0)">
<rect class="day" width="12" height="12" x="-31" y="0" fill="#d1d3c9" data-count="0" data-date="2020-12-08"/>
<rect class="day" width="12" height="12" x="-31" y="15" fill="#d1d3c9" data-count="0" data-date="2020-12-09"/>
<rect class="day" width="12" height="12" x="-31" y="30" fill="#d1d3c9" data-count="0" data-date="2020-12-10"/>
<rect class="day" width="12" height="12" x="-31" y="45" fill="#d1d3c9" data-count="0" data-date="2020-12-11"/>
<rect class="day" width="12" height="12" x="-31" y="60" fill="#c6e48b" data-count="1" data-date="2020-12-12"/>
<rect class="day" width="12" height="12" x="-31" y="75" fill="#196127" data-count="12" data-date="2020-12-13"/>
<rect class="day" width="12" height="12" x="-31" y="90" fill="#c6e48b" data-count="2" data-date="2020-12-14"/>
</g>
<g transform="translate(768, 0)">
<rect class="day" width="12" height="12" x="-32" y="0" fill="#d1d3c9" data-count="0" data-date="2020-12-15"/>
<rect class="day" width="12" height="12" x="-32" y="15" fill="#d1d3c9" data-count="0" data-date="2020-12-16"/>
<rect class="day" width="12" height="12" x="-32" y="30" fill="#d1d3c9" data-count="0" data-date="2020-12-17"/>
<rect class="day" width="12" height="12" x="-32" y="45" fill="#d1d3c9" data-count="0" data-date="2020-12-18"/>
<rect class="day" width="12" height="12" x="-32" y="60" fill="#d1d3c9" data-count="0" data-date="2020-12-19"/>
<rect class="day" width="12" height="12" x="-32" y="75" fill="#d1d3c9" data-count="0" data-date="2020-12-20"/>
<rect class="day" width="12" height="12" x="-32" y="90" fill="#d1d3c9" data-count="0" data-date="2020-12-21"/>
</g>
<g transform="translate(784, 0)">
<rect class="day" width="12" height="12" x="-33" y="0" fill="#d1d3c9" data-count="0" data-date="2020-12-22"/>
<rect class="day" width="12" height="12" x="-33" y="15" fill="#d1d3c9" data-count="0" data-date="2020-12-23"/>
<rect class="day" width="12" height="12" x="-33" y="30" fill="#d1d3c9" data-count="0" data-date="2020-12-24"/>
<rect class="day" width="12" height="12" x="-33" y="45" fill="#d1d3c9" data-count="0" data-date="2020-12-25"/>
<rect class="day" width="12" height="12" x="-33" y="60" fill="#d1d3c9" data-count="0" data-date="2020-12-26"/>
<rect class="day" width="12" height="12" x="-33" y="75" fill="#d1d3c9" data-count="0" data-date="2020-12-27"/>
<rect class="day" width="12" height="12" x="-33" y="90" fill="#d1d3c9" data-count="0" data-date="2020-12-28"/>
</g>
<g transform="translate(800, 0)">
<rect class="day" width="12" height="12" x="-34" y="0" fill="#d1d3c9" data-count="0" data-date="2020-12-29"/>
<rect class="day" width="12" height="12" x="-34" y="15" fill="#d1d3c9" data-count="0" data-date="2020-12-30"/>
<rect class="day" width="12" height="12" x="-34" y="30" fill="#d1d3c9" data-count="0" data-date="2020-12-31"/>
<rect class="day" width="12" height="12" x="-34" y="45" fill="#d1d3c9" data-count="0" data-date="2021-01-01"/>
<rect class="day" width="12" height="12" x="-34" y="60" fill="#d1d3c9" data-count="0" data-date="2021-01-02"/>
<rect class="day" width="12" height="12" x="-34" y="75" fill="#d1d3c9" data-count="0" data-date="2021-01-03"/>
<rect class="day" width="12" height="12" x="-34" y="90" fill="#d1d3c9" data-count="0" data-date="2021-01-04"/>
</g>
<g transform="translate(816, 0)">
<rect class="day" width="12" height="12" x="-35" y="0" fill="#d1d3c9" data-count="0" data-date="2021-01-05"/>
<rect class="day" width="12" height="12" x="-35" y="15" fill="#d1d3c9" data-count="0" data-date="2021-01-06"/>
<rect class="day" width="12" height="12" x="-35" y="30" fill="#d1d3c9" data-count="0" data-date="2021-01-07"/>
<rect class="day" width="12" height="12" x="-35" y="45" fill="#d1d3c9" data-count="0" data-date="2021-01-08"/>
<rect class="day" width="12" height="12" x="-35" y="60" fill="#d1d3c9" data-count="0" data-date="2021-01-09"/>
<rect class="day" width="12" height="12" x="-35" y="75" fill="#d1d3c9" data-count="0" data-date="2021-01-10"/>
<rect class="day" width="12" height="12" x="-35" y="90" fill="#d1d3c9" data-count="0" data-date="2021-01-11"/>
</g>
<g transform="translate(832, 0)">
<rect class="day" width="12" height="12" x="-36" y="0" fill="#d1d3c9" data-count="0" data-date="2021-01-12"/>
<rect class="day" width="12" height="12" x="-36" y="15" fill="#d1d3c9" data-count="0" data-date="2021-01-13"/>
<rect class="day" width="12" height="12" x="-36" y="30" fill="#d1d3c9" data-count="0" data-date="2021-01-14"/>
<rect class="day" width="12" height="12" x="-36" y="45" fill="#d1d3c9" data-count="0" data-date="2021-01-15"/>
</g>
<text x="16" y="-9" class="month">Jan</text>
<text x="61" y="-9" class="month">Feb</text>
<text x="121" y="-9" class="month">Mar</text>
<text x="196" y="-9" class="month">Apr</text>
<text x="256" y="-9" class="month">May</text>
<text x="316" y="-9" class="month">Jun</text>
<text x="391" y="-9" class="month">Jul</text>
<text x="451" y="-9" class="month">Aug</text>
<text x="511" y="-9" class="month">Sep</text>
<text x="586" y="-9" class="month">Oct</text>
<text x="646" y="-9" class="month">Nov</text>
<text x="706" y="-9" class="month">Dec</text>
<text x="781" y="-9" class="month">Jan</text>
<text text-anchor="start" class="wday" dx="-10" dy="8" style="display: none;">Sun</text>
<text text-anchor="start" class="wday" dx="-10" dy="25">Mon</text>
<text text-anchor="start" class="wday" dx="-10" dy="32" style="display: none;">Tue</text>
<text text-anchor="start" class="wday" dx="-10" dy="56">Wed</text>
<text text-anchor="start" class="wday" dx="-10" dy="57" style="display: none;">Thu</text>
<text text-anchor="start" class="wday" dx="-10" dy="85">Fri</text>
<text text-anchor="start" class="wday" dx="-10" dy="81" style="display: none;">Sat</text>
</g></svg>
</div>
</div>
</div>
</div>
</main>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment