Merge pull request #1233 from umap-project/edit-header-revamp

Edit header revamp

umap/static/umap/img/16-white.svg

@@ -1,4 +1,9 @@
 <svg id="svg2" width="144" height="144" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
+ <defs id="defs4">
+  <clipPath id="clip0_241_10857">
+   <rect id="rect586" width="18.05" height="19.01" fill="#fff"/>
+  </clipPath>
+ </defs>
  <metadata id="metadata7">
   <rdf:RDF>
    <cc:Work rdf:about="">
@@ -31,7 +36,6 @@
   <g id="text4356" transform="translate(-4 -172)" fill="#4d4d4d">
    <path id="path4384" d="m35.742 999.44 3.0762-3.0762-3.0664-3.0664 1.1914-1.1914 3.0664 3.0664 3.0566-3.0566 1.1719 1.1816-3.0469 3.0566 3.0664 3.0664-1.1914 1.1914-3.0664-3.0664-3.0762 3.0762-1.1816-1.1816" fill="#f2f2f2" stroke="#999" stroke-width=".25"/>
   </g>
-  <path id="path4384-3" d="m11.192 853.36 2e-6 -4.1999-4.1923 1e-5 -3e-6 -1.6267h4.1923v-4.1733l1.6088 7e-3 0.0067 4.1666h4.1923l-3.9e-5 1.6266-4.1922 4e-5 -1.5e-5 4.1999h-1.6155" fill="#4d4d4d"/>
   <path id="path3684" d="m63.714 866.36-1.1428 1.1429 2.2857 2.2857 1.1428-1.1429zm-1.7143 1.7143-6.2857 6.2857 2.2857 2.2857 6.2857-6.2857zm-6.2857 6.2857-1.7143 4 4-1.7143z" fill="#f2f2f2" stroke="#999" stroke-width=".25"/>
   <text id="text4457-6" x="41.647079" y="916.79706" fill="#000000" font-family="sans-serif" letter-spacing="0px" word-spacing="0px" style="line-height:0%" xml:space="preserve"><tspan id="tspan4459-6" x="41.647079" y="916.79706" font-family="sans-serif" font-size="30.476px" style="line-height:1.25"> </tspan></text>
   <g id="text4356-2" transform="translate(44 -124)" fill="#fff">
@@ -130,7 +134,6 @@
   <rect id="rect4241-8-2" x="85" y="901.36" width="2" height="2" fill="#f2f2f2"/>
   <rect id="rect4243-2-5" x="89" y="901.36" width="2" height="2" fill="#f2f2f2"/>
   <path id="delete-30-7" d="m131 937.36v1c-1.4286 0-3.2857 0.5999-4 2v1h10v-1c-0.71429-1.4001-2.5714-2-4-2v-1zm-4 5 2 9h6l2-9z" fill="#b3b3b3" stroke="#999" stroke-width=".25"/>
-  <path id="path349" d="m60.059 945.66c1.5887 0 3.1118 0.6337 4.2352 1.7571 1.1234 1.1232 1.7553 2.6464 1.7571 4.2352 0 0.238-0.12691 0.4577-0.3329 0.5766-0.20598 0.1189-0.45982 0.1189-0.66579 0-0.20598-0.1189-0.33291-0.3386-0.33291-0.5766 0-1.6651-0.88828-3.2037-2.3303-4.0363-1.442-0.8324-3.2186-0.8324-4.6606 0-1.442 0.8326-2.3303 2.3712-2.3303 4.0363 0 0.238-0.12692 0.4577-0.3329 0.5766s-0.45982 0.1189-0.6658 0c-0.20598-0.1189-0.3329-0.3386-0.3329-0.5766 0.0018-1.5887 0.63368-3.1118 1.7571-4.2352 1.1232-1.1234 2.6464-1.7553 4.2352-1.7571zm0-0.6658c-0.88292 0-1.7296-0.3507-2.3539-0.9751-0.62432-0.6243-0.97507-1.471-0.97507-2.3539s0.35073-1.7296 0.97507-2.3539c0.62433-0.6244 1.471-0.9751 2.3539-0.9751 0.88292 0 1.7296 0.3507 2.3539 0.9751 0.62432 0.6243 0.97506 1.471 0.97506 2.3539-8.2e-4 0.8826-0.35206 1.7288-0.97624 2.3528-0.62402 0.6241-1.4701 0.9752-2.3527 0.9762zm0-1.3316c0.52982 0 1.0378-0.2105 1.4124-0.5849 0.37451-0.3747 0.58494-0.8827 0.58494-1.4125s-0.21043-1.0377-0.58494-1.4124c-0.37466-0.3745-0.88262-0.585-1.4124-0.585-0.52982 0-1.0378 0.2105-1.4124 0.585-0.37451 0.3747-0.58495 0.8826-0.58495 1.4124s0.21044 1.0378 0.58495 1.4125c0.37466 0.3744 0.88262 0.5849 1.4124 0.5849z" fill="#f2f2f2" stroke="#999" stroke-width=".178"/>
   <path id="path437" d="m113.29 943.47 0.9072 0.5491c0.1786 0.10817 0.2366 0.34196 0.1294 0.52223-0.0319 0.0535-0.0764 0.0983-0.1294 0.13055l-7.0072 4.2412-7.0071-4.2412c-0.17869-0.10817-0.23664-0.34196-0.12942-0.52222 0.0319-0.0536 0.0763-0.0984 0.12942-0.13056l0.90714-0.5491 6.0999 3.6922zm0 3.578 0.9072 0.5491c0.1786 0.1081 0.2366 0.3419 0.1294 0.5222-0.0319 0.0535-0.0764 0.0983-0.1294 0.1306l-6.6189 4.0061c-0.239 0.1447-0.53753 0.1447-0.77652 0l-6.6188-4.0061c-0.17869-0.1082-0.23664-0.342-0.12942-0.5223 0.0319-0.0536 0.0763-0.0984 0.12942-0.1305l0.90714-0.5491 6.0999 3.6921zm-5.7117-10.575 6.6189 4.0062c0.1786 0.10815 0.2366 0.34196 0.1294 0.52222-0.0319 0.0536-0.0764 0.0984-0.1294 0.13056l-7.0072 4.2412-7.0071-4.2412c-0.17869-0.10815-0.23664-0.34196-0.12942-0.52222 0.0319-0.0536 0.0763-0.0984 0.12942-0.13056l6.6188-4.0062c0.23899-0.14465 0.53752-0.14465 0.77652 0z" fill="#f2f2f2" stroke="#999" stroke-width=".178"/>
   <path id="linestring" d="m7 937.36v2h1.8828l6.1172 3.0586v0.23438l-6.707 6.707h-1.293v2h2v-1.293l6.707-6.707h1.293v-2h-1.8828l-6.1172-3.0586v-0.94141z" color="#000000" fill="#f2f2f2" fill-rule="evenodd" stroke="#999" stroke-width=".2"/>
   <path id="polygon" d="m29 936.36v2h0.92773l-0.85547 12h-1.0723v2h2v-1.1992l8-1.6016v0.80078h2v-2h-0.77734l1.5547-7h1.2227v-2h-2v0.72656l-9-2.4531v-1.2734h-2z" fill="#f2f2f2" fill-rule="evenodd" stroke="#999" stroke-width=".2"/>
