From 2ce37bb54b4b25877a60cd625b2c5a8400505883 Mon Sep 17 00:00:00 2001
From: lesion <lesion@autistici.org>
Date: Sun, 3 Mar 2019 01:07:24 +0100
Subject: [PATCH] better export ui and logo

---
 client/public/gancio_logo.svg    | 144 +++++++++++++++++++++++++++++++
 client/src/App.vue               |  63 ++++++--------
 client/src/components/Export.vue | 106 +++++++++++++----------
 3 files changed, 229 insertions(+), 84 deletions(-)
 create mode 100644 client/public/gancio_logo.svg

diff --git a/client/public/gancio_logo.svg b/client/public/gancio_logo.svg
new file mode 100644
index 00000000..db7fc59a
--- /dev/null
+++ b/client/public/gancio_logo.svg
@@ -0,0 +1,144 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<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:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="115.41461mm"
+   height="27.793631mm"
+   viewBox="0 0 115.41461 27.793631"
+   version="1.1"
+   id="svg4662"
+   inkscape:version="0.92.1 r15371"
+   sodipodi:docname="gancio_logo.svg">
+  <defs
+     id="defs4656" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#acacac"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.5"
+     inkscape:cx="935.05166"
+     inkscape:cy="-337.87097"
+     inkscape:document-units="mm"
+     inkscape:current-layer="g4601"
+     showgrid="false"
+     inkscape:window-width="1920"
+     inkscape:window-height="1029"
+     inkscape:window-x="0"
+     inkscape:window-y="1107"
+     inkscape:window-maximized="1"
+     inkscape:pagecheckerboard="false" />
+  <metadata
+     id="metadata4659">
+    <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
+     inkscape:label="Livello 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(276.02814,-32.077815)">
+    <g
+       id="g4558"
+       transform="translate(1.3890529,0.07244553)">
+      <g
+         id="g4601"
+         transform="translate(0,-42.333335)">
+        <g
+           id="g4629-3"
+           transform="translate(-305.51837,-29.938164)">
+          <g
+             transform="translate(0,47.625002)"
+             id="g4603-6" />
+          <g
+             transform="translate(-3.7041668,23.812509)"
+             id="g4627-7">
+            <g
+               id="g4609-5"
+               transform="translate(2.9252966,21.389747)">
+              <path
+                 d="m 124.73699,81.740247 c -0.042,-1.344482 -0.063,-2.773002 -0.063,-4.28554 0,-1.764643 0.042,-3.21416 0.12604,-4.348571 0.042,-0.378133 0.063,-0.735262 0.063,-1.071379 0,-1.17642 -0.25208,-2.037734 -0.75627,-2.583929 -0.46216,-0.58821 -1.21843,-0.882318 -2.26881,-0.882318 h -0.37814 c -2.10076,0.126047 -3.6343,0.189066 -4.60065,0.189066 -1.05038,0 -1.72263,-0.06303 -2.01673,-0.189066 0.0841,1.722621 0.12604,3.31919 0.12604,4.789718 0,0.588211 -0.021,1.176421 -0.063,1.764637 0,0.04202 -0.021,0.399144 -0.063,1.071385 -0.042,0.630226 -0.063,1.134405 -0.063,1.512544 0,1.218436 0.23109,2.20579 0.69325,2.962069 0.50418,0.714256 1.40751,1.071384 2.70998,1.071384 1.89068,0.04202 3.59229,0.06297 5.10484,0.06297 v 0 c 0.12604,0.420148 -0.86131,0.840303 -0.86131,1.260451 0.59102,-0.182249 2.25198,-0.718484 2.31083,-1.323478 z"
+                 style="font-style:normal;font-variant:normal;font-weight:500;font-stretch:normal;font-size:25.39999962px;line-height:1.25;font-family:SoupLeaf;-inkscape-font-specification:'SoupLeaf, Medium';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.26259452"
+                 id="path4605-3"
+                 inkscape:connector-curvature="0"
+                 sodipodi:nodetypes="cscscscscsccscccccc" />
+              <path
+                 sodipodi:nodetypes="ccscscscsccccccc"
+                 inkscape:connector-curvature="0"
+                 id="path4607-5"
+                 style="font-style:normal;font-variant:normal;font-weight:500;font-stretch:normal;font-size:25.39999962px;line-height:1.25;font-family:SoupLeaf;-inkscape-font-specification:'SoupLeaf, Medium';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#ff0000;fill-opacity:1;stroke:none;stroke-width:0.15776582"
+                 d="m 117.1149,61.679053 c -1.43919,0.42444 -2.03367,0.649045 -2.07229,1.182896 0.042,0.485302 0.063,1.000931 0.063,1.546894 0,0.636953 -0.042,1.526455 -0.12604,1.935931 -0.042,0.136488 -0.063,0.2654 -0.063,0.386724 0,0.424633 0.18246,0.349604 0.72145,0.453913 0.5086,0.107876 1.25327,0.272056 2.30364,0.272056 h 0.37813 c 2.10077,-0.0455 3.63431,-0.06824 4.60066,-0.06824 1.05038,0 1.37798,0.974658 1.67208,1.020149 -0.0457,-1.295385 0.31716,-2.9161 0.40768,-4.091524 0,-0.439804 -0.23108,-0.796193 -0.69325,-1.069175 -0.50419,-0.257818 -1.40752,-0.386724 -2.70998,-0.386724 -1.89069,-0.01516 -3.5923,-0.02275 -5.10484,-0.02275 v 0 c -0.41273,-0.497342 0.0725,-0.856932 0.62276,-1.16015 z" />
+            </g>
+            <path
+               transform="translate(0,47.625003)"
+               sodipodi:nodetypes="cscscccccccsssccccssccccccsccccccccc"
+               inkscape:connector-curvature="0"
+               id="path4611-6"
+               style="font-style:normal;font-variant:normal;font-weight:500;font-stretch:normal;font-size:25.39999962px;line-height:1.25;font-family:SoupLeaf;-inkscape-font-specification:'SoupLeaf, Medium';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.26458332"
+               d="m 76.98359,38.242574 c -0.592667,0.338667 -0.837977,0.04028 -1.938644,0.04028 -0.804333,0 -1.672167,-0.105833 -2.6035,-0.3175 -2.328333,-0.508 -4.699,-0.762 -7.112,-0.762 -2.116667,0 -4.219443,0.597132 -4.572,0.762 -0.340875,0.03112 -1.012654,-0.341285 0.365451,-0.567012 0.26732,-0.05131 0.48816,-0.112725 0.602566,-0.206246 0.07353,-0.816118 -2.880962,-0.280435 -2.555517,1.471758 0.169333,0.635 0.275167,1.354667 0.3175,2.159 v 0.0635 0.889 c 3.641547,0.663744 8.545765,-0.506384 9.657068,-0.147837 0.787558,0.254095 0.888412,2.489721 0.385715,2.831895 -1.988477,1.353512 -8.401427,1.363785 -9.286054,0.942899 -0.844467,-0.401779 -0.418064,0.881542 -0.248729,2.024542 0.127,1.100667 0.1905,1.820333 0.1905,2.159 0.211667,1.989667 0.5715,3.788833 1.0795,5.3975 3.048,-0.211667 5.291667,-0.402167 6.731,-0.5715 3.333711,0.01832 3.530728,-0.487574 5.920619,-0.32001 1.179892,0.08273 2.336574,0.241881 3.646192,1.142358 0.715811,0.492183 0.682983,-0.789215 0.672073,-1.193451 -0.26018,-1.429378 -0.103039,-2.38471 -0.178275,-3.375398 -0.825875,-4.154467 -0.753063,-9.0021 -1.073465,-12.422778 z M 66.133782,51.469685 h -0.0635 c -0.211667,-0.423333 -0.3175,-1.312333 -0.3175,-2.667 l 0.0635,-0.0635 c 0.169333,-0.04233 0.529167,-0.105833 1.0795,-0.1905 0.211667,-0.04233 0.486833,-0.0635 0.8255,-0.0635 0.338667,0 1.672167,0.02117 1.883834,0.0635 v 0 l 0.3175,2.6035 v 0.0635 0 c -0.254,0 -1.756834,0.02117 -2.391834,0.0635 -0.677333,0.04233 -1.143,0.105834 -1.397,0.1905 z" />
+            <path
+               transform="translate(0,47.625003)"
+               sodipodi:nodetypes="sscscccsscccccccscccccscccsscscccs"
+               inkscape:connector-curvature="0"
+               id="path4613-2"
+               style="font-style:normal;font-variant:normal;font-weight:500;font-stretch:normal;font-size:25.39999962px;line-height:1.25;font-family:SoupLeaf;-inkscape-font-specification:'SoupLeaf, Medium';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.26458332"
+               d="m 97.168085,54.221352 c 0.838348,-1.067123 0.6985,-4.148667 0.6985,-6.477 0,-2.328333 -0.3175,-4.3815 -0.9525,-6.1595 -1.016,-3.090333 -2.116667,-4.6355 -3.302,-4.6355 -0.127,0 -0.338667,0.04233 -0.635,0.127 -0.254,0.04233 -0.402167,0.0635 -0.4445,0.0635 -0.169333,0.04233 -0.5715,0.127 -1.2065,0.254 -0.635,0.08467 -1.248833,0.169333 -1.8415,0.254 -0.592667,0.08467 -1.058333,0.127 -1.397,0.127 -0.296333,0 -0.529167,-0.02117 -0.6985,-0.0635 -0.677333,-0.254 -1.121833,-0.719667 -1.3335,-1.397 -0.09681,-0.188828 -0.131976,-0.218944 -0.381,-0.1905 -0.635,0.127 -2.0955,0.4445 -4.3815,0.9525 -3.623469,-0.381 -2.513622,8.534263 -2.286,13.589 l 0.1905,4.699 7.874,-0.127 c 0.254,-1.481667 0.381,-3.259667 0.381,-5.334 0,-0.762 -0.02117,-1.439333 -0.0635,-2.032 -0.169333,-2.751667 -0.338667,-4.529667 -0.508,-5.334 v 0 l 0.0635,-0.0635 v 0 c 0.381,-0.127 0.762,-0.1905 1.143,-0.1905 0.465667,0 0.762,0.148167 0.889,0.4445 0.423333,0.931333 0.635,3.132667 0.635,6.604 -0.03639,0.326737 -0.0635,0.552493 -0.0635,0.889 0,0.296333 -0.02117,0.719667 -0.0635,1.27 -0.04233,0.550333 -0.0635,0.931333 -0.0635,1.143 0,1.058333 0.5715,1.651 1.7145,1.778 0.592667,0.04233 1.143,0.0635 1.651,0.0635 0.635,0 1.312333,-0.02117 2.032,-0.0635 l 0.748355,-0.08851 c 1.1219,-0.0845 -0.343517,0.755441 -0.343517,0.755441 0,0 1.075474,0.248947 1.944662,-0.857431 z" />
+            <path
+               transform="translate(0,47.625003)"
+               inkscape:connector-curvature="0"
+               id="path4615-9"
+               style="font-style:normal;font-variant:normal;font-weight:500;font-stretch:normal;font-size:25.39999962px;line-height:1.25;font-family:SoupLeaf;-inkscape-font-specification:'SoupLeaf, Medium';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.26458332"
+               d="m 144.74231,37.865848 c 0.67677,0.05658 1.21623,0.713304 0.7936,0.755671 v 0 c -1.94733,0 -3.81,-0.08467 -5.588,-0.254 -0.46567,-0.04233 -1.56633,-0.1905 -3.302,-0.4445 -1.69333,-0.254 -2.96333,-0.381 -3.81,-0.381 -2.286,0 -3.59833,0.804333 -3.937,2.413 v 0 0 0 0 0 c -0.381,0.635 -0.0423,2.518833 -0.0423,5.6515 v 1.397 c 0.127,5.461 0.29633,8.403167 1.56633,8.8265 0.127,0.04233 0.254,0.0635 0.381,0.0635 0.127,0 0.78317,-0.148167 1.9685,-0.4445 1.18533,-0.338667 2.43417,-0.508 3.7465,-0.508 0.381,0 0.86783,0.02117 1.4605,0.0635 0.508,0.04233 1.16417,0.105833 1.9685,0.1905 0.80433,0.08467 1.48167,0.148167 2.032,0.1905 0.59267,0.04233 1.10067,0.0635 1.524,0.0635 1.94733,0 2.94217,-0.592667 2.9845,-1.778 0.0423,-0.465667 0.0635,-0.889 0.0635,-1.27 0,-0.677333 -0.0423,-1.883833 -0.127,-3.6195 -0.0423,-1.735667 -0.0635,-3.005667 -0.0635,-3.81 0,-1.227667 0.0423,-2.074333 0.127,-2.54 0.16933,-0.762 0.27517,-1.397 0.3175,-1.905 v -0.0635 c 1.04195,-2.143001 -0.15974,-2.071757 -0.58855,-2.447681 -3.29195,-1.671465 -3.46421,-0.315774 -1.47505,-0.14949 z m -6.3184,13.455671 h -0.3175 c -0.635,0.04233 -1.0795,0.08467 -1.3335,0.127 h -0.0635 v -2.794 -0.0635 0 c 0.46567,-0.127 0.97367,-0.1905 1.524,-0.1905 h 0.127 c 0.59267,0.04233 0.97367,0.0635 1.143,0.0635 v 0 0.0635 0 c 0.0847,0.635 0.127,1.227667 0.127,1.778 0,0.508 -0.0423,0.867833 -0.127,1.0795 v 0.0635 l -0.0635,-0.0635 v 0 c -0.16933,-0.04233 -0.508,-0.0635 -1.016,-0.0635 z"
+               sodipodi:nodetypes="sccccsccccccscsscscscscscsccccssccccccscccccsccccs" />
+            <path
+               transform="translate(0,47.625003)"
+               sodipodi:nodetypes="ccccscsccccccscccccsscsscccscccc"
+               inkscape:connector-curvature="0"
+               id="path4617-1"
+               style="font-style:normal;font-variant:normal;font-weight:500;font-stretch:normal;font-size:25.39999962px;line-height:1.25;font-family:SoupLeaf;-inkscape-font-specification:'SoupLeaf, Medium';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.26386419"
+               d="m 113.41865,34.862971 c 0.27611,0.77181 1.38276,1.788884 1.57103,3.748148 -0.76664,-0.111392 -0.17479,-0.05401 -0.7371,-0.04986 -0.84437,0 -1.77317,-0.105539 -2.7864,-0.316636 -2.61753,-0.633273 -5.19285,-0.94991 -7.72595,-0.94991 -2.82864,0 -4.45404,0.464401 -4.87622,1.393201 -0.33774,0.717713 -0.50662,1.878717 -0.50662,3.48301 0,0.759928 0.0422,1.604295 0.12665,2.533085 0.0422,0.886585 0.12665,1.857613 0.25332,2.913066 0.0845,1.01324 0.14776,1.73095 0.18997,2.15313 0.12666,2.026474 0.42218,3.862968 0.88659,5.509481 3.30386,-0.09618 6.42529,-0.46272 9.87909,-0.759922 0.88658,0 1.70984,0.04222 2.46977,0.126649 0.75992,0.04222 1.41431,0.06327 1.96314,0.06327 0.92881,0 1.17291,-0.08444 1.46844,-0.253312 0.33775,-0.211093 0.61216,-0.591054 0.82326,-1.139902 v 0 l 0.0633,-0.06327 c 0,-0.675491 0.0211,-1.350988 0.0633,-2.026481 -1.85761,-0.506616 -4.02265,-0.759921 -7.23123,-0.759921 h -1.32987 c -0.42219,0 -0.78104,0.02105 -1.07657,0.06327 h -0.44329 c -0.16888,0 -0.25331,-0.189981 -0.25331,-0.569941 0,-0.464405 -0.0172,-1.655752 0.27837,-2.58455 1.29317,-0.233942 1.50635,-0.161062 1.7481,-0.159634 0.33775,0 2.34312,0.105539 6.0161,0.316629 h 0.12666 c 0.88658,0 1.51986,0.2111 1.89982,-0.422173 0.37997,-0.675498 0.59106,-1.350989 0.63328,-2.026481 0,-1.055453 -0.0225,-2.917481 -0.14917,-5.492795 -0.49568,-2.772882 -1.82493,-3.79722 -3.34452,-4.728181 z" />
+            <g
+               transform="translate(0,1.0583333)"
+               id="g4625-2">
+              <path
+                 id="path4619-7"
+                 transform="scale(0.26458333)"
+                 d="m 214.45117,317.70508 c -11.17785,0.12645 -1.97461,2.4707 -1.97461,2.4707 0.5209,-0.0102 2.12086,-0.88425 2.60352,0.20313 0.26759,0.60286 -0.0748,1.82552 -1.45899,1.83203 h -5.51953 c -4.96,0 -9.59992,-0.16046 -13.91992,-0.48047 -11.68,-1.12 -19.04008,-1.67969 -22.08008,-1.67969 -11.51999,0 -17.68046,2.55969 -18.48047,7.67969 -0.96,4.96 -1.43945,13.04023 -1.43945,20.24023 0,4.64 0.2407,9.27992 0.7207,13.91992 1.6,11.52001 0.87465,10.20499 4.56055,12.88086 5.95738,4.32492 14.39813,0.56055 22.07813,0.56055 h 0.24023 c 3.52,0 12.48086,-1.52055 14.88086,-0.56055 2.40375,0.40125 3.76805,-0.0327 4.56055,2.63868 1.01305,2.48837 1.88809,11.33815 1.19922,11.92187 -6.11795,3.16753 -15.65105,2.86885 -21.59961,3.19922 -2.72001,0.15999 -5.04094,0.24023 -6.96094,0.24023 -2.146,0 -3.82486,-0.13999 -5.15235,-0.3164 v 10.4043 c 4.6584,1.32321 9.90901,2.30468 15.89063,2.30468 4.32,0 8.3825,-0.71367 12.0625,-1.51367 10.24,-2.08 19.35937,-6.63969 27.35937,-13.67969 -0.63999,-6.72 -0.95898,-19.6789 -0.95898,-26.8789 0,-3.68 0.0803,-7.20055 0.24023,-10.56055 0.32002,-3.52 0.47852,-7.52 0.47852,-12 -0.0979,-5.3278 1.06159,-13.42096 -0.71875,-17.59961 -0.63059,-1.48005 -1.53866,-2.43226 -2.11523,-3.26758 -0.49509,-0.71725 -1.23668,-1.43299 -1.98047,-1.95312 -0.93513,-0.0126 -1.77044,-0.0143 -2.51563,-0.006 z m -18.58984,31.22656 c 0.8,1.6 1.28141,6.96008 1.4414,12.08008 v 0.24023 c -0.63999,0.15999 -2.00008,0.39875 -4.08007,0.71875 -1.44,0.15999 -9.55588,0.24024 -8.32032,0.24024 h -1.67968 -0.24024 -0.24023 l -1.43946,-11.83985 0.23829,-0.24023 c 1.28,-0.15999 6.96101,-0.32048 9.04101,-0.48047 2.72,-0.15999 4.4793,-0.39875 5.2793,-0.71875 z"
+                 style="font-style:normal;font-variant:normal;font-weight:500;font-stretch:normal;font-size:25.39999962px;line-height:1.25;font-family:SoupLeaf;-inkscape-font-specification:'SoupLeaf, Medium';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.99999994"
+                 inkscape:connector-curvature="0"
+                 sodipodi:nodetypes="ccccscscscassccccsccsccscccccccccccsccccccc" />
+              <g
+                 style="fill:#ff0000"
+                 id="g4623-0"
+                 transform="matrix(-0.05837501,0.25245606,-0.25245606,-0.05837501,111.30736,132.11782)">
+                <path
+                   sodipodi:nodetypes="cccsccccssccccccccscsccccscccc"
+                   id="path4621-9"
+                   transform="matrix(-0.23003668,-0.99484615,0.99484615,-0.23003668,-399.99545,533.38826)"
+                   d="m 164.75391,300.12109 c -3.24373,-0.0303 -6.11471,0.11966 -9.08594,0.44532 -18.35072,2.01124 -28.09411,10.14145 -33.32227,27.80273 -2.6272,8.875 -2.82125,22.83155 -0.63867,32.31445 1.58264,6.87629 3.85109,12.39088 7.49609,18.22266 3.58528,5.73621 7.79754,10.08127 13.26368,13.68359 4.77225,3.14504 12.34952,7.019 19.76953,9.14649 v -10.13867 c -3.53307,-0.904 -6.47332,-1.86856 -8.15821,-2.91993 -7.43035,-4.63653 -11.84095,-8.9198 -15.6914,-14.55859 -4.8805,-7.14724 -7.01189,-19.5916 -6.74805,-28.5293 0.0988,-3.34042 1.62817,-15.4335 2.95703,-18.24804 2.69245,-5.70267 4.69314,-9.15557 9.09375,-11.87305 6.5257,-3.76431 13.56281,-6.88759 28.22657,-5.90625 0.11861,0.0736 -4.60161,3.38467 -6.08008,4.93945 -2.3994,2.52323 -3.10156,3.78516 -3.10156,3.78516 -0.0161,0.0996 4.54165,-1.93431 6.35546,-2.87305 4.45264,-2.30444 8.02967,-4.57269 9.46875,-5.07422 0.74639,-0.11144 7.60841,-1.45597 15.38282,-2.23242 22.78632,-2.27574 24.21952,-2.50438 20.27343,-3.23047 -7.74703,-1.42545 -16.55392,-2.52304 -24.16992,-3.01367 -3.02668,-0.19498 -9.31417,-0.69271 -13.97265,-1.10547 -4.45786,-0.39497 -8.07464,-0.60645 -11.31836,-0.63672 z m -12.52149,4.77344 c 1.24553,-0.031 2.52435,0.0214 3.83203,0.16211 1.97529,0.21249 1.83203,0.58511 -0.33007,0.85547 -11.18977,1.39922 -20.74431,6.18752 -25.23047,14.72656 -0.43702,0.83185 -0.8817,1.4934 -0.98829,1.46875 -0.32103,-0.0742 0.58228,-3.32965 1.42188,-5.125 3.51572,-7.51775 12.57624,-11.87076 21.29492,-12.08789 z"
+                   style="fill:#ff0000;stroke-width:0.25911719"
+                   inkscape:connector-curvature="0" />
+              </g>
+            </g>
+          </g>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/client/src/App.vue b/client/src/App.vue
index ae3c560e..f27772e7 100644
--- a/client/src/App.vue
+++ b/client/src/App.vue
@@ -1,42 +1,27 @@
 <template lang='pug'>
   #app
     b-navbar(type="dark" variant="dark" toggleable='lg')
