Browse Source

add Home page

axolotle 3 years ago
parent
commit
348e28df3c
4 changed files with 631 additions and 8 deletions
  1. 49 0
      src/assets/imgs/home-creations.svg
  2. 233 0
      src/assets/imgs/home-kit.svg
  3. 191 0
      src/assets/imgs/home-library.svg
  4. 158 8
      src/pages/Home.vue

+ 49 - 0
src/assets/imgs/home-creations.svg

@@ -0,0 +1,49 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" width="970" height="670" viewBox="0 0 970 670" version="1.1" id="svg5889">
+  <defs id="defs5883">
+    <marker orient="auto" refY="0" refX="0" id="marker90834" style="overflow:visible">
+      <path id="path90832" d="m 5.77,0 -8.65,5 v -10 z" style="fill:#ff8873;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1pt;stroke-opacity:1" transform="scale(0.4)" />
+    </marker>
+    <filter style="color-interpolation-filters:sRGB" id="filter14240-8-1-2-1">
+      <feFlood flood-opacity="0.498039" flood-color="rgb(0,0,0)" result="flood" id="feFlood14230-6-1-7-5" />
+      <feComposite in="flood" in2="SourceGraphic" operator="in" result="composite1" id="feComposite14232-0-0-4-5" />
+      <feGaussianBlur in="composite1" stdDeviation="2" result="blur" id="feGaussianBlur14234-4-3-2-4" />
+      <feOffset dx="1.5" dy="1.5" result="offset" id="feOffset14236-8-4-5-9" />
+      <feComposite in="SourceGraphic" in2="offset" operator="over" result="composite2" id="feComposite14238-8-0-2-8" />
+    </filter>
+    <marker orient="auto" refY="0" refX="0" id="marker23282-3-7-3" style="overflow:visible">
+      <path id="path23280-8-6-8" d="m 5.77,0 -8.65,5 v -10 z" style="fill:#1b1b1b;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1pt;stroke-opacity:1" transform="scale(0.4)" />
+    </marker>
+    <marker orient="auto" refY="0" refX="0" id="marker22600-0-5-5" style="overflow:visible">
+      <path id="path22598-9-7-2" d="m 5.77,0 -8.65,5 v -10 z" style="fill:#98ff98;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1pt;stroke-opacity:1" transform="scale(0.4)" />
+    </marker>
+    <marker style="overflow:visible" id="marker24312-8-7-1-2" refX="0" refY="0" orient="auto">
+      <path transform="scale(0.4)" style="fill:#1b1b1b;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1pt;stroke-opacity:1" d="m 5.77,0 -8.65,5 v -10 z" id="path24310-8-99-3-2" />
+    </marker>
+    <marker style="overflow:visible" id="marker23768-6-32-3-7" refX="0" refY="0" orient="auto">
+      <path transform="scale(0.4)" style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1pt;stroke-opacity:1" d="m 5.77,0 -8.65,5 v -10 z" id="path23766-8-4-3-0" />
+    </marker>
+  </defs>
+  <metadata id="metadata5886">
+    <rdf:RDF>
+      <cc:Work rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g id="layer1">
+    <rect style="vector-effect:none;fill:#cccccc;fill-opacity:1;stroke:none;stroke-width:1.06855;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" id="rect149" width="307.023" height="14.883" x="331.484" y="574.134" />
+    <circle style="vector-effect:none;fill:#736f6e;fill-opacity:1;stroke:none;stroke-width:0.356181;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" id="circle151" cx="484.929" cy="334.424" r="41.8407" />
+    <circle r="33.9101" cy="334.424" cx="484.929" id="circle153" style="vector-effect:none;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.356181;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" />
+    <path id="path155" d="m 474.739,313.487 v 41.019 l 31.449,-20.235 z" style="fill:#736f6e;fill-opacity:1;stroke:none;stroke-width:0.376958px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
+    <rect ry="0" rx="0" transform="matrix(4.13099,0,0,2.28439,-907.61,-2995.32)" style="display:inline;vector-effect:none;fill:#cccccc;fill-opacity:1;stroke:none;stroke-width:0.231893;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal;filter:url(#filter14240-8-1-2-1)" id="rect159" width="148.33" height="151.004" x="262.93" y="1382.34" />
+    <rect style="display:inline;vector-effect:none;fill:#1b1b1b;fill-opacity:1;stroke:none;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-end:url(#marker23282-3-7-3);paint-order:normal" id="rect161" width="73.5882" height="11.9724" x="700.758" y="479.271" rx="15.8803" ry="15.8802" />
+    <rect ry="15.6663" rx="15.6663" y="477.24" x="698.729" height="11.8111" width="74.5916" id="rect163" style="display:inline;vector-effect:none;fill:#98ff98;fill-opacity:1;stroke:none;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-end:url(#marker22600-0-5-5);paint-order:normal" />
+    <rect ry="15.8802" rx="15.8803" y="479.277" x="609.398" height="11.9724" width="82.294" id="rect167" style="display:inline;vector-effect:none;fill:#1b1b1b;fill-opacity:1;stroke:none;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-end:url(#marker24312-8-7-1-2);paint-order:normal" />
+    <rect style="display:inline;vector-effect:none;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-end:url(#marker23768-6-32-3-7);paint-order:normal" id="rect169" width="83.2974" height="11.811" x="607.369" y="477.246" rx="15.6662" ry="15.6661" />
+    <rect transform="rotate(90)" ry="0" rx="0" y="-65" x="285" height="65" width="100" id="rect183" style="display:inline;vector-effect:none;fill:#98ff98;fill-opacity:1;stroke:none;stroke-width:0.944882;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" />
+    <rect style="display:inline;vector-effect:none;fill:#98ff98;fill-opacity:1;stroke:none;stroke-width:0.944882;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" id="rect185" width="100" height="65" x="285" y="-970" rx="0" ry="0" transform="rotate(90)" />
+  </g>
+</svg>

+ 233 - 0
src/assets/imgs/home-kit.svg