@@ -138,5 +141,11 @@
   <g id="settings" class="sprite" transform="matrix(.16295 0 0 .16296 27.835 912.23)" fill="#f2f2f2" stroke="#999" stroke-width="1.4974">
    <path id="path27812" d="m98.762 43.652c-0.186-1.386-1.481-2.582-2.876-2.659l-6.172-0.337c-1.395-0.076-2.899-1.224-3.341-2.55l-2.28-5.518c-0.629-1.249-0.379-3.121 0.553-4.161l4.122-4.6c0.933-1.042 0.962-2.77 0.066-3.842l-8.813-8.813c-1.073-0.897-2.803-0.867-3.845 0.065l-4.598 4.122c-1.039 0.934-2.915 1.182-4.161 0.551l-5.521-2.279c-1.324-0.442-2.472-1.945-2.549-3.34l-0.337-6.17c-0.077-1.396-1.272-2.691-2.659-2.878 0 0-3.252-0.44-6.248-0.44-2.991 0-6.243 0.44-6.243 0.44-1.386 0.188-2.582 1.483-2.658 2.878l-0.338 6.17c-0.076 1.396-1.224 2.898-2.551 3.34l-5.517 2.279c-1.249 0.631-3.122 0.382-4.161-0.551l-4.601-4.122c-1.042-0.932-2.769-0.962-3.842-0.065l-8.813 8.813c-0.897 1.073-0.867 2.801 0.066 3.842l4.122 4.6c0.933 1.041 1.182 2.913 0.551 4.161l-2.279 5.518c-0.442 1.326-1.946 2.474-3.34 2.55l-6.17 0.337c-1.396 0.077-2.691 1.272-2.879 2.659 0 0-0.439 3.253-0.439 6.243s0.44 6.24 0.44 6.24c0.188 1.389 1.483 2.582 2.879 2.659l6.169 0.339c1.396 0.075 2.898 1.225 3.341 2.549l2.278 5.517c0.631 1.248 0.381 3.122-0.551 4.163l-4.122 4.598c-0.933 1.042-0.963 2.771-0.066 3.845l8.814 8.813c1.073 0.896 2.801 0.866 3.842-0.066l4.6-4.122c1.041-0.932 2.913-1.182 4.161-0.553l5.517 2.28c1.327 0.441 2.475 1.946 2.55 3.343l0.338 6.168c0.076 1.395 1.272 2.692 2.658 2.88 0 0 3.252 0.439 6.244 0.439 2.996 0 6.25-0.439 6.25-0.439 1.385-0.188 2.58-1.485 2.657-2.88l0.337-6.168c0.077-1.396 1.225-2.901 2.551-3.343l5.517-2.28c1.248-0.629 3.122-0.379 4.163 0.553l4.598 4.122c1.042 0.933 2.771 0.964 3.843 0.067l8.815-8.814c0.896-1.073 0.866-2.803-0.066-3.845l-4.122-4.598c-0.932-1.041-1.182-2.915-0.553-4.163l2.28-5.517c0.441-1.324 1.946-2.474 3.341-2.549l6.172-0.339c1.395-0.077 2.692-1.271 2.876-2.659 0 0 0.441-3.25 0.441-6.24s-0.441-6.243-0.441-6.243zm-48.658 18.709c-6.886 0-12.468-5.585-12.468-12.467 0-6.885 5.582-12.467 12.468-12.467 6.89 0 12.475 5.582 12.475 12.467-1e-3 6.882-5.586 12.467-12.475 12.467z" fill="#f2f2f2" stroke="#999" stroke-width="1.4974"/>
   </g>