-      b-navbar-brand(to='/') Gancio 
+      b-navbar-brand(to='/') <img id='logo' src='gancio_logo.svg'/>
       b-navbar-toggle(target='nav_collapse')
       b-collapse#nav_collapse(is-nav)
-        b-navbar-nav.ml-auto(v-if='logged')
-          b-nav-item(to='/new_event') <v-icon color='lightgreen' name='plus'/> {{$t('Add Event')}}
-          b-nav-item(to='/settings') <v-icon color='orange' name='cog'/> {{$t('Settings')}}
-          b-nav-item(v-if='user.is_admin' to='/admin') <v-icon color='lightblue' name='tools'/> {{$t('Admin')}}
-          b-nav-item(variant='danger' @click='logout') <v-icon color='red' name='sign-out-alt'/> {{$t('Logout')}}
-        b-navbar-nav.ml-auto(v-else)
-          b-nav-item(@click='search=!search') <v-icon color='lightgreen' name='search'/> {{$t('Search')}}
-          b-nav-item(to='/register') {{$t('Register')}}
-          b-nav-item(to='/login') {{$t('Login')}}
-    transition(name='toggle')
-      b-navbar#search(type='dark' variant="dark" toggleable='lg')
-        b-navbar-toggle(target='nav_search')
-          v-icon(name='search')
-        b-collapse#nav_search(is-nav)
-          <template slot="button-content"><em>User</em></template>
-
-          b-navbar-nav
-            b-nav-form
-              typeahead.ml-1.mt-1(v-model='filters_places' 
-                textField='name' valueField='name'
-                updateOnMatchOnly
-                :data='places' multiple placeholder='Luogo')
-            b-nav-form
-              typeahead.ml-1.mt-1(v-model='filters_tags'
-                updateOnMatchOnly
-                textField='tag' valueField='tag'
-                :data='tags' multiple placeholder='Tags')
-          b-navbar-nav.ml-auto(variant='dark')
-            b-nav-item(to='/export/feed' href='#') <v-icon color='orange' name='rss'/> feed
-            b-nav-item(to='/export/ics') <v-icon color='orange' name='calendar'/> cal
-            b-nav-item(to='/export/email') <v-icon color='orange' name='envelope'/> mail
-            b-nav-item(to='/export/embed') <v-icon color='orange' name='code'/> embed
-            b-nav-item(to='/export/print') <v-icon color='orange' name='print'/> print
+        b-navbar-nav(v-if='logged')
+          b-nav-item(to='/new_event' v-b-tooltip :title='$t("Add Event")' ) <v-icon color='lightgreen' name='plus' scale='2'/> 
+          b-nav-item(to='/settings' v-b-tooltip :title='$t("Settings")') <v-icon color='orange' name='cog' scale='2'/>
+          b-nav-item(v-if='user.is_admin' to='/admin' v-b-tooltip :title='$t("Admin")') <v-icon color='lightblue' name='tools' scale='2'/>
+          b-nav-item(to='/export' v-b-tooltip :title='$t("Export")') <v-icon name='file-export' scale='2' color='yellow'/>
+          b-nav-item(variant='danger' @click='logout' v-b-tooltip :title='$t("Logout")') <v-icon color='red' name='sign-out-alt' scale='2'/>
+        b-navbar-nav#search.ml-auto
+          b-nav-item <v-icon name='search' color='orange' scale='2'/>
+          b-nav-form
+            typeahead.ml-1.mt-1(v-model='filters_places' 
+              textField='name' valueField='name'
+              updateOnMatchOnly
+              :data='places' multiple placeholder='Luogo')
+          b-nav-form
+            typeahead.ml-1.mt-1(v-model='filters_tags'
+              updateOnMatchOnly
+              textField='tag' valueField='tag'
+              :data='tags' multiple placeholder='Tags')
     Home
     transition(name="fade" mode="out-in")
       router-view(name='modal')