@@ -0,0 +1,233 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="970" height="670" viewBox="0 0 970 670" version="1.1" id="svg5889">
+  <defs id="defs5883">
+    <marker orient="auto" refY="0" refX="0" id="marker90834" style="overflow:visible">
+      <path id="path90832" d="m 5.77,0 -8.65,5 v -10 z" style="fill:#ff8873;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1pt;stroke-opacity:1" transform="scale(0.4)" />
+    </marker>
+  </defs>
+  <metadata id="metadata5886">
+    <rdf:RDF>
+      <cc:Work rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g id="layer1">
+    <image xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQ4AAACqCAYAAABcS6HpAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAA
+GXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABChJREFUeJzt3D9PnXUYx+H7oBGI
+jQ0HWyZholP/DA4OrGrCIOmiiW+gJq68iS6uJrwChw4qHRjqyuDg0KYOFhfYKgKSkAAm5biYaCyc
+Pl89h/OA1zUD9285H27I8/w6vfvLvQIIjI36AMDFIxxATDiAmHAAMeEAYq83+aLvv/xi2OeAS++9
+z5dHfYSBsXEAMeEAYsIBxIQDiAkHEBMOICYcQEw4gJhwALGO+ziAlI0DiAkHEBMOICYcQEw4gJj7
+OGiVy3RnxWVm4wBiwgHEhAOICQcQEw4gJhxATDiAmHAAMeEAYu7jAGI2DiAmHEBMOICYcAAx4QBi
+7uNoEXdRcFHYOICYcAAx4QBiwgHEhAOICQcQEw4gJhxATDiAmPs4gJiNA4gJBxATDiAmHEBMOICY
+cAAx4QBiwgHEhAOICQcQEw4g1uiW8x/e/3TY5wAG4N3vvjqXOTYOICYcQEw4gJhwADHhAGLCAcSE
+A4gJBxATDiAmHEBMOICYcAAx4QBijd6OPa837oCLwcYBxIQDiAkHEBMOICYcQEw4gJhwADG3nMOA
+/J+ed7JxADHhAGLCAcSEA4gJBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQc8s5ELNxADHhAGLC
+AcSEA4gJBxATDiAmHEDMLedwgY3qGSsbBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQEw4gJhxA
+TDiAmHAAMbecAzEbBxATDiAmHEBMOICYcAAx4QBiwgHE3HIOLXGRnpeycQAx4QBiwgHEhAOICQcQ
+Ew4gJhxATDiAmHAAMeEAYsIBxIQDiAkHEHPLORCzcQAx4QBiwgHEhAOICQcQEw4gJhxATDiAWKMH
+wP7upNer1Y2t+ubZZj15vls7R8f14qT3yu97baxT0xPjdXumW3dvzNXS/GyNdTqtnwu8rNO7v/zq
+T9+fNvcP6t7aev24vfefB9+8NlUriws1d/VKa+cCp2v8p8rm/kEtPXg0kA9vVdXT7b1aevCoNvcP
+WjkXOFujcLw46dW9tfXaOTwe6PCdw+P6bG29TnqnLz2jmgv01ygcD3/eGthv/H96ur1XqxtbrZoL
+9NcoHF//tDnUQ3z77PQP8KjmAv01CseTX3aHeoizfv6o5gL9NQrHb0e/D/UQe0en/w9jVHOB/hqF
+Y2rijaEeojsx3qq5QH+NwnF7pjvUQ9yZmW7VXKC/RuG4e2NuqIdYmn+nVXOB/hqFY2l+tm5emxrK
+AW5d79ZH87Otmgv01ygcY51OrSwu1PTkYP8nMD05XiuLC2e+OzKquUB/jR85n7t6pVY//mBgG8Ct
+6916+MmHNfvWm62cC5wtesmt6q+3VFc3turx89369fCo8Vuqb09O1J2Zbi3Nz/7rt2PPey7wsjgc
+AC7yAWLCAcSEA4gJBxATDiD2Bys0D6rtlEW1AAAAAElFTkSuQmCC
+" width="270" height="170" id="image7270" x="660" y="460" />
+    <image xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQ4AAACqCAYAAABcS6HpAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAA
+GXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABChJREFUeJzt3D9PnXUYx+H7oBGI
+jQ0HWyZholP/DA4OrGrCIOmiiW+gJq68iS6uJrwChw4qHRjqyuDg0KYOFhfYKgKSkAAm5biYaCyc
+Pl89h/OA1zUD9285H27I8/w6vfvLvQIIjI36AMDFIxxATDiAmHAAMeEAYq83+aLvv/xi2OeAS++9
+z5dHfYSBsXEAMeEAYsIBxIQDiAkHEBMOICYcQEw4gJhwALGO+ziAlI0DiAkHEBMOICYcQEw4gJj7
+OGiVy3RnxWVm4wBiwgHEhAOICQcQEw4gJhxATDiAmHAAMeEAYu7jAGI2DiAmHEBMOICYcAAx4QBi
+7uNoEXdRcFHYOICYcAAx4QBiwgHEhAOICQcQEw4gJhxATDiAmPs4gJiNA4gJBxATDiAmHEBMOICY
+cAAx4QBiwgHEhAOICQcQEw4g1uiW8x/e/3TY5wAG4N3vvjqXOTYOICYcQEw4gJhwADHhAGLCAcSE
+A4gJBxATDiAmHEBMOICYcAAx4QBijd6OPa837oCLwcYBxIQDiAkHEBMOICYcQEw4gJhwADG3nMOA
+/J+ed7JxADHhAGLCAcSEA4gJBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQc8s5ELNxADHhAGLC
+AcSEA4gJBxATDiAmHEDMLedwgY3qGSsbBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQEw4gJhxA
+TDiAmHAAMbecAzEbBxATDiAmHEBMOICYcAAx4QBiwgHE3HIOLXGRnpeycQAx4QBiwgHEhAOICQcQ
+Ew4gJhxATDiAmHAAMeEAYsIBxIQDiAkHEHPLORCzcQAx4QBiwgHEhAOICQcQEw4gJhxATDiAWKMH
+wP7upNer1Y2t+ubZZj15vls7R8f14qT3yu97baxT0xPjdXumW3dvzNXS/GyNdTqtnwu8rNO7v/zq
+T9+fNvcP6t7aev24vfefB9+8NlUriws1d/VKa+cCp2v8p8rm/kEtPXg0kA9vVdXT7b1aevCoNvcP
+WjkXOFujcLw46dW9tfXaOTwe6PCdw+P6bG29TnqnLz2jmgv01ygcD3/eGthv/H96ur1XqxtbrZoL
+9NcoHF//tDnUQ3z77PQP8KjmAv01CseTX3aHeoizfv6o5gL9NQrHb0e/D/UQe0en/w9jVHOB/hqF
+Y2rijaEeojsx3qq5QH+NwnF7pjvUQ9yZmW7VXKC/RuG4e2NuqIdYmn+nVXOB/hqFY2l+tm5emxrK
+AW5d79ZH87Otmgv01ygcY51OrSwu1PTkYP8nMD05XiuLC2e+OzKquUB/jR85n7t6pVY//mBgG8Ct
+6916+MmHNfvWm62cC5wtesmt6q+3VFc3turx89369fCo8Vuqb09O1J2Zbi3Nz/7rt2PPey7wsjgc
+AC7yAWLCAcSEA4gJBxATDiD2Bys0D6rtlEW1AAAAAElFTkSuQmCC
+" width="270" height="170" id="image7262" x="350" y="460" />
+    <image xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQ4AAACqCAYAAABcS6HpAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAA
+GXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABChJREFUeJzt3D9PnXUYx+H7oBGI
+jQ0HWyZholP/DA4OrGrCIOmiiW+gJq68iS6uJrwChw4qHRjqyuDg0KYOFhfYKgKSkAAm5biYaCyc
+Pl89h/OA1zUD9285H27I8/w6vfvLvQIIjI36AMDFIxxATDiAmHAAMeEAYq83+aLvv/xi2OeAS++9
+z5dHfYSBsXEAMeEAYsIBxIQDiAkHEBMOICYcQEw4gJhwALGO+ziAlI0DiAkHEBMOICYcQEw4gJj7
+OGiVy3RnxWVm4wBiwgHEhAOICQcQEw4gJhxATDiAmHAAMeEAYu7jAGI2DiAmHEBMOICYcAAx4QBi
+7uNoEXdRcFHYOICYcAAx4QBiwgHEhAOICQcQEw4gJhxATDiAmPs4gJiNA4gJBxATDiAmHEBMOICY
+cAAx4QBiwgHEhAOICQcQEw4g1uiW8x/e/3TY5wAG4N3vvjqXOTYOICYcQEw4gJhwADHhAGLCAcSE
+A4gJBxATDiAmHEBMOICYcAAx4QBijd6OPa837oCLwcYBxIQDiAkHEBMOICYcQEw4gJhwADG3nMOA
+/J+ed7JxADHhAGLCAcSEA4gJBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQc8s5ELNxADHhAGLC
+AcSEA4gJBxATDiAmHEDMLedwgY3qGSsbBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQEw4gJhxA
+TDiAmHAAMbecAzEbBxATDiAmHEBMOICYcAAx4QBiwgHE3HIOLXGRnpeycQAx4QBiwgHEhAOICQcQ
+Ew4gJhxATDiAmHAAMeEAYsIBxIQDiAkHEHPLORCzcQAx4QBiwgHEhAOICQcQEw4gJhxATDiAWKMH
+wP7upNer1Y2t+ubZZj15vls7R8f14qT3yu97baxT0xPjdXumW3dvzNXS/GyNdTqtnwu8rNO7v/zq
+T9+fNvcP6t7aev24vfefB9+8NlUriws1d/VKa+cCp2v8p8rm/kEtPXg0kA9vVdXT7b1aevCoNvcP
+WjkXOFujcLw46dW9tfXaOTwe6PCdw+P6bG29TnqnLz2jmgv01ygcD3/eGthv/H96ur1XqxtbrZoL
+9NcoHF//tDnUQ3z77PQP8KjmAv01CseTX3aHeoizfv6o5gL9NQrHb0e/D/UQe0en/w9jVHOB/hqF
+Y2rijaEeojsx3qq5QH+NwnF7pjvUQ9yZmW7VXKC/RuG4e2NuqIdYmn+nVXOB/hqFY2l+tm5emxrK
+AW5d79ZH87Otmgv01ygcY51OrSwu1PTkYP8nMD05XiuLC2e+OzKquUB/jR85n7t6pVY//mBgG8Ct
+6916+MmHNfvWm62cC5wtesmt6q+3VFc3turx89369fCo8Vuqb09O1J2Zbi3Nz/7rt2PPey7wsjgc
+AC7yAWLCAcSEA4gJBxATDiD2Bys0D6rtlEW1AAAAAElFTkSuQmCC
+" width="270" height="170" id="image7250" x="40" y="460" />
+    <image xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQ4AAACqCAYAAABcS6HpAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAA
+GXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABChJREFUeJzt3D9PnXUYx+H7oBGI
+jQ0HWyZholP/DA4OrGrCIOmiiW+gJq68iS6uJrwChw4qHRjqyuDg0KYOFhfYKgKSkAAm5biYaCyc
+Pl89h/OA1zUD9285H27I8/w6vfvLvQIIjI36AMDFIxxATDiAmHAAMeEAYq83+aLvv/xi2OeAS++9
+z5dHfYSBsXEAMeEAYsIBxIQDiAkHEBMOICYcQEw4gJhwALGO+ziAlI0DiAkHEBMOICYcQEw4gJj7
+OGiVy3RnxWVm4wBiwgHEhAOICQcQEw4gJhxATDiAmHAAMeEAYu7jAGI2DiAmHEBMOICYcAAx4QBi
+7uNoEXdRcFHYOICYcAAx4QBiwgHEhAOICQcQEw4gJhxATDiAmPs4gJiNA4gJBxATDiAmHEBMOICY
+cAAx4QBiwgHEhAOICQcQEw4g1uiW8x/e/3TY5wAG4N3vvjqXOTYOICYcQEw4gJhwADHhAGLCAcSE
+A4gJBxATDiAmHEBMOICYcAAx4QBijd6OPa837oCLwcYBxIQDiAkHEBMOICYcQEw4gJhwADG3nMOA
+/J+ed7JxADHhAGLCAcSEA4gJBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQc8s5ELNxADHhAGLC
+AcSEA4gJBxATDiAmHEDMLedwgY3qGSsbBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQEw4gJhxA
+TDiAmHAAMbecAzEbBxATDiAmHEBMOICYcAAx4QBiwgHE3HIOLXGRnpeycQAx4QBiwgHEhAOICQcQ
+Ew4gJhxATDiAmHAAMeEAYsIBxIQDiAkHEHPLORCzcQAx4QBiwgHEhAOICQcQEw4gJhxATDiAWKMH
+wP7upNer1Y2t+ubZZj15vls7R8f14qT3yu97baxT0xPjdXumW3dvzNXS/GyNdTqtnwu8rNO7v/zq
+T9+fNvcP6t7aev24vfefB9+8NlUriws1d/VKa+cCp2v8p8rm/kEtPXg0kA9vVdXT7b1aevCoNvcP
+WjkXOFujcLw46dW9tfXaOTwe6PCdw+P6bG29TnqnLz2jmgv01ygcD3/eGthv/H96ur1XqxtbrZoL
+9NcoHF//tDnUQ3z77PQP8KjmAv01CseTX3aHeoizfv6o5gL9NQrHb0e/D/UQe0en/w9jVHOB/hqF
+Y2rijaEeojsx3qq5QH+NwnF7pjvUQ9yZmW7VXKC/RuG4e2NuqIdYmn+nVXOB/hqFY2l+tm5emxrK
+AW5d79ZH87Otmgv01ygcY51OrSwu1PTkYP8nMD05XiuLC2e+OzKquUB/jR85n7t6pVY//mBgG8Ct
+6916+MmHNfvWm62cC5wtesmt6q+3VFc3turx89369fCo8Vuqb09O1J2Zbi3Nz/7rt2PPey7wsjgc
+AC7yAWLCAcSEA4gJBxATDiD2Bys0D6rtlEW1AAAAAElFTkSuQmCC
+" width="270" height="170" id="image7252" transform="translate(40,460)" />
+    <image xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQ4AAACqCAYAAABcS6HpAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAA
+GXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABChJREFUeJzt3D9PnXUYx+H7oBGI
+jQ0HWyZholP/DA4OrGrCIOmiiW+gJq68iS6uJrwChw4qHRjqyuDg0KYOFhfYKgKSkAAm5biYaCyc
+Pl89h/OA1zUD9285H27I8/w6vfvLvQIIjI36AMDFIxxATDiAmHAAMeEAYq83+aLvv/xi2OeAS++9
+z5dHfYSBsXEAMeEAYsIBxIQDiAkHEBMOICYcQEw4gJhwALGO+ziAlI0DiAkHEBMOICYcQEw4gJj7
+OGiVy3RnxWVm4wBiwgHEhAOICQcQEw4gJhxATDiAmHAAMeEAYu7jAGI2DiAmHEBMOICYcAAx4QBi
+7uNoEXdRcFHYOICYcAAx4QBiwgHEhAOICQcQEw4gJhxATDiAmPs4gJiNA4gJBxATDiAmHEBMOICY
+cAAx4QBiwgHEhAOICQcQEw4g1uiW8x/e/3TY5wAG4N3vvjqXOTYOICYcQEw4gJhwADHhAGLCAcSE
+A4gJBxATDiAmHEBMOICYcAAx4QBijd6OPa837oCLwcYBxIQDiAkHEBMOICYcQEw4gJhwADG3nMOA
+/J+ed7JxADHhAGLCAcSEA4gJBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQc8s5ELNxADHhAGLC
+AcSEA4gJBxATDiAmHEDMLedwgY3qGSsbBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQEw4gJhxA
+TDiAmHAAMbecAzEbBxATDiAmHEBMOICYcAAx4QBiwgHE3HIOLXGRnpeycQAx4QBiwgHEhAOICQcQ
+Ew4gJhxATDiAmHAAMeEAYsIBxIQDiAkHEHPLORCzcQAx4QBiwgHEhAOICQcQEw4gJhxATDiAWKMH
+wP7upNer1Y2t+ubZZj15vls7R8f14qT3yu97baxT0xPjdXumW3dvzNXS/GyNdTqtnwu8rNO7v/zq
+T9+fNvcP6t7aev24vfefB9+8NlUriws1d/VKa+cCp2v8p8rm/kEtPXg0kA9vVdXT7b1aevCoNvcP
+WjkXOFujcLw46dW9tfXaOTwe6PCdw+P6bG29TnqnLz2jmgv01ygcD3/eGthv/H96ur1XqxtbrZoL
+9NcoHF//tDnUQ3z77PQP8KjmAv01CseTX3aHeoizfv6o5gL9NQrHb0e/D/UQe0en/w9jVHOB/hqF
+Y2rijaEeojsx3qq5QH+NwnF7pjvUQ9yZmW7VXKC/RuG4e2NuqIdYmn+nVXOB/hqFY2l+tm5emxrK
+AW5d79ZH87Otmgv01ygcY51OrSwu1PTkYP8nMD05XiuLC2e+OzKquUB/jR85n7t6pVY//mBgG8Ct
+6916+MmHNfvWm62cC5wtesmt6q+3VFc3turx89369fCo8Vuqb09O1J2Zbi3Nz/7rt2PPey7wsjgc
+AC7yAWLCAcSEA4gJBxATDiD2Bys0D6rtlEW1AAAAAElFTkSuQmCC
+" width="270" height="170" id="image7236" x="660" y="250" />
+    <image xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQ4AAACqCAYAAABcS6HpAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAA
+GXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABChJREFUeJzt3D9PnXUYx+H7oBGI
+jQ0HWyZholP/DA4OrGrCIOmiiW+gJq68iS6uJrwChw4qHRjqyuDg0KYOFhfYKgKSkAAm5biYaCyc
+Pl89h/OA1zUD9285H27I8/w6vfvLvQIIjI36AMDFIxxATDiAmHAAMeEAYq83+aLvv/xi2OeAS++9
+z5dHfYSBsXEAMeEAYsIBxIQDiAkHEBMOICYcQEw4gJhwALGO+ziAlI0DiAkHEBMOICYcQEw4gJj7
+OGiVy3RnxWVm4wBiwgHEhAOICQcQEw4gJhxATDiAmHAAMeEAYu7jAGI2DiAmHEBMOICYcAAx4QBi
+7uNoEXdRcFHYOICYcAAx4QBiwgHEhAOICQcQEw4gJhxATDiAmPs4gJiNA4gJBxATDiAmHEBMOICY
+cAAx4QBiwgHEhAOICQcQEw4g1uiW8x/e/3TY5wAG4N3vvjqXOTYOICYcQEw4gJhwADHhAGLCAcSE
+A4gJBxATDiAmHEBMOICYcAAx4QBijd6OPa837oCLwcYBxIQDiAkHEBMOICYcQEw4gJhwADG3nMOA
+/J+ed7JxADHhAGLCAcSEA4gJBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQc8s5ELNxADHhAGLC
+AcSEA4gJBxATDiAmHEDMLedwgY3qGSsbBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQEw4gJhxA
+TDiAmHAAMbecAzEbBxATDiAmHEBMOICYcAAx4QBiwgHE3HIOLXGRnpeycQAx4QBiwgHEhAOICQcQ
+Ew4gJhxATDiAmHAAMeEAYsIBxIQDiAkHEHPLORCzcQAx4QBiwgHEhAOICQcQEw4gJhxATDiAWKMH
+wP7upNer1Y2t+ubZZj15vls7R8f14qT3yu97baxT0xPjdXumW3dvzNXS/GyNdTqtnwu8rNO7v/zq
+T9+fNvcP6t7aev24vfefB9+8NlUriws1d/VKa+cCp2v8p8rm/kEtPXg0kA9vVdXT7b1aevCoNvcP
+WjkXOFujcLw46dW9tfXaOTwe6PCdw+P6bG29TnqnLz2jmgv01ygcD3/eGthv/H96ur1XqxtbrZoL
+9NcoHF//tDnUQ3z77PQP8KjmAv01CseTX3aHeoizfv6o5gL9NQrHb0e/D/UQe0en/w9jVHOB/hqF
+Y2rijaEeojsx3qq5QH+NwnF7pjvUQ9yZmW7VXKC/RuG4e2NuqIdYmn+nVXOB/hqFY2l+tm5emxrK
+AW5d79ZH87Otmgv01ygcY51OrSwu1PTkYP8nMD05XiuLC2e+OzKquUB/jR85n7t6pVY//mBgG8Ct
+6916+MmHNfvWm62cC5wtesmt6q+3VFc3turx89369fCo8Vuqb09O1J2Zbi3Nz/7rt2PPey7wsjgc
+AC7yAWLCAcSEA4gJBxATDiD2Bys0D6rtlEW1AAAAAElFTkSuQmCC
+" width="270" height="170" id="image7210" x="350" y="250" />
+    <image xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQ4AAACqCAYAAABcS6HpAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAA
+GXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABChJREFUeJzt3D9PnXUYx+H7oBGI
+jQ0HWyZholP/DA4OrGrCIOmiiW+gJq68iS6uJrwChw4qHRjqyuDg0KYOFhfYKgKSkAAm5biYaCyc
+Pl89h/OA1zUD9285H27I8/w6vfvLvQIIjI36AMDFIxxATDiAmHAAMeEAYq83+aLvv/xi2OeAS++9
+z5dHfYSBsXEAMeEAYsIBxIQDiAkHEBMOICYcQEw4gJhwALGO+ziAlI0DiAkHEBMOICYcQEw4gJj7
+OGiVy3RnxWVm4wBiwgHEhAOICQcQEw4gJhxATDiAmHAAMeEAYu7jAGI2DiAmHEBMOICYcAAx4QBi
+7uNoEXdRcFHYOICYcAAx4QBiwgHEhAOICQcQEw4gJhxATDiAmPs4gJiNA4gJBxATDiAmHEBMOICY
+cAAx4QBiwgHEhAOICQcQEw4g1uiW8x/e/3TY5wAG4N3vvjqXOTYOICYcQEw4gJhwADHhAGLCAcSE
+A4gJBxATDiAmHEBMOICYcAAx4QBijd6OPa837oCLwcYBxIQDiAkHEBMOICYcQEw4gJhwADG3nMOA
+/J+ed7JxADHhAGLCAcSEA4gJBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQc8s5ELNxADHhAGLC
+AcSEA4gJBxATDiAmHEDMLedwgY3qGSsbBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQEw4gJhxA
+TDiAmHAAMbecAzEbBxATDiAmHEBMOICYcAAx4QBiwgHE3HIOLXGRnpeycQAx4QBiwgHEhAOICQcQ
+Ew4gJhxATDiAmHAAMeEAYsIBxIQDiAkHEHPLORCzcQAx4QBiwgHEhAOICQcQEw4gJhxATDiAWKMH
+wP7upNer1Y2t+ubZZj15vls7R8f14qT3yu97baxT0xPjdXumW3dvzNXS/GyNdTqtnwu8rNO7v/zq
+T9+fNvcP6t7aev24vfefB9+8NlUriws1d/VKa+cCp2v8p8rm/kEtPXg0kA9vVdXT7b1aevCoNvcP
+WjkXOFujcLw46dW9tfXaOTwe6PCdw+P6bG29TnqnLz2jmgv01ygcD3/eGthv/H96ur1XqxtbrZoL
+9NcoHF//tDnUQ3z77PQP8KjmAv01CseTX3aHeoizfv6o5gL9NQrHb0e/D/UQe0en/w9jVHOB/hqF
+Y2rijaEeojsx3qq5QH+NwnF7pjvUQ9yZmW7VXKC/RuG4e2NuqIdYmn+nVXOB/hqFY2l+tm5emxrK
+AW5d79ZH87Otmgv01ygcY51OrSwu1PTkYP8nMD05XiuLC2e+OzKquUB/jR85n7t6pVY//mBgG8Ct
+6916+MmHNfvWm62cC5wtesmt6q+3VFc3turx89369fCo8Vuqb09O1J2Zbi3Nz/7rt2PPey7wsjgc
+AC7yAWLCAcSEA4gJBxATDiD2Bys0D6rtlEW1AAAAAElFTkSuQmCC
+" width="270" height="170" id="image7192" x="40" y="250" />
+    <image xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQ4AAACqCAYAAABcS6HpAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAA
+GXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABChJREFUeJzt3D9PnXUYx+H7oBGI
+jQ0HWyZholP/DA4OrGrCIOmiiW+gJq68iS6uJrwChw4qHRjqyuDg0KYOFhfYKgKSkAAm5biYaCyc
+Pl89h/OA1zUD9285H27I8/w6vfvLvQIIjI36AMDFIxxATDiAmHAAMeEAYq83+aLvv/xi2OeAS++9
+z5dHfYSBsXEAMeEAYsIBxIQDiAkHEBMOICYcQEw4gJhwALGO+ziAlI0DiAkHEBMOICYcQEw4gJj7
+OGiVy3RnxWVm4wBiwgHEhAOICQcQEw4gJhxATDiAmHAAMeEAYu7jAGI2DiAmHEBMOICYcAAx4QBi
+7uNoEXdRcFHYOICYcAAx4QBiwgHEhAOICQcQEw4gJhxATDiAmPs4gJiNA4gJBxATDiAmHEBMOICY
+cAAx4QBiwgHEhAOICQcQEw4g1uiW8x/e/3TY5wAG4N3vvjqXOTYOICYcQEw4gJhwADHhAGLCAcSE
+A4gJBxATDiAmHEBMOICYcAAx4QBijd6OPa837oCLwcYBxIQDiAkHEBMOICYcQEw4gJhwADG3nMOA
+/J+ed7JxADHhAGLCAcSEA4gJBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQc8s5ELNxADHhAGLC
+AcSEA4gJBxATDiAmHEDMLedwgY3qGSsbBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQEw4gJhxA
+TDiAmHAAMbecAzEbBxATDiAmHEBMOICYcAAx4QBiwgHE3HIOLXGRnpeycQAx4QBiwgHEhAOICQcQ
+Ew4gJhxATDiAmHAAMeEAYsIBxIQDiAkHEHPLORCzcQAx4QBiwgHEhAOICQcQEw4gJhxATDiAWKMH
+wP7upNer1Y2t+ubZZj15vls7R8f14qT3yu97baxT0xPjdXumW3dvzNXS/GyNdTqtnwu8rNO7v/zq
+T9+fNvcP6t7aev24vfefB9+8NlUriws1d/VKa+cCp2v8p8rm/kEtPXg0kA9vVdXT7b1aevCoNvcP
+WjkXOFujcLw46dW9tfXaOTwe6PCdw+P6bG29TnqnLz2jmgv01ygcD3/eGthv/H96ur1XqxtbrZoL
+9NcoHF//tDnUQ3z77PQP8KjmAv01CseTX3aHeoizfv6o5gL9NQrHb0e/D/UQe0en/w9jVHOB/hqF
+Y2rijaEeojsx3qq5QH+NwnF7pjvUQ9yZmW7VXKC/RuG4e2NuqIdYmn+nVXOB/hqFY2l+tm5emxrK
+AW5d79ZH87Otmgv01ygcY51OrSwu1PTkYP8nMD05XiuLC2e+OzKquUB/jR85n7t6pVY//mBgG8Ct
+6916+MmHNfvWm62cC5wtesmt6q+3VFc3turx89369fCo8Vuqb09O1J2Zbi3Nz/7rt2PPey7wsjgc
+AC7yAWLCAcSEA4gJBxATDiD2Bys0D6rtlEW1AAAAAElFTkSuQmCC
+" width="270" height="170" id="image7184" x="660" y="40" />
+    <image xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQ4AAACqCAYAAABcS6HpAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAA
+GXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABChJREFUeJzt3D9PnXUYx+H7oBGI
+jQ0HWyZholP/DA4OrGrCIOmiiW+gJq68iS6uJrwChw4qHRjqyuDg0KYOFhfYKgKSkAAm5biYaCyc
+Pl89h/OA1zUD9285H27I8/w6vfvLvQIIjI36AMDFIxxATDiAmHAAMeEAYq83+aLvv/xi2OeAS++9
+z5dHfYSBsXEAMeEAYsIBxIQDiAkHEBMOICYcQEw4gJhwALGO+ziAlI0DiAkHEBMOICYcQEw4gJj7
+OGiVy3RnxWVm4wBiwgHEhAOICQcQEw4gJhxATDiAmHAAMeEAYu7jAGI2DiAmHEBMOICYcAAx4QBi
+7uNoEXdRcFHYOICYcAAx4QBiwgHEhAOICQcQEw4gJhxATDiAmPs4gJiNA4gJBxATDiAmHEBMOICY
+cAAx4QBiwgHEhAOICQcQEw4g1uiW8x/e/3TY5wAG4N3vvjqXOTYOICYcQEw4gJhwADHhAGLCAcSE
+A4gJBxATDiAmHEBMOICYcAAx4QBijd6OPa837oCLwcYBxIQDiAkHEBMOICYcQEw4gJhwADG3nMOA
+/J+ed7JxADHhAGLCAcSEA4gJBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQc8s5ELNxADHhAGLC
+AcSEA4gJBxATDiAmHEDMLedwgY3qGSsbBxATDiAmHEBMOICYcAAx4QBiwgHEhAOICQcQEw4gJhxA
+TDiAmHAAMbecAzEbBxATDiAmHEBMOICYcAAx4QBiwgHE3HIOLXGRnpeycQAx4QBiwgHEhAOICQcQ
+Ew4gJhxATDiAmHAAMeEAYsIBxIQDiAkHEHPLORCzcQAx4QBiwgHEhAOICQcQEw4gJhxATDiAWKMH
+wP7upNer1Y2t+ubZZj15vls7R8f14qT3yu97baxT0xPjdXumW3dvzNXS/GyNdTqtnwu8rNO7v/zq
+T9+fNvcP6t7aev24vfefB9+8NlUriws1d/VKa+cCp2v8p8rm/kEtPXg0kA9vVdXT7b1aevCoNvcP
+WjkXOFujcLw46dW9tfXaOTwe6PCdw+P6bG29TnqnLz2jmgv01ygcD3/eGthv/H96ur1XqxtbrZoL
+9NcoHF//tDnUQ3z77PQP8KjmAv01CseTX3aHeoizfv6o5gL9NQrHb0e/D/UQe0en/w9jVHOB/hqF
+Y2rijaEeojsx3qq5QH+NwnF7pjvUQ9yZmW7VXKC/RuG4e2NuqIdYmn+nVXOB/hqFY2l+tm5emxrK
+AW5d79ZH87Otmgv01ygcY51OrSwu1PTkYP8nMD05XiuLC2e+OzKquUB/jR85n7t6pVY//mBgG8Ct
+6916+MmHNfvWm62cC5wtesmt6q+3VFc3turx89369fCo8Vuqb09O1J2Zbi3Nz/7rt2PPey7wsjgc
+AC7yAWLCAcSEA4gJBxATDiD2Bys0D6rtlEW1AAAAAElFTkSuQmCC
+" width="270" height="170" id="image7164" x="350" y="40" />
+    <g id="g7150">
+      <rect style="display:inline;vector-effect:none;fill:#ff8873;fill-opacity:1;stroke:none;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-end:url(#marker90834);paint-order:normal" id="rect111813" width="270" height="170" x="40" y="40" />
+      <rect y="46" x="49" height="10" width="210" id="rect111831" style="vector-effect:none;fill:#c81e00;fill-opacity:1;stroke:none;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" />
+      <rect style="vector-effect:none;fill:#c81e00;fill-opacity:1;stroke:none;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" id="rect111833" width="155" height="10" x="49" y="62" />
+      <rect style="vector-effect:none;fill:#cccccc;fill-opacity:1;stroke:none;stroke-width:2.83465;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" id="rect111835" width="235" height="14" x="49" y="100" />
+      <rect y="122" x="49" height="14" width="202" id="rect111837" style="vector-effect:none;fill:#cccccc;fill-opacity:1;stroke:none;stroke-width:2.83465;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" />
+      <rect style="vector-effect:none;fill:#cccccc;fill-opacity:1;stroke:none;stroke-width:2.83465;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" id="rect111839" width="231" height="14" x="49" y="144" />
+      <rect y="166" x="49" height="14" width="218" id="rect111841" style="vector-effect:none;fill:#cccccc;fill-opacity:1;stroke:none;stroke-width:2.83465;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" />
+      <rect y="78.0003" x="49" height="10" width="90" id="rect111843" style="vector-effect:none;fill:#c81e00;fill-opacity:1;stroke:none;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" />
+      <rect ry="7.5" rx="7.5" style="display:inline;vector-effect:none;fill:#1b1b1b;fill-opacity:1;stroke:none;stroke-width:2.835;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" id="rect111935" width="25" height="15" x="79.0001" y="189" />
+      <rect y="189" x="49" height="15" width="25" id="rect111937" style="display:inline;vector-effect:none;fill:#1b1b1b;fill-opacity:1;stroke:none;stroke-width:2.83465;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" rx="7.5" ry="7.5" />
+      <rect ry="7.5" rx="7.5" style="display:inline;vector-effect:none;fill:#1b1b1b;fill-opacity:1;stroke:none;stroke-width:2.835;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" id="rect7304" width="25" height="15" x="419" y="189" />
+      <rect ry="7.5" rx="7.5" style="display:inline;vector-effect:none;fill:#1b1b1b;fill-opacity:1;stroke:none;stroke-width:2.835;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" id="rect7306" width="25" height="15" x="109" y="399" />
+      <rect ry="7.5" rx="7.5" style="display:inline;vector-effect:none;fill:#1b1b1b;fill-opacity:1;stroke:none;stroke-width:2.835;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" id="rect7308" width="25" height="15" x="109" y="399" />
+      <rect ry="7.5" rx="7.5" style="display:inline;vector-effect:none;fill:#1b1b1b;fill-opacity:1;stroke:none;stroke-width:2.835;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:normal" id="rect7322" width="25" height="15" x="419" y="609" />
+    </g>
+  </g>
+</svg>