+  <g id="undo" transform="matrix(.71301 0 0 .66261 53.494 938.13)" clip-path="url(#clip0_241_10857)" fill="none" stroke="#f2f2f2" stroke-miterlimit="10" stroke-width="1.4549">
+   <path id="path580" d="m1.07 4.41h9.42c0.9234-0.0066 1.8391 0.16957 2.6941 0.5184 0.8551 0.34883 1.6327 0.8634 2.288 1.5141s1.1754 1.4246 1.5303 2.2771c0.3549 0.85256 0.5376 1.767 0.5376 2.6904 0.0067 0.9277-0.1712 1.8474-0.5231 2.7058-0.3519 0.8583-0.871 1.6382-1.527 2.2941-0.656 0.656-1.4358 1.1751-2.2941 1.527-0.8584 0.352-1.7781 0.5298-2.7058 0.5231h-9.42"/>
+   <path id="path582" d="m4.75 8.45-4.04-4.05 4.04-4.05"/>
+  </g>
+  <path id="path438" d="m9 849.94v4.05c0 0.20708 0.1679 0.375 0.375 0.375h5.25c0.20708 0 0.375-0.16792 0.375-0.375v-4.05c0-0.20708-0.16792-0.375-0.375-0.375h-5.25c-0.2071 0-0.375 0.16792-0.375 0.375z" fill="none" stroke="#f2f2f2"/>
+  <path id="save" d="m15.213 842.36h-8.8376c-0.2071 0-0.375 0.1679-0.375 0.37499v11.25c0 0.20708 0.1679 0.375 0.375 0.375h11.25c0.20708 0 0.375-0.16792 0.375-0.375v-8.6766c0-0.0953-0.0363-0.18697-0.1014-0.25648l-2.4124-2.5733c-0.07095-0.0756-0.16995-0.11853-0.2736-0.11853z" fill="none" stroke="#f2f2f2"/>
  </g>
 </svg>

umap/static/umap/img/logo_small.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="35" height="35" viewBox="0 0 35 35" fill="none" version="1.1" id="svg15" sodipodi:docname="logo_small.svg" inkscape:version="1.2.2 (b0a8486541, 2022-12-01)" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview id="namedview17" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:showpageshadow="2" inkscape:pageopacity="0.0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" showgrid="false" inkscape:zoom="22.25" inkscape:cx="12.94382" inkscape:cy="17.325843" inkscape:window-width="1920" inkscape:window-height="1019" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" inkscape:current-layer="svg15" />
+  <rect x="0" y="0" width="35" height="35" rx="17.5" fill="#f2f2f2" stroke="#F2F2F2" stroke-width="0.5" id="rect2" style="stroke:none" />
+  <g clip-path="url(#clip0_217_11335)" id="g8" transform="translate(0.09990314,-0.7800653)">
+    <path d="m 12.2438,6.86133 c -2.46004,1.16961 -4.44899,3.14137 -5.63988,5.59127 -1.19088,2.4498 -1.51282,5.232 -0.9129,7.8891 0.59991,2.6571 2.08599,5.031 4.21394,6.7315 2.12794,1.7005 4.77114,2.6265 7.49514,2.6256 -9.28126,-8.6625 -11.41876,-19.35 -5.1563,-22.83747 z m 5.1563,22.83747 c 2.724,9e-4 5.3672,-0.9251 7.4951,-2.6256 2.128,-1.7005 3.6141,-4.0744 4.214,-6.7315 0.5999,-2.6571 0.2779,-5.4393 -0.9129,-7.8891 -1.1909,-2.4499 -3.1799,-4.42166 -5.64,-5.59127 6.2625,3.48747 4.125,14.17497 -5.1562,22.83747 z" fill="#323e56" id="path4" />
+    <path d="m 21.8439,12.0365 c 0,0.5836 -0.1149,1.1614 -0.3382,1.7006 -0.2234,0.5391 -0.5507,1.029 -0.9633,1.4416 -0.4127,0.4127 -0.9025,0.74 -1.4417,0.9633 -0.5391,0.2233 -1.117,0.3383 -1.7005,0.3383 -0.5836,0 -1.1614,-0.115 -1.7006,-0.3383 -0.5391,-0.2233 -1.029,-0.5506 -1.4416,-0.9633 -0.4127,-0.4126 -0.74,-0.9025 -0.9633,-1.4416 -0.2233,-0.5392 -0.3383,-1.117 -0.3383,-1.7006 0,-1.1785 0.4682,-2.30882 1.3016,-3.14218 0.8333,-0.83337 1.9636,-1.30155 3.1422,-1.30155 1.1785,0 2.3088,0.46818 3.1422,1.30155 0.8333,0.83336 1.3015,1.96368 1.3015,3.14218 z" fill="#323e56" id="path6" />
+  </g>
+  <defs id="defs13">
+    <clipPath id="clip0_217_11335">
+      <rect x="5.4001498" y="5.6992202" width="24" height="24" rx="12" fill="#ffffff" id="rect10" />
+    </clipPath>
+  </defs>
+</svg>

umap/static/umap/img/source/16-white.svg