@@ -84,10 +69,12 @@ export default {
 </script>
 
 <style>
-#footer {
-  position: absolute;
-  width: 100%;
-  bottom: 0px;
+#logo {
+  max-height: 60px;
+}
+
+.navbar-brand {
+  padding: 0px;
 }
 
 #search,
diff --git a/client/src/components/Export.vue b/client/src/components/Export.vue
index 626858c3..35f2146f 100644
--- a/client/src/components/Export.vue
+++ b/client/src/components/Export.vue
@@ -1,39 +1,56 @@
 <template lang="pug">
   b-modal(hide-footer hide-header
     @hide='$router.replace("/")' size='lg' :visible='true' v-if='type')
-    h3.text-center Export {{type}}
-    b-input-group.mb-2(v-if='showLink')
-      b-form-input( v-model='link' autocomplete='off')
-      b-input-group-append
-        b-button(variant="success" v-clipboard:copy="link") <v-icon name='clipboard'/> Copy 
+    h3.text-center Export
     p {{$t('export_intro')}}
-    p(v-html='$t(`export_${type}_explanation`)')
-    li(v-if='filters.tags.length') {{$t('Tags')}} ->
-      b-badge.ml-1(v-for='tag in filters.tags') {{tag}}
-    li(v-if='filters.places.length') {{$t('Places')}}
+    
+    li(v-if='filters.tags.length') {{$t('Tags')}}:
+      b-badge.ml-1(:style='{backgroundColor: tag.color}' v-for='tag in filters.tags') {{tag}}
+    li(v-if='filters.places.length') {{$t('Places')}}:
       b-badge.ml-1(v-for='place in filters.places') {{place}}