+ 191 - 0
src/assets/imgs/home-library.svg

@@ -0,0 +1,191 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="-685 -481 1412.57 1340.1" width="1412.57" height="1340.1" id="svg205">
+  <metadata id="metadata211">
+    <rdf:RDF>
+      <cc:Work rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs id="defs209" />
+  <style id="style2">
+    /* <![CDATA[ */
+    .svg-link {
+        stroke: grey;
+        vector-effect: non-scaling-stroke;
+    }
+    .svg-link.siblings {
+        stroke-dasharray: 4;
+    }
+    .svg-link.parents {
+        stroke: red;
+        opacity: .3;
+    }
+    .svg-dot-depart {
+        fill: #fff;
+        stroke: #000;
+        stroke-width: 3px;
+        vector-effect: non-scaling-stroke;
+    }
+    
+    .svg-dot-echo {
+        fill: #db7dff;
+    }
+    .svg-dot-lecture {
+        fill: #9191ff;
+    }
+    .svg-dot-reflexion {
+        fill: #ffe87d;
+    }
+    .svg-dot-sensible {
+        fill: #cdae87;
+    }
+    .svg-dot-critique {
+        fill: #ffba7d;
+    }
+    .svg-dot-lecture {
+        fill: #9191ff;
+    }
+    .svg-dot-kit {
+        fill: #ff775f;
+    }
+    .svg-dot-dark {
+        fill: #ff775f;
+    }
+    /* ]]> */
+  </style>
+  <g id="g203" transform="translate(-42.581,119.402)">
+    <path d="m -297.883,-251.614 -152.276,121.349" class="svg-link siblings" id="path4" />
+    <path d="m -297.883,-251.614 -17.785,-200.326" class="svg-link siblings" id="path6" />
+    <path d="m -297.883,-251.614 76.099,234.8608" class="svg-link siblings" id="path8" />
+    <path d="m -297.883,-251.614 -51.109,-70.245" class="svg-link children" id="path10" />
+    <path d="m -297.883,-251.614 84.131,-136.65" class="svg-link children" id="path12" />
+    <path d="m -297.883,-251.614 69.324,-24.484" class="svg-link children" id="path14" />
+    <path d="m -297.883,-251.614 15.799,-84.849" class="svg-link children" id="path16" />
+    <path d="m -450.159,-130.265 22.959,125.42338" class="svg-link siblings" id="path18" />
+    <path d="m -450.159,-130.265 -142.76,25.471" class="svg-link siblings" id="path20" />
+    <path d="m -450.159,-130.265 -30.815,-101.107" class="svg-link children" id="path22" />
+    <path d="m -450.159,-130.265 -69.749,36.031" class="svg-link children" id="path24" />
+    <path d="m -450.159,-130.265 -72.962,-50.887" class="svg-link children" id="path26" />
+    <path d="m -450.159,-130.265 39.498,-44.223" class="svg-link children" id="path28" />
+    <path d="m -221.784,-16.7532 92.024,233.3822" class="svg-link siblings" id="path30" />
+    <path d="m -213.752,-388.264 92.337,-162.638" class="svg-link siblings" id="path32" />
+    <path d="m -427.2,-4.84162 -106.869,26.72922" class="svg-link siblings" id="path34" />
+    <path d="m -592.919,-104.794 73.011,10.56" class="svg-link children" id="path36" />
+    <path d="m -519.908,-94.234 92.708,89.39238" class="svg-link siblings" id="path38" />
+    <path d="m -129.76,216.629 -110.409,158.435" class="svg-link siblings" id="path40" />
+    <path d="m -129.76,216.629 250.453,-90.99" class="svg-link siblings" id="path42" />
+    <path d="m -129.76,216.629 99.5813,-178.5156" class="svg-link siblings" id="path44" />
+    <path d="m -129.76,216.629 -174.6,58.722" class="svg-link siblings" id="path46" />
+    <path d="m -129.76,216.629 60.8636,-35.277" class="svg-link children" id="path48" />
+    <path d="m -129.76,216.629 77.2024,125.127" class="svg-link children" id="path50" />
+    <path d="m -129.76,216.629 -94.391,15.418" class="svg-link children" id="path52" />
+    <path d="m -129.76,216.629 -33.159,69.626" class="svg-link children" id="path54" />
+    <path d="m -534.069,21.8876 83.91,-152.1526" class="svg-link siblings" id="path56" />
+    <path d="m -534.069,21.8876 -39.126,69.3928" class="svg-link children" id="path58" />
+    <path d="m 120.693,125.639 289.688,-115.635" class="svg-link siblings" id="path60" />
+    <path d="m -30.1787,38.1134 172.8097,-128.8387" class="svg-link siblings" id="path62" />
+    <path d="m -68.8964,181.352 189.5894,-55.713" class="svg-link siblings" id="path64" />
+    <path d="m -52.5576,341.756 -171.5934,-109.709" class="svg-link parents" id="path66" />
+    <path d="m -52.5576,341.756 65.6286,139.409" class="svg-link siblings" id="path68" />
+    <path d="m -52.5576,341.756 184.0216,61.5" class="svg-link siblings" id="path70" />
+    <path d="m -224.151,232.047 -233.891,122.138" class="svg-link parents" id="path72" />
+    <path d="m -162.919,286.255 192.4023,-73.729" class="svg-link parents" id="path74" />
+    <path d="m 410.381,10.004 154.292,63.6951" class="svg-link siblings" id="path76" />
+    <path d="m 410.381,10.004 28.457,-198.243" class="svg-link siblings" id="path78" />
+    <path d="m 410.381,10.004 136.287,-144.78" class="svg-link siblings" id="path80" />
+    <path d="m 410.381,10.004 46.835,48.3349" class="svg-link children" id="path82" />
+    <path d="m 410.381,10.004 37.561,-68.0975" class="svg-link children" id="path84" />
+    <path d="m 410.381,10.004 111.622,-52.9377" class="svg-link children" id="path86" />
+    <path d="m 410.381,10.004 -29.548,-55.369" class="svg-link children" id="path88" />
+    <path d="m 142.631,-90.7253 26.625,-113.0557" class="svg-link children" id="path90" />
+    <path d="m 142.631,-90.7253 -62.9894,6.3272" class="svg-link children" id="path92" />
+    <path d="m 142.631,-90.7253 -42.437,-113.1377" class="svg-link children" id="path94" />
+    <path d="m 142.631,-90.7253 55.945,-52.8557" class="svg-link children" id="path96" />
+    <path d="m 142.631,-90.7253 -84.7254,-61.0157" class="svg-link children" id="path98" />
+    <path d="m 142.631,-90.7253 62.055,70.4835" class="svg-link children" id="path100" />
+    <path d="m 13.071,481.165 117.06,74.43" class="svg-link siblings" id="path102" />
+    <path d="m 131.464,403.256 -118.393,77.909" class="svg-link siblings" id="path104" />
+    <path d="m 131.464,403.256 -1.333,152.339" class="svg-link siblings" id="path106" />
+    <path d="m 131.464,403.256 50.548,-152.73" class="svg-link siblings" id="path108" />
+    <path d="m 131.464,403.256 136.148,-131.354" class="svg-link siblings" id="path110" />
+    <path d="m 131.464,403.256 17.119,81.724" class="svg-link children" id="path112" />
+    <path d="m 522.003,-42.9337 46.244,-269.9133" class="svg-link parents" id="path114" />
+    <path d="m 522.003,-42.9337 198.652,97.5518" class="svg-link parents" id="path116" />
+    <path d="m 204.686,-20.2418 -46.773,-315.7282" class="svg-link parents" id="path118" />
+    <path d="m 204.686,-20.2418 73.547,-299.7812" class="svg-link parents" id="path120" />
+    <path d="m 204.686,-20.2418 165.021,180.7588" class="svg-link parents" id="path122" />
+    <path d="m 204.686,-20.2418 -22.674,270.7678" class="svg-link parents" id="path124" />
+    <path d="m 204.686,-20.2418 62.926,292.1438" class="svg-link parents" id="path126" />
+    <path d="m 130.131,555.595 -128.02091,85.652" class="svg-link siblings" id="path128" />
+    <path d="m 130.131,555.595 105.91,94.305" class="svg-link siblings" id="path130" />
+    <path d="m 130.131,555.595 -24.545,134.599" class="svg-link siblings" id="path132" />
+    <path d="m 130.131,555.595 157.52,-13.198" class="svg-link siblings" id="path134" />
+    <path d="m 130.131,555.595 18.452,-70.615" class="svg-link children" id="path136" />
+    <path d="m 182.012,250.526 85.6,21.376" class="svg-link siblings" id="path138" />
+    <circle r="9.5" cx="-297.883" cy="-251.614" id="preview-node-83" tabindex="0" class="svg-dot svg-dot-depart origin" />
+    <circle r="9.5" cx="-450.159" cy="-130.265" id="preview-node-72" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="-315.668" cy="-451.94" id="preview-node-89" tabindex="0" class="svg-dot svg-dot-echo" />
+    <circle r="9.5" cx="-221.784" cy="-16.7532" id="preview-node-218" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="-348.992" cy="-321.859" id="preview-node-84" tabindex="0" class="svg-dot svg-dot-lecture" />
+    <circle r="9.5" cx="-213.752" cy="-388.264" id="preview-node-85" tabindex="0" class="svg-dot svg-dot-reflexion" />
+    <circle r="9.5" cx="-228.559" cy="-276.098" id="preview-node-90" tabindex="0" class="svg-dot svg-dot-sensible" />
+    <circle r="9.5" cx="-282.084" cy="-336.463" id="preview-node-91" tabindex="0" class="svg-dot svg-dot-sensible" />
+    <circle r="9.5" cx="-427.2" cy="-4.84162" id="preview-node-82" tabindex="0" class="svg-dot svg-dot-echo" />
+    <circle r="9.5" cx="-592.919" cy="-104.794" id="preview-node-78" tabindex="0" class="svg-dot svg-dot-critique" />
+    <circle r="9.5" cx="-480.974" cy="-231.372" id="preview-node-73" tabindex="0" class="svg-dot svg-dot-lecture" />
+    <circle r="9.5" cx="-519.908" cy="-94.234" id="preview-node-77" tabindex="0" class="svg-dot svg-dot-reflexion" />
+    <circle r="9.5" cx="-523.121" cy="-181.152" id="preview-node-80" tabindex="0" class="svg-dot svg-dot-kit" />
+    <circle r="9.5" cx="-410.661" cy="-174.488" id="preview-node-81" tabindex="0" class="svg-dot svg-dot-sensible" />
+    <circle r="9.5" cx="-129.76" cy="216.629" id="preview-node-214" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="-121.415" cy="-550.902" id="preview-node-88" tabindex="0" class="svg-dot svg-dot-critique" />
+    <circle r="9.5" cx="-534.069" cy="21.8876" id="preview-node-74" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="-240.169" cy="375.064" id="preview-node-47" tabindex="0" class="svg-dot svg-dot-critique" />
+    <circle r="9.5" cx="120.693" cy="125.639" id="preview-node-35" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="-30.1787" cy="38.1134" id="preview-node-219" tabindex="0" class="svg-dot svg-dot-critique" />
+    <circle r="9.5" cx="-304.36" cy="275.351" id="preview-node-225" tabindex="0" class="svg-dot svg-dot-echo" />
+    <circle r="9.5" cx="-68.8964" cy="181.352" id="preview-node-215" tabindex="0" class="svg-dot svg-dot-lecture" />
+    <circle r="9.5" cx="-52.5576" cy="341.756" id="preview-node-216" tabindex="0" class="svg-dot svg-dot-reflexion" />
+    <circle r="9.5" cx="-224.151" cy="232.047" id="preview-node-37" tabindex="0" class="svg-dot svg-dot-critique" />
+    <circle r="9.5" cx="-162.919" cy="286.255" id="preview-node-217" tabindex="0" class="svg-dot svg-dot-sensible" />
+    <circle r="9.5" cx="-573.195" cy="91.2804" id="preview-node-210" tabindex="0" class="svg-dot svg-dot-echo" />
+    <circle r="9.5" cx="410.381" cy="10.004" id="preview-node-1" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="142.631" cy="-90.7253" id="preview-node-220" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="13.071" cy="481.165" id="preview-node-46" tabindex="0" class="svg-dot svg-dot-critique" />
+    <circle r="9.5" cx="131.464" cy="403.256" id="preview-node-109" tabindex="0" class="svg-dot svg-dot-critique" />
+    <circle r="9.5" cx="-458.042" cy="354.185" id="preview-node-40" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="29.4833" cy="212.526" id="preview-node-221" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="564.673" cy="73.6991" id="preview-node-31" tabindex="0" class="svg-dot svg-dot-echo" />
+    <circle r="9.5" cx="438.838" cy="-188.239" id="preview-node-34" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="546.668" cy="-134.776" id="preview-node-36" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="457.216" cy="58.3389" id="preview-node-2" tabindex="0" class="svg-dot svg-dot-reflexion" />
+    <circle r="9.5" cx="447.942" cy="-58.0935" id="preview-node-3" tabindex="0" class="svg-dot svg-dot-lecture" />
+    <circle r="9.5" cx="522.003" cy="-42.9337" id="preview-node-33" tabindex="0" class="svg-dot svg-dot-kit" />
+    <circle r="9.5" cx="380.833" cy="-45.365" id="preview-node-226" tabindex="0" class="svg-dot svg-dot-sensible" />
+    <circle r="9.5" cx="169.256" cy="-203.781" id="preview-node-229" tabindex="0" class="svg-dot svg-dot-lecture" />
+    <circle r="9.5" cx="79.6416" cy="-84.3981" id="preview-node-230" tabindex="0" class="svg-dot svg-dot-lecture" />
+    <circle r="9.5" cx="100.194" cy="-203.863" id="preview-node-231" tabindex="0" class="svg-dot svg-dot-sensible" />
+    <circle r="9.5" cx="198.576" cy="-143.581" id="preview-node-232" tabindex="0" class="svg-dot svg-dot-dark" />
+    <circle r="9.5" cx="57.9056" cy="-151.741" id="preview-node-233" tabindex="0" class="svg-dot svg-dot-sensible" />
+    <circle r="9.5" cx="204.686" cy="-20.2418" id="preview-node-234" tabindex="0" class="svg-dot svg-dot-reflexion" />
+    <circle r="9.5" cx="130.131" cy="555.595" id="preview-node-106" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="182.012" cy="250.526" id="preview-node-238" tabindex="0" class="svg-dot svg-dot-critique" />
+    <circle r="9.5" cx="267.612" cy="271.902" id="preview-node-239" tabindex="0" class="svg-dot svg-dot-critique" />
+    <circle r="9.5" cx="148.583" cy="484.98" id="preview-node-107" tabindex="0" class="svg-dot svg-dot-lecture" />
+    <circle r="9.5" cx="568.247" cy="-312.847" id="preview-node-52" tabindex="0" class="svg-dot svg-dot-echo" />
+    <circle r="9.5" cx="720.655" cy="54.6181" id="preview-node-54" tabindex="0" class="svg-dot svg-dot-echo" />
+    <circle r="9.5" cx="157.913" cy="-335.97" id="preview-node-171" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="278.233" cy="-320.023" id="preview-node-235" tabindex="0" class="svg-dot svg-dot-critique" />
+    <circle r="9.5" cx="369.707" cy="160.517" id="preview-node-236" tabindex="0" class="svg-dot svg-dot-critique" />
+    <circle r="9.5" cx="2.11009" cy="641.247" id="preview-node-15" tabindex="0" class="svg-dot svg-dot-critique" />
+    <circle r="9.5" cx="236.041" cy="649.9" id="preview-node-105" tabindex="0" class="svg-dot svg-dot-depart" />
+    <circle r="9.5" cx="105.586" cy="690.194" id="preview-node-29" tabindex="0" class="svg-dot svg-dot-echo" />
+    <circle r="9.5" cx="287.651" cy="542.397" id="preview-node-110" tabindex="0" class="svg-dot svg-dot-critique" />
+    <g data-v-0135f160="" id="g201">
+      <rect class="svg-overlay" id="rect199" width="0" height="0" x="0" y="0" />
+      <!---->
+    </g>
+  </g>
+</svg>