@@ -2,8 +2,12 @@
 <!-- Created with Inkscape (http://www.inkscape.org/) -->
 
 <svg width="144" height="144" id="svg2" version="1.1" inkscape:version="1.2.2 (b0a8486541, 2022-12-01)" sodipodi:docname="16-white.svg" inkscape:export-filename="16-white.png" inkscape:export-xdpi="96" inkscape:export-ydpi="96" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
-  <defs id="defs4" />
+  <defs id="defs4">
-  <sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="10.436829" inkscape:cx="43.499802" inkscape:cy="101.89877" inkscape:document-units="px" inkscape:current-layer="layer1" showgrid="true" inkscape:window-width="1920" inkscape:window-height="1019" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" showguides="true" inkscape:guide-bbox="true" inkscape:snap-grids="true" inkscape:snap-to-guides="true" inkscape:showpageshadow="2" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1">
+    <clipPath id="clip0_241_10857">
+      <rect width="18.049999" height="19.01" fill="#ffffff" id="rect586" x="0" y="0" />
+    </clipPath>
+  </defs>
+  <sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="9.2657163" inkscape:cx="68.963907" inkscape:cy="48.29632" inkscape:document-units="px" inkscape:current-layer="layer1" showgrid="true" inkscape:window-width="1920" inkscape:window-height="1019" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" showguides="true" inkscape:guide-bbox="true" inkscape:snap-grids="true" inkscape:snap-to-guides="true" inkscape:showpageshadow="2" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1">
     <inkscape:grid type="xygrid" id="grid3004" empspacing="4" visible="true" enabled="true" snapvisiblegridlinesonly="true" originx="0" originy="0" />
     <sodipodi:guide orientation="-1,0" position="24,144" id="guide3084" inkscape:locked="false" inkscape:label="" inkscape:color="rgb(0,134,229)" />
     <sodipodi:guide orientation="0,1" position="0,72" id="guide3086" inkscape:locked="false" inkscape:label="" inkscape:color="rgb(0,134,229)" />
@@ -49,7 +53,6 @@
     <g id="text4356" style="font-style:normal;font-weight:normal;font-size:40px;line-height:125%;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:#4d4d4d;fill-opacity:1;stroke:none" transform="translate(-4,-172.00004)">
       <path inkscape:connector-curvature="0" id="path4384" style="font-variant:normal;font-stretch:normal;font-size:20px;font-family:Arial;-inkscape-font-specification:Arial;fill:#f2f2f2;fill-opacity:1;stroke:#999999;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 35.742187,999.43835 3.076172,-3.07617 -3.066406,-3.0664 1.191406,-1.19141 3.066407,3.06641 3.05664,-3.05664 1.171875,1.18164 -3.046875,3.05664 3.066406,3.0664 -1.191406,1.19138 -3.066406,-3.06638 -3.076172,3.07618 -1.181641,-1.18165" />
     </g>
-    <path inkscape:connector-curvature="0" d="m 11.192256,853.3618 2e-6,-4.19993 -4.192255,10e-6 -3e-6,-1.62667 h 4.192263 v -4.17331 l 1.608812,0.007 0.0067,4.16664 h 4.192255 l -3.9e-5,1.62662 -4.19222,4e-5 -1.5e-5,4.19994 h -1.615475" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:20px;line-height:125%;font-family:Arial;-inkscape-font-specification:Arial;letter-spacing:0px;word-spacing:0px;fill:#4d4d4d;fill-opacity:1;stroke:none" id="path4384-3" />
     <path style="fill:#f2f2f2;fill-opacity:1;stroke:#999999;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 63.71429,866.36213 -1.14285,1.14286 2.28571,2.28572 1.14285,-1.14286 z m -1.71429,1.71428 -6.285714,6.28574 2.285715,2.2857 6.285719,-6.28572 z m -6.285714,6.28574 -1.714286,3.99999 4.000001,-1.71429 z" id="path3684" inkscape:connector-curvature="0" sodipodi:nodetypes="cccccccccccccc" />
     <text xml:space="preserve" style="font-style:normal;font-weight:normal;line-height:0%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none" x="41.647079" y="916.79706" id="text4457-6"><tspan y="916.79706" x="41.647079" sodipodi:role="line" id="tspan4459-6" style="font-size:30.4762px;line-height:1.25;font-family:sans-serif"> </tspan></text>
     <g id="text4356-2" style="font-style:normal;font-weight:normal;font-size:40px;line-height:125%;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none" transform="translate(44,-124.00004)">
@@ -151,7 +154,6 @@
     <rect style="fill:#f2f2f2;fill-opacity:1;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" id="rect4241-8-2" width="2" height="2" x="85" y="901.36218" />
     <rect style="fill:#f2f2f2;fill-opacity:1;stroke:none;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" id="rect4243-2-5" width="2" height="2" x="89" y="901.36218" />
     <path style="fill:#b3b3b3;fill-opacity:1;fill-rule:nonzero;stroke:#999999;stroke-width:0.25;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 131,937.3621 v 1 c -1.42857,0 -3.28571,0.5999 -4,2 v 1 h 10 v -1 c -0.71429,-1.4001 -2.57143,-2 -4,-2 v -1 z m -4,5 2,9 h 6 l 2,-9 z" id="delete-30-7" inkscape:connector-curvature="0" sodipodi:nodetypes="cccccccccccccc" inkscape:label="delete-30" />
-    <path d="m 60.05856,945.6588 c 1.5887,0 3.11185,0.6337 4.23522,1.7571 1.12337,1.1232 1.7553,2.6464 1.75709,4.2352 0,0.238 -0.12691,0.4577 -0.3329,0.5766 -0.20598,0.1189 -0.45982,0.1189 -0.66579,0 -0.20598,-0.1189 -0.33291,-0.3386 -0.33291,-0.5766 0,-1.6651 -0.88828,-3.2037 -2.33028,-4.0363 -1.44199,-0.8324 -3.218566,-0.8324 -4.660564,0 -1.441999,0.8326 -2.330283,2.3712 -2.330283,4.0363 0,0.238 -0.126916,0.4577 -0.332898,0.5766 -0.205982,0.1189 -0.459818,0.1189 -0.665795,0 -0.205978,-0.1189 -0.332898,-0.3386 -0.332898,-0.5766 0.0018,-1.5887 0.633685,-3.1118 1.757091,-4.2352 1.123215,-1.1234 2.646403,-1.7553 4.235217,-1.7571 z m 0,-0.6658 c -0.882924,0 -1.729586,-0.3507 -2.353913,-0.9751 -0.624325,-0.6243 -0.975066,-1.471 -0.975066,-2.3539 0,-0.8829 0.350734,-1.7296 0.975066,-2.3539 0.624334,-0.6244 1.470989,-0.9751 2.353913,-0.9751 0.88292,0 1.72959,0.3507 2.35391,0.9751 0.62432,0.6243 0.97506,1.471 0.97506,2.3539 -8.2e-4,0.8826 -0.35206,1.7288 -0.97624,2.3528 -0.62402,0.6241 -1.47012,0.9752 -2.35273,0.9762 z m 0,-1.3316 c 0.52982,0 1.03776,-0.2105 1.41244,-0.5849 0.37451,-0.3747 0.58494,-0.8827 0.58494,-1.4125 0,-0.5298 -0.21043,-1.0377 -0.58494,-1.4124 -0.37466,-0.3745 -0.88262,-0.585 -1.41244,-0.585 -0.529824,0 -1.037768,0.2105 -1.41244,0.585 -0.374512,0.3747 -0.584948,0.8826 -0.584948,1.4124 0,0.5298 0.210436,1.0378 0.584948,1.4125 0.37466,0.3744 0.882616,0.5849 1.41244,0.5849 z" id="path349" style="fill:#f2f2f2;fill-opacity:1;stroke:#999999;stroke-width:0.178;stroke-dasharray:none;stroke-opacity:1" />
     <path d="m 113.2903,943.46769 0.9072,0.5491 c 0.1786,0.10817 0.2366,0.34196 0.1294,0.52223 -0.0319,0.0535 -0.0764,0.0983 -0.1294,0.13055 l -7.00717,4.24121 -7.00708,-4.24121 c -0.17869,-0.10817 -0.236639,-0.34196 -0.12942,-0.52222 0.0319,-0.0536 0.0763,-0.0984 0.12942,-0.13056 l 0.90714,-0.5491 6.09994,3.69219 z m 0,3.57799 0.9072,0.5491 c 0.1786,0.1081 0.2366,0.3419 0.1294,0.5222 -0.0319,0.0535 -0.0764,0.0983 -0.1294,0.1306 l -6.61891,4.0061 c -0.239,0.1447 -0.53753,0.1447 -0.77652,0 l -6.61882,-4.0061 c -0.17869,-0.1082 -0.236639,-0.342 -0.12942,-0.5223 0.0319,-0.0536 0.0763,-0.0984 0.12942,-0.1305 l 0.90714,-0.5491 6.09994,3.6921 z m -5.71171,-10.57501 6.61891,4.00621 c 0.1786,0.10815 0.2366,0.34196 0.1294,0.52222 -0.0319,0.0536 -0.0764,0.0984 -0.1294,0.13056 l -7.00717,4.24119 -7.00708,-4.24119 c -0.17869,-0.10815 -0.236639,-0.34196 -0.12942,-0.52222 0.0319,-0.0536 0.0763,-0.0984 0.12942,-0.13056 l 6.61882,-4.00621 c 0.23899,-0.14465 0.53752,-0.14465 0.77652,0 z" fill="#4d4d4d" id="path437" style="fill:#f2f2f2;fill-opacity:1;stroke:#999999;stroke-opacity:1;stroke-width:0.178;stroke-dasharray:none" />
     <path id="linestring" style="color:#000000;fill:#f2f2f2;fill-opacity:1;fill-rule:evenodd;stroke:#999999;stroke-width:0.2;stroke-dasharray:none;stroke-opacity:1" d="m 7,937.36218 v 2 h 1.8828125 l 6.1171875,3.05859 v 0.23438 l -6.7070312,6.70703 h -1.2929688 v 2 h 2 v -1.29297 l 6.707031,-6.70703 h 1.292969 v -2 h -1.882812 l -6.117188,-3.05859 v -0.94141 z" />
     <path id="polygon" style="fill:#f2f2f2;fill-rule:evenodd;stroke:#999999;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-dasharray:none;fill-opacity:1" d="M 29 936.36218 L 29 938.36218 L 29.927734 938.36218 L 29.072266 950.36218 L 28 950.36218 L 28 952.36218 L 30 952.36218 L 30 951.16296 L 38 949.5614 L 38 950.36218 L 40 950.36218 L 40 948.36218 L 39.222656 948.36218 L 40.777344 941.36218 L 42 941.36218 L 42 939.36218 L 40 939.36218 L 40 940.08874 L 31 937.63562 L 31 936.36218 L 29 936.36218 z " />
@@ -159,5 +161,11 @@
     <g transform="matrix(0.16294606,0,0,0.16295934,27.835262,912.23132)" id="settings" style="fill:#f2f2f2;fill-opacity:1;stroke:#999999;stroke-width:1.49736;stroke-miterlimit:4;stroke-dasharray:none" class="sprite">
       <path inkscape:connector-curvature="0" d="m 98.762,43.652 c -0.186,-1.386 -1.481,-2.582 -2.876,-2.659 l -6.172,-0.337 c -1.395,-0.076 -2.899,-1.224 -3.341,-2.55 l -2.28,-5.518 c -0.629,-1.249 -0.379,-3.121 0.553,-4.161 l 4.122,-4.6 c 0.933,-1.042 0.962,-2.77 0.066,-3.842 l -8.813,-8.813 c -1.073,-0.897 -2.803,-0.867 -3.845,0.065 l -4.598,4.122 c -1.039,0.934 -2.915,1.182 -4.161,0.551 l -5.521,-2.279 c -1.324,-0.442 -2.472,-1.945 -2.549,-3.34 l -0.337,-6.17 c -0.077,-1.396 -1.272,-2.691 -2.659,-2.878 0,0 -3.252,-0.44 -6.248,-0.44 -2.991,0 -6.243,0.44 -6.243,0.44 -1.386,0.188 -2.582,1.483 -2.658,2.878 l -0.338,6.17 c -0.076,1.396 -1.224,2.898 -2.551,3.34 l -5.517,2.279 c -1.249,0.631 -3.122,0.382 -4.161,-0.551 l -4.601,-4.122 c -1.042,-0.932 -2.769,-0.962 -3.842,-0.065 l -8.813,8.813 c -0.897,1.073 -0.867,2.801 0.066,3.842 l 4.122,4.6 c 0.933,1.041 1.182,2.913 0.551,4.161 l -2.279,5.518 c -0.442,1.326 -1.946,2.474 -3.34,2.55 l -6.17,0.337 c -1.396,0.077 -2.691,1.272 -2.879,2.659 0,0 -0.439,3.253 -0.439,6.243 0,2.99 0.44,6.24 0.44,6.24 0.188,1.389 1.483,2.582 2.879,2.659 l 6.169,0.339 c 1.396,0.075 2.898,1.225 3.341,2.549 l 2.278,5.517 c 0.631,1.248 0.381,3.122 -0.551,4.163 l -4.122,4.598 c -0.933,1.042 -0.963,2.771 -0.066,3.845 l 8.814,8.813 c 1.073,0.896 2.801,0.866 3.842,-0.066 l 4.6,-4.122 c 1.041,-0.932 2.913,-1.182 4.161,-0.553 l 5.517,2.28 c 1.327,0.441 2.475,1.946 2.55,3.343 l 0.338,6.168 c 0.076,1.395 1.272,2.692 2.658,2.88 0,0 3.252,0.439 6.244,0.439 2.996,0 6.25,-0.439 6.25,-0.439 1.385,-0.188 2.58,-1.485 2.657,-2.88 l 0.337,-6.168 c 0.077,-1.396 1.225,-2.901 2.551,-3.343 l 5.517,-2.28 c 1.248,-0.629 3.122,-0.379 4.163,0.553 l 4.598,4.122 c 1.042,0.933 2.771,0.964 3.843,0.067 l 8.815,-8.814 c 0.896,-1.073 0.866,-2.803 -0.066,-3.845 l -4.122,-4.598 c -0.932,-1.041 -1.182,-2.915 -0.553,-4.163 l 2.28,-5.517 c 0.441,-1.324 1.946,-2.474 3.341,-2.549 l 6.172,-0.339 c 1.395,-0.077 2.692,-1.271 2.876,-2.659 0,0 0.441,-3.25 0.441,-6.24 0,-2.99 -0.441,-6.243 -0.441,-6.243 z m -48.658,18.709 c -6.886,0 -12.468,-5.585 -12.468,-12.467 0,-6.885 5.582,-12.467 12.468,-12.467 6.89,0 12.475,5.582 12.475,12.467 -10e-4,6.882 -5.586,12.467 -12.475,12.467 z" id="path27812" style="fill:#f2f2f2;fill-opacity:1;stroke:#999999;stroke-width:1.49736;stroke-miterlimit:4;stroke-dasharray:none" />
     </g>
+    <g clip-path="url(#clip0_241_10857)" id="undo" transform="matrix(0.71300568,0,0,0.66260978,53.493751,938.13028)" style="fill:none;stroke:#f2f2f2;stroke-width:1.45488;stroke-linecap:butt;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1">
+      <path d="m 1.07001,4.41003 h 9.41999 c 0.9234,-0.0066 1.8391,0.16957 2.6941,0.5184 0.8551,0.34883 1.6327,0.8634 2.288,1.51407 0.6553,0.65067 1.1754,1.42458 1.5303,2.27713 0.3549,0.85256 0.5376,1.76697 0.5376,2.69037 0.0067,0.9277 -0.1712,1.8474 -0.5231,2.7058 -0.3519,0.8583 -0.871,1.6382 -1.527,2.2941 -0.656,0.656 -1.4358,1.1751 -2.2941,1.527 -0.8584,0.352 -1.7781,0.5298 -2.7058,0.5231 h -9.41999" stroke="#f2f2f2" stroke-miterlimit="10" id="path580" style="fill:none;stroke:#f2f2f2;stroke-width:1.45486;stroke-linecap:butt;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1" />
+      <path d="m 4.75002,8.44998 -4.039998,-4.05 4.039998,-4.050004" stroke="#f2f2f2" stroke-miterlimit="10" id="path582" style="fill:none;stroke:#f2f2f2;stroke-width:1.45486;stroke-linecap:butt;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+    <path d="m 9,849.93721 v 4.04997 c 0,0.20708 0.167895,0.375 0.375,0.375 h 5.25 c 0.207075,0 0.375,-0.16792 0.375,-0.375 v -4.04997 c 0,-0.20708 -0.167925,-0.375 -0.375,-0.375 h -5.25 c -0.207105,0 -0.375,0.16792 -0.375,0.375 z" stroke="#f2f2f2" id="path438" style="fill:none;stroke-width:0.999997" />
+    <path d="m 15.21255,842.36218 h -8.83755 c -0.207105,0 -0.375,0.1679 -0.375,0.37499 v 11.24993 c 0,0.20708 0.167895,0.375 0.375,0.375 h 11.25 c 0.207075,0 0.375,-0.16792 0.375,-0.375 v -8.67664 c 0,-0.0953 -0.0363,-0.18697 -0.1014,-0.25648 l -2.41245,-2.57327 c -0.07095,-0.0756 -0.16995,-0.11853 -0.2736,-0.11853 z" stroke="#f2f2f2" id="save" style="fill:none;stroke-width:0.999997" />
   </g>
 </svg>

umap/static/umap/js/umap.controls.js

@@ -314,13 +314,11 @@ L.U.EditControl = L.Control.extend({
   },
 
   onAdd: function (map) {
-    const container = L.DomUtil.create(
+    const container = L.DomUtil.create('div', 'leaflet-control-edit-enable'),
-        'div',
-        'leaflet-control-edit-enable umap-control'
-      ),
       edit = L.DomUtil.create('a', '', container)
     edit.href = '#'
     edit.title = `${L._('Enable editing')} (Ctrl+E)`
+    edit.textContent = L._('Edit')
 
     L.DomEvent.addListener(edit, 'click', L.DomEvent.stop).addListener(
       edit,
@@ -975,6 +973,76 @@ L.U.Map.include({
     },
   },
 
+  renderEditToolbar: function () {
+    const container = L.DomUtil.create(
+        'div',
+        'umap-main-edit-toolbox with-transition dark',
+        this._controlContainer
+      ),
+      logo = L.DomUtil.add('a', 'logo', container),
+      name = L.DomUtil.create('a', 'map-name', container),
+      share_status = L.DomUtil.create('a', 'share-status', container),
+      update = () => {
+        name.textContent = this.getDisplayName()
+        share_status.textContent = L._('Visibility: {status}', {
+          status: this.permissions.getShareStatusDisplay(),
+        })
+      }
+    update()
+    name.href = '#'
+    share_status.href = '#'
+    logo.href = '/'
+    if (this.options.user) {
+      const userLabel = L.DomUtil.add(
+        'a',
+        'umap-user',
+        container,
+        L._(`My maps ({username})`, { username: this.options.user.name })
+      )
+      userLabel.href = this.options.user.url
+    }
+    this.help.button(container, 'edit')
+    L.DomEvent.on(name, 'click', this.edit, this)
+    L.DomEvent.on(share_status, 'click', this.permissions.edit, this.permissions)
+    this.on('postsync', L.bind(update, this))
+    const save = L.DomUtil.create('a', 'leaflet-control-edit-save button', container)
+    save.href = '#'
+    save.title = `${L._('Save current edits')} (Ctrl+S)`
+    save.textContent = L._('Save')
+    const cancel = L.DomUtil.create('a', 'leaflet-control-edit-cancel', container)
+    cancel.href = '#'
+    cancel.title = `${L._('Cancel edits')} (Ctrl+Z)`
+    cancel.textContent = L._('Cancel all')
+    const disable = L.DomUtil.create('a', 'leaflet-control-edit-disable', container)
+    disable.href = '#'
+    disable.textContent = L._('Disable editing')
+    disable.title = `${disable.textContent} (Ctrl+E)`
+
+    L.DomEvent.addListener(disable, 'click', L.DomEvent.stop).addListener(
+      disable,
+      'click',
+      function (e) {
+        this.disableEdit(e)
+        this.ui.closePanel()
+      },
+      this
+    )
+
+    L.DomEvent.addListener(save, 'click', L.DomEvent.stop).addListener(
+      save,
+      'click',
+      this.save,
+      this
+    )
+
+    L.DomEvent.addListener(cancel, 'click', L.DomEvent.stop).addListener(
+      cancel,
+      'click',
+      this.askForReset,
+      this
+    )
+  },
+
   renderShareBox: function () {
     const container = L.DomUtil.create('div', 'umap-share')
     const embedTitle = L.DomUtil.add('h4', '', container, L._('Embed the map'))

umap/static/umap/js/umap.js

@@ -67,13 +67,11 @@ L.U.Map.include({
   initialize: function (el, geojson) {
     // Locale name (pt_PT, en_US…)
     // To be used for Django localization
-    if (geojson.properties.locale)
+    if (geojson.properties.locale) L.setLocale(geojson.properties.locale)
-      L.setLocale(geojson.properties.locale)
 
     // Language code (pt-pt, en-us…)
     // To be used in javascript APIs
-    if (geojson.properties.lang)
+    if (geojson.properties.lang) L.lang = geojson.properties.lang
-      L.lang = geojson.properties.lang
 
     // Don't let default autocreation of controls
     const zoomControl =
@@ -245,7 +243,7 @@ L.U.Map.include({
         },
         this
       )
-      this.initEditBar()
+      this.renderEditToolbar()
     }
     this.initShortcuts()
     this.onceDatalayersLoaded(function () {
@@ -1812,66 +1810,6 @@ L.U.Map.include({
     })
   },
 
-  initEditBar: function () {
-    const container = L.DomUtil.create(
-        'div',
-        'umap-main-edit-toolbox with-transition dark',
-        this._controlContainer
-      ),
-      title = L.DomUtil.add('h3', '', container, `${L._('Editing')} `),
-      name = L.DomUtil.create('a', 'umap-click-to-edit', title),
-      setName = function () {
-        name.textContent = this.getDisplayName()
-      }
-    if (this.options.user) {
-      const userLabel = L.DomUtil.add('a', 'umap-user', title, this.options.user.name)
-      userLabel.href = this.options.user.url
-    }
-    L.bind(setName, this)()
-    L.DomEvent.on(name, 'click', this.edit, this)
-    this.on('postsync', L.bind(setName, this))
-    this.help.button(name, 'edit')
-    const save = L.DomUtil.create('a', 'leaflet-control-edit-save button', container)
-    save.href = '#'
-    save.title = `${L._('Save current edits')} (Ctrl+S)`
-    save.textContent = L._('Save')
-    const cancel = L.DomUtil.create(
-      'a',
-      'leaflet-control-edit-cancel button',
-      container
-    )
-    cancel.href = '#'
-    cancel.title = L._('Cancel edits')
-    cancel.textContent = L._('Cancel')
-    const disable = L.DomUtil.create('a', 'leaflet-control-edit-disable', container)
-    disable.href = '#'
-    disable.title = disable.textContent = L._('Disable editing')
-
-    L.DomEvent.addListener(disable, 'click', L.DomEvent.stop).addListener(
-      disable,
-      'click',
-      function (e) {
-        this.disableEdit(e)
-        this.ui.closePanel()
-      },
-      this
-    )
-
-    L.DomEvent.addListener(save, 'click', L.DomEvent.stop).addListener(
-      save,
-      'click',
-      this.save,
-      this
-    )
-
-    L.DomEvent.addListener(cancel, 'click', L.DomEvent.stop).addListener(
-      cancel,
-      'click',
-      this.askForReset,
-      this
-    )
-  },
-
   askForReset: function (e) {
     if (!confirm(L._('Are you sure you want to cancel your changes?'))) return
     this.reset()

umap/static/umap/js/umap.permissions.js

@@ -160,6 +160,7 @@ L.U.MapPermissions = L.Class.extend({
         this.commit()
         this.isDirty = false
         this.map.continueSaving()
+        this.map.fire('postsync')
       },
     })
   },
@@ -194,4 +195,8 @@ L.U.MapPermissions = L.Class.extend({
   commit: function () {
     L.Util.extend(this.map.options.permissions, this.options)
   },
+
+  getShareStatusDisplay: function () {
+    return Object.fromEntries(this.map.options.share_statuses)[this.options.share_status]
+  }
 })

umap/static/umap/map.css

@@ -116,9 +116,26 @@ a.umap-control-less {
     height: 23px;
     line-height: 23px;
 }
+.leaflet-control-edit-enable a:before {
+    content: ' ';
+    width: 24px;
+    height: 24px;
+    display: inline-block;
+    vertical-align: middle;
+    background-image: url('./img/16-white.svg');
+    background-position: -52px -49px;
+}
+
 .leaflet-control-edit-enable a {
-    background-position: 0 0;
+    width: initial;
+    padding: 0 20px;
     background-color: #353c3e;
+    color: #fff;
+    background-image: none;
+    border-radius: 20px;
+    height: 36px;
+    line-height: 36px;
+    display: block;
 }
 .leaflet-control-toolbar .leaflet-toolbar-icon.dark:hover,
 .leaflet-control-edit-enable a:hover {
@@ -203,7 +220,6 @@ ul.photon-autocomplete {
     background-image: url('./img/24.svg');
     background-size: auto auto;
 }
-.leaflet-control-edit-enable a,
 .leaflet-control-toolbar li .leaflet-toolbar-icon.dark {
     background-image: url('./img/24-white.svg');
 }
@@ -407,8 +423,20 @@ ul.photon-autocomplete {
     padding: 0 10px;
     min-width: 100px;
 }
-.leaflet-container a.leaflet-control-edit-cancel {
+.leaflet-container a.leaflet-control-edit-save:before,
-    background-color: #C60F13;
+.leaflet-container a.leaflet-control-edit-cancel:before {
+    display: inline-block;
+    width: 24px;
+    height: 24px;
+    margin-left: 5px;
+    background-position: -50px -122px;
+    background-repeat: no-repeat;
+    background-image: url('./img/16-white.svg');
+    vertical-align: middle;
+    content: ' ';
+}
+.leaflet-container a.leaflet-control-edit-save:before {
+    background-position: -4px -25px;
 }
 .leaflet-container a.leaflet-control-edit-save {
     opacity: 0.5;
@@ -433,26 +461,6 @@ ul.photon-autocomplete {
 .umap-is-dirty a.leaflet-control-edit-disable {
     display: none;
 }
-.umap-click-to-edit {
-    color: #4a90d9;
-    font-weight: bold;
-}
-.umap-click-to-edit:after {
-    content: "\00a0";
-    background-repeat: no-repeat;
-    background-position: center center;
-    cursor: pointer;
-    width: 26px;
-    height: 100%;
-    display: inline-block;
-    background-position: -46px -41px;
-}
-.umap-click-to-edit:hover:after {
-    background-image: url('./img/16.svg');
-}
-.dark .umap-click-to-edit:hover:after {
-    background-image: url('./img/16-white.svg');
-}
 .umap-caption-bar {
     display: none;
 }
@@ -464,14 +472,43 @@ ul.photon-autocomplete {
     right: 0;
     height: 46px;
     background-color: #323737;
-    padding: 5px;
+    padding: 5px 10px;
     text-align: left;
     line-height: 36px;
     cursor: auto;
     border-bottom: 1px solid #222;
     z-index: 1000;
     opacity: 0.98;
-    color: #efefef;
+    color: #fff;
+}
+.umap-main-edit-toolbox .logo {
+    background-image: url('./img/logo_small.svg');
+    background-position: 0 center;
+    background-repeat: no-repeat;
+    width: 60px;
+    display: inline-block;
+    height: 100%;
+    vertical-align: middle;
+}
+.umap-main-edit-toolbox a {
+    color: #fff;
+    font-size: 1.2em;
+    vertical-align: middle;
+}
+.umap-main-edit-toolbox a:hover {
+    text-decoration: underline;
+}
+.umap-main-edit-toolbox .map-name {
+    display: inline-block;
+    max-width: 200px;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    margin-right: 5px;
+    font-weight: bold;
+}
+.umap-main-edit-toolbox .share-status {
+    margin: 0 20px;
 }
 .umap-edit-enabled .umap-main-edit-toolbox {
     top: 0;
@@ -483,15 +520,8 @@ ul.photon-autocomplete {
 .umap-main-edit-toolbox h3 {
     display: inline;
 }
-.umap-main-edit-toolbox .umap-user:before {
+.umap-main-edit-toolbox .umap-user {
-    content: '|';
+    margin-right: 20px;
-    color: #fff;
-    padding-right: 10px;
-    background-image: url('./img/16-white.svg');
-    background-repeat: no-repeat;
-    display: inline-block;
-    background-position: -40px -115px;
-    width: 20px;
 }
 .umap-edit-enabled .leaflet-top {
     top: 48px;
@@ -1437,8 +1467,27 @@ a.add-datalayer:hover,
 /* Mobile */
 /* ****** */
 
+@media all and (max-width: 980px) {
+
+    .leaflet-container a.leaflet-control-edit-save,
+    .leaflet-container a.leaflet-control-edit-cancel {
+        text-indent: calc(100% - 20px);
+        width: 35px;
+        min-width: initial;
+    }
+
+    .umap-main-edit-toolbox .umap-help-button,
+    .umap-main-edit-toolbox .share-status {
+        display: none;
+    }
+
+}
 @media all and (max-width: 480px) {
 
+    .umap-main-edit-toolbox .map-name {
+        max-width: 100px;
+    }
+
     .leaflet-control-layers-expanded label {
         display: inline-block;
         margin-right: 10px;