-    b-form(v-if="type==='email'")
-      el-switch(v-model='mail.sendOnInsert' :active-text="$t('notify_on_insert')")
-      br
-      el-switch(v-model='mail.reminder' :active-text="$t('send_reminder')") 
-      b-form-input.mt-1(v-model='mail.mail' :placeholder="$t('Insert your address')")
-      b-button.mt-1.float-right(variant='success' @click='activate_email') {{$t('Send')}}
+    b-tabs(pills vertical)
+      b-tab.pt-1(title='feed rss' :active="type === 'feed'" @click='type="feed"')
+        p(v-html='$t(`export_feed_explanation`)')
+        b-input-group.mb-2(v-if='showLink')
+          b-form-input( v-model='link' autocomplete='off')
+          b-input-group-append
+            b-button(variant="success" v-clipboard:copy="link") <v-icon name='clipboard'/> Copy 
 
-    div(v-if="type==='embed'"  style='max-width: 400px;')
-      el-switch(v-model='export_list' :active-text="$t('export_list')")
-      b-card(v-if='export_list' no-body header='Eventi')
-        b-list-group(flush)
-          b-list-group-item.flex-column.align-items-start(v-for="event in filteredEvents" 
-            :href='`/event/${event.id}`')
-              b-media
-                img(v-if='event.image_path' slot="aside" :src="imgPath(event)" alt="Media Aside" style='max-height: 60px')
-                small.float-right {{event.start_datetime|short_datetime}}
-                h5.mb-1 {{event.title}}
-              b-badge.float-right.ml-1(v-for='tag in event.tags') {{tag.tag}}
-              small.float-right(v-b-popover.hover='event.place.address') {{event.place.name}}
-      Calendar(v-else)
-      br
-      b-form-textarea(v-model='script')
+      b-tab.pt-1(title='ics/ical' :active="type === 'ics'" @click='type="ics"')
+        p(v-html='$t(`export_ical_explanation`)')
+        b-input-group.mb-2(v-if='showLink')
+          b-form-input( v-model='link' autocomplete='off')
+          b-input-group-append
+            b-button(variant="success" v-clipboard:copy="link") <v-icon name='clipboard'/> Copy 
+
+      b-tab.pt-1(title='email' :active="type === 'email'" @click='type="email"')
+        p(v-html='$t(`export_email_explanation`)')
+        b-form
+          el-switch(v-model='mail.sendOnInsert' :active-text="$t('notify_on_insert')")
+          br
+          el-switch(v-model='mail.reminder' :active-text="$t('send_reminder')") 
+          b-form-input.mt-1(v-model='mail.mail' :placeholder="$t('Insert your address')")
+          b-button.mt-1.float-right(variant='success' @click='activate_email') {{$t('Send')}}
+
+      b-tab.pt-1(title='list' :active="type === 'list'" @click='type="list"')
+        p(v-html='$t(`export_list_explanation`)')
+        b-card.mb-1(no-body header='Eventi')
+          b-list-group#list(flush)
+            b-list-group-item.flex-column.align-items-start(v-for="event in filteredEvents" 
+              :to='`/event/${event.id}`')
+                //- b-media
+                  img(v-if='event.image_path' slot="aside" :src="imgPath(event)" alt="Media Aside" style='max-height: 60px')
+                small.float-right {{event.start_datetime|datetime}}
+                strong.mb-1 {{event.title}}
+                br
+                small.float-right {{event.place.name}}
+                b-badge.float-left.ml-1(:style='{backgroundColor: tag.color}' v-for='tag in event.tags') {{tag.tag}}
+        b-form-textarea(v-model='script')
+
+      b-tab.pt-1(title='calendar' :active="type === 'calendar'" @click='type="calendar"')
+        p(v-html='$t(`export_calendar_explanation`)')
+        Calendar
+        b-form-textarea(v-model='script')
 
 </template>
 <script>