+ 158 - 8
src/pages/Home.vue

@@ -1,21 +1,171 @@
 <template>
   <div class="view-home">
+    <div class="home-library" @click="$router.push('/library')">
+      <div class="wrapper" />
+      <b-button :to="{ name: 'library' }" variant="dark">
+        {{ $t('sections.library') }}
+      </b-button>
+    </div>
+
+    <div class="home-kit" @click="$router.push('/kit')">
+      <div class="wrapper" />
+      <b-button :to="{ name: 'kit' }" variant="kit">
+        {{ $t('sections.kit') }}
+      </b-button>
+    </div>
+
+    <div class="home-creations" @click="$router.push('/gallery')">
+      <div class="wrapper" />
+      <b-button :to="{ name: 'gallery' }" variant="creation">
+        {{ $t('sections.gallery') }}
+      </b-button>
+      <div
+        v-for="(item, i) in [['top', 'left'], ['top', 'right'], ['bottom', 'right'], ['bottom', 'left']]" :key="i"
+        class="home-creations-circle" :class="item"
+      />
+    </div>
   </div>
 </template>
 
 <script>
 export default {
-  name: 'Home',
+  name: 'Home'
+}
+</script>
+
+<style lang="scss" scoped>
+.view-home {
+  width: 100%;
+  height: 100%;
 
-  data () {
-    return {
+  > div {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    position: relative;
+    cursor: pointer;
+
+    .wrapper {
+      position: absolute;
+      opacity: 0.5;
+      height: 100%;
+      width: 100%;
+      pointer-events: none;
     }
-  },
 
-  created () {
+    @include media-breakpoint-up($size-bp) {
+      &:not(:hover) {
+        .wrapper,
+        .btn {
+          display: none;
+        }
+      }
+    }
   }
-}
-</script>
 
-<style lang="scss" scoped>
+  @include media-breakpoint-down($size-bp-down) {
+    display: flex;
+    flex-direction: column;
+
+    > div {
+      height: 100%;
+    }
+  }
+
+  @include media-breakpoint-up($size-bp) {
+    display: grid;
+    grid-template: 'a b'
+                   'a c';
+    grid-template-rows: repeat(2, 1fr);
+    grid-template-columns: repeat(2, 1fr);
+
+    .home-library {
+      grid-area: a;
+    }
+    .home-kit {
+      grid-area: b;
+    }
+    .home-creations {
+      grid-area: c;
+    }
+  }
+
+  .btn {
+    font-family: $font-family-text;
+    border-color: $black;
+    padding: 0 1rem;
+    font-size: 1.75rem;
+    @include media-breakpoint-up($size-bp) {
+      font-size: 2.5rem;
+    }
+    z-index: 1;
+  }
+
+  .home-library {
+    background-image: url('~@/assets/imgs/home-library.svg');
+    background-size: cover;
+    background-position: center;
+    border-bottom: $line;
+    @include media-breakpoint-up($size-bp) {
+      border-bottom: 0;
+      border-right: $line;
+    }
+
+    .wrapper {
+      background-color: $white;
+    }
+  }
+
+  .home-kit {
+    background-image: url('~@/assets/imgs/home-kit.svg');
+    background-size: cover;
+
+    .wrapper {
+      background-color: lighten(theme-color('kit'), 15%);
+    }
+  }
+
+  .home-creations {
+    background-image: url('~@/assets/imgs/home-creations.svg');
+    background-size: contain;
+    background-position: center;
+    background-repeat: no-repeat;
+    border-top: $line;
+
+    @include media-breakpoint-up($size-bp) {
+      background-size: cover;
+    }
+
+    .wrapper {
+      background-color: theme-color('creation');
+    }
+
+    &-circle {
+      position: absolute;
+      z-index: -1;
+      width: 7vmin;
+      height: 7vmin;
+      background-color: #ccc;
+      border-radius: 100%;
+
+      @include media-breakpoint-up($size-bp) {
+        width: 10vmin;
+        height: 10vmin;
+      }
+
+      &.top {
+        top: 0;
+      }
+      &.bottom {
+        bottom: 0;
+      }
+      &.left {
+        left: 0;
+      }
+      &.right {
+        right: 0;
+      }
+    }
+  }
+}
 </style>