@@ -49,7 +66,7 @@ export default {
   components: { Calendar },
   data () {
     return {
-      type: '',
+      type: 'feed',
       link: '',
       mail: {},
       export_list: true,
@@ -58,10 +75,11 @@ export default {
   },
   filters,
   mounted () {
-    this.type = this.$route.params.type
     this.link = this.loadLink()
-    if (this.type === 'email' && this.logged) {
-      this.mail.mail = this.user.email
+  },
+  watch: {
+    type (value) {
+      this.link = this.loadLink()
     }
   },
   methods: {
@@ -91,18 +109,7 @@ export default {
   computed: {
     ...mapState(['filters', 'user', 'logged', 'events']),
     filteredEvents () {
-      if (!this.filters.tags.length && !this.filters.places.length) return this.events
-      return this.events.filter(e => {
-        if (this.filters.tags.length) {
-          const m = intersection(e.tags.map(t => t.tag), this.filters.tags)
-          if (m.length>0) return true
-        }
-        if (this.filters.places.length) {
-          if (this.filters.places.find(p => p === e.place.name))
-            return true
-        }
-        return 0
-      })
+      return this.$store.getters.filteredEvents.filter(e => !e.past)
     },
     showLink () {
       return (['feed', 'ics'].indexOf(this.type)>-1)
@@ -110,4 +117,11 @@ export default {
   }
 }
 </script>
+<style>
+#list {
+  max-height: 400px;
+  overflow-y: scroll;
+}
+</style>
+