From: Hidde Wieringa <hidde@hiddewieringa.nl>
Date: Tue, 14 May 2024 18:06:14 +0000 (+0200)
Subject: Convert note markers to SVG
X-Git-Tag: live~926^2
X-Git-Url: https://git.openstreetmap.org./rails.git/commitdiff_plain/b2fcf003f8e5c928cabf36ae9a01ef393de8874f

Convert note markers to SVG
---

diff --git a/app/assets/images/closed_note_marker.png b/app/assets/images/closed_note_marker.png
deleted file mode 100644
index ad2812fbe..000000000
Binary files a/app/assets/images/closed_note_marker.png and /dev/null differ
diff --git a/app/assets/images/closed_note_marker.svg b/app/assets/images/closed_note_marker.svg
new file mode 100644
index 000000000..d16b5707e
--- /dev/null
+++ b/app/assets/images/closed_note_marker.svg
@@ -0,0 +1,43 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="40.226" width="25.1">
+  <defs>
+    <linearGradient id="A" x1="106.764" gradientUnits="userSpaceOnUse" y1="59.373" x2="106.764" y2="21.809">
+      <stop stop-color="#7cb928" offset="0"/>
+      <stop stop-color="#a2c857" offset="1"/>
+    </linearGradient>
+    <linearGradient id="B" x1="106.76" gradientUnits="userSpaceOnUse" y1="40.861" x2="106.76" y2="21.809">
+      <stop stop-color="#74963a" offset="0"/>
+      <stop stop-color="#89b63e" offset="1"/>
+    </linearGradient>
+  </defs>
+  <linearGradient x1="66.61" gradientUnits="userSpaceOnUse" y1="59.373" x2="66.61" y2="21.809">
+    <stop stop-color="#286eb5" offset="0"/>
+    <stop stop-color="#4d9cd1" offset="1"/>
+  </linearGradient>
+  <linearGradient x1="66.609" gradientUnits="userSpaceOnUse" y1="40.861" x2="66.609" y2="21.809">
+    <stop stop-color="#306d98" offset="0"/>
+    <stop stop-color="#3984b8" offset="1"/>
+  </linearGradient>
+  <linearGradient x1="160.144" gradientUnits="userSpaceOnUse" y1="59.373" x2="160.144" y2="21.809">
+    <stop stop-color="#286eb5" offset="0"/>
+    <stop stop-color="#4d9cd1" offset="1"/>
+  </linearGradient>
+  <linearGradient x1="160.146" gradientUnits="userSpaceOnUse" y1="40.861" x2="160.146" y2="21.809">
+    <stop stop-color="#306d98" offset="0"/>
+    <stop stop-color="#3984b8" offset="1"/>
+  </linearGradient>
+  <path fill-rule="evenodd" fill="#fff" d="M4.123 4.656h16.838v17.462H4.123z"/>
+  <g transform="translate(-94.205 -21.438)">
+    <linearGradient x1="106.764" gradientUnits="userSpaceOnUse" y1="59.373" x2="106.764" y2="21.809">
+      <stop stop-color="#7cb928" offset="0"/>
+      <stop stop-color="#a2c857" offset="1"/>
+    </linearGradient>
+    <linearGradient x1="106.76" gradientUnits="userSpaceOnUse" y1="40.861" x2="106.76" y2="21.809">
+      <stop stop-color="#74963a" offset="0"/>
+      <stop stop-color="#89b63e" offset="1"/>
+    </linearGradient>
+    <g stroke-width="1.1">
+      <path d="m 106.8,21.988 c -6.572,0 -12.045,5.691 -12.045,11.865 0,2.777 1.564,6.309 2.693,8.747 l 9.307,17.871 9.262,-17.871 c 1.131,-2.438 2.738,-5.792 2.738,-8.747 0,-6.174 -5.38,-11.865 -11.96,-11.865 z m -1.18,20.069 c -0.521,0 -1.025,-0.215 -1.389,-0.604 -0.025,-0.027 -2.609,-2.793 -3.945,-3.996 -0.779,-0.703 -0.841,-1.904 -0.139,-2.684 0.703,-0.781 1.904,-0.842 2.684,-0.139 0.64,0.576 1.501,1.438 2.275,2.232 1.244,-2.398 3.327,-6 5.765,-8.545 0.726,-0.758 1.929,-0.783 2.687,-0.057 0.758,0.725 0.783,1.928 0.058,2.686 -3.412,3.562 -6.228,9.906 -6.255,9.971 -0.258,0.584 -0.792,1 -1.422,1.108 -0.11,0.018 -0.22,0.028 -0.32,0.028 z" fill-rule="evenodd" stroke="url(#B)" fill="url(#A)"/>
+      <path d="M106.79 23.093c-5.943 0-10.938 5.221-10.938 10.75 0 2.359 1.443 5.832 2.562 8.25.006.012.025.021.031.031l8.312 15.969 8.25-15.969c.006-.012.025-.02.031-.031 1.135-2.448 2.625-5.706 2.625-8.25.01-5.537-4.93-10.75-10.87-10.75zm5.45 3.543a3.01 3.01 0 0 0-2.166.926c-2.09 2.18-3.914 5.074-5.236 7.471-.502-.498-.928-.904-1.273-1.217-.553-.498-1.266-.771-2.009-.771a3 3 0 0 0-2.228.992c-1.107 1.227-1.01 3.129.219 4.236 1.288 1.16 3.85 3.901 3.874 3.926.569.609 1.368.957 2.196.957a3.08 3.08 0 0 0 .498-.041c1.002-.172 1.841-.824 2.248-1.75.029-.064 2.805-6.271 6.043-9.652a2.98 2.98 0 0 0 .834-2.141c-.018-.801-.346-1.547-.925-2.102a3.01 3.01 0 0 0-2.08-.834z" stroke-opacity=".122" stroke="#fff" fill="none"/>
+    </g>
+  </g>
+</svg>
diff --git a/app/assets/images/closed_note_marker@2x.png b/app/assets/images/closed_note_marker@2x.png
deleted file mode 100644
index 96a2592e1..000000000
Binary files a/app/assets/images/closed_note_marker@2x.png and /dev/null differ
diff --git a/app/assets/images/new_note_marker.png b/app/assets/images/new_note_marker.png
deleted file mode 100644
index a41464487..000000000
Binary files a/app/assets/images/new_note_marker.png and /dev/null differ
diff --git a/app/assets/images/new_note_marker.svg b/app/assets/images/new_note_marker.svg
new file mode 100644
index 000000000..efa538b72
--- /dev/null
+++ b/app/assets/images/new_note_marker.svg
@@ -0,0 +1,23 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="40.226" width="25.099">
+  <linearGradient x1="66.61" gradientUnits="userSpaceOnUse" y1="59.373" x2="66.61" y2="21.809">
+    <stop stop-color="#286eb5" offset="0"/>
+    <stop stop-color="#4d9cd1" offset="1"/>
+  </linearGradient>
+  <linearGradient x1="66.609" gradientUnits="userSpaceOnUse" y1="40.861" x2="66.609" y2="21.809">
+    <stop stop-color="#306d98" offset="0"/>
+    <stop stop-color="#3984b8" offset="1"/>
+  </linearGradient>
+  <linearGradient id="A" x1="12.548" gradientUnits="userSpaceOnUse" y1="37.935" x2="12.548" y2=".371">
+    <stop stop-color="#286eb5" offset="0"/>
+    <stop stop-color="#4d9cd1" offset="1"/>
+  </linearGradient>
+  <linearGradient id="B" x1="12.55" gradientUnits="userSpaceOnUse" y1="19.423" x2="12.55" y2=".371">
+    <stop stop-color="#306d98" offset="0"/>
+    <stop stop-color="#3984b8" offset="1"/>
+  </linearGradient>
+  <g fill-rule="evenodd">
+    <path fill="#fff" d="M2.063 13.585L12.069 2.251l11.124 12.602-10.006 11.335z"/>
+    <path fill="url(#A)" d="M 12.594,0.55000001 C 6.022,0.55000001 0.55000001,6.241 0.55000001,12.415 c 0,2.777 1.56299999,6.309 2.69299999,8.747 l 9.307,17.871 9.262,-17.871 c 1.13,-2.438 2.737001,-5.792 2.737001,-8.747 C 24.539001,6.241 19.159,0.55000001 12.589,0.55000001 v 0 z M 14.644,11.411 V 6.595 c 0,-1.105 -0.895,-2 -2,-2 -1.104,0 -2.001,0.897 -2,2 V 11.41 H 5.829 c -1.104,-10e-4 -2,0.896 -2,2 0,1.104 0.895,2 2,2 h 4.815 v 4.815 c -10e-4,1.104 0.896,2 2,2 0.552,0 1.052,-0.224 1.414,-0.586 0.361,-0.361 0.586,-0.861 0.586,-1.414 V 15.41 h 4.815 c 0.551,0 1.052,-0.224 1.414,-0.586 0.361,-0.362 0.585,-0.862 0.586,-1.415 0.001,-1.104 -0.896,-2.001 -2,-2 -0.008,0.0044 -4.815,0.002 -4.815,0.002 z" stroke="url(#B)" stroke-width="1.1"/>
+  </g>
+  <path fill="none" stroke-opacity=".122" stroke="#fff" stroke-width="1.1" d="M12.584 1.655c-5.944 0-10.938 5.221-10.938 10.75 0 2.359 1.442 5.832 2.562 8.25.005.012.025.021.03.031l8.313 15.969 8.25-15.969c.005-.012.025-.02.03-.031 1.136-2.448 2.625-5.706 2.625-8.25.01-5.537-4.92-10.75-10.86-10.75h0zm-2.13 2.757a3.08 3.08 0 0 0-.908 2.194l.001 3.714-3.716-.001a3.08 3.08 0 0 0-2.192.908 3.07 3.07 0 0 0-.906 2.193 3.07 3.07 0 0 0 .906 2.191c.586.585 1.365.908 2.193.908l3.714-.001.001 3.716c-.001.826.321 1.605.907 2.191s1.365.908 2.191.907 1.606-.322 2.191-.907a3.08 3.08 0 0 0 .909-2.193l.001-3.713 3.714-.001a3.08 3.08 0 0 0 2.191-.908c.586-.586.909-1.365.908-2.192a3.07 3.07 0 0 0-.907-2.191 3.07 3.07 0 0 0-2.191-.907h-3.717l.002-3.715a3.08 3.08 0 0 0-.908-2.192c-.586-.585-1.364-.908-2.193-.908-.8-.002-1.58.321-2.17.907h0z"/>
+</svg>
diff --git a/app/assets/images/new_note_marker@2x.png b/app/assets/images/new_note_marker@2x.png
deleted file mode 100644
index 756ad6fe5..000000000
Binary files a/app/assets/images/new_note_marker@2x.png and /dev/null differ
diff --git a/app/assets/images/open_note_marker.png b/app/assets/images/open_note_marker.png
deleted file mode 100644
index 6fe5cb7ac..000000000
Binary files a/app/assets/images/open_note_marker.png and /dev/null differ
diff --git a/app/assets/images/open_note_marker.svg b/app/assets/images/open_note_marker.svg
new file mode 100644
index 000000000..8dc07b71a
--- /dev/null
+++ b/app/assets/images/open_note_marker.svg
@@ -0,0 +1,43 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="40.226" width="25.099">
+  <defs>
+    <linearGradient id="A" x1="27.311" gradientUnits="userSpaceOnUse" y1="59.373" x2="27.311" y2="21.809">
+      <stop stop-color="#c72118" offset="0"/>
+      <stop stop-color="#d2534f" offset="1"/>
+    </linearGradient>
+    <linearGradient id="B" x1="27.31" gradientUnits="userSpaceOnUse" y1="40.861" x2="27.31" y2="21.809">
+      <stop stop-color="#983a38" offset="0"/>
+      <stop stop-color="#b83d3b" offset="1"/>
+    </linearGradient>
+  </defs>
+  <linearGradient x1="66.61" gradientUnits="userSpaceOnUse" y1="59.373" x2="66.61" y2="21.809">
+    <stop stop-color="#286eb5" offset="0"/>
+    <stop stop-color="#4d9cd1" offset="1"/>
+  </linearGradient>
+  <linearGradient x1="66.609" gradientUnits="userSpaceOnUse" y1="40.861" x2="66.609" y2="21.809">
+    <stop stop-color="#306d98" offset="0"/>
+    <stop stop-color="#3984b8" offset="1"/>
+  </linearGradient>
+  <linearGradient x1="160.144" gradientUnits="userSpaceOnUse" y1="59.373" x2="160.144" y2="21.809">
+    <stop stop-color="#286eb5" offset="0"/>
+    <stop stop-color="#4d9cd1" offset="1"/>
+  </linearGradient>
+  <linearGradient x1="160.146" gradientUnits="userSpaceOnUse" y1="40.861" x2="160.146" y2="21.809">
+    <stop stop-color="#306d98" offset="0"/>
+    <stop stop-color="#3984b8" offset="1"/>
+  </linearGradient>
+  <path d="M2.805 9.333l5.717-6.132 9.459.208 4.47 7.068-2.806 11.33-8.835.728-5.405-1.455-2.391-6.444z" fill="#fff"/>
+  <g transform="translate(-14.761 -21.438)">
+    <linearGradient x1="27.311" gradientUnits="userSpaceOnUse" y1="59.373" x2="27.311" y2="21.809">
+      <stop stop-color="#c72118" offset="0"/>
+      <stop stop-color="#d2534f" offset="1"/>
+    </linearGradient>
+    <linearGradient x1="27.31" gradientUnits="userSpaceOnUse" y1="40.861" x2="27.31" y2="21.809">
+      <stop stop-color="#983a38" offset="0"/>
+      <stop stop-color="#b83d3b" offset="1"/>
+    </linearGradient>
+    <g stroke-width="1.1">
+      <path d="m 27.355,21.988 c -6.572,0 -12.044,5.691 -12.044,11.865 0,2.777 1.563,6.309 2.693,8.747 L 27.311,60.471 36.573,42.6 c 1.13,-2.438 2.737,-5.792 2.737,-8.747 10e-4,-6.174 -5.382,-11.865 -11.955,-11.865 z m 2.875,12.86 3.547,-3.547 c 0.781,-0.781 0.781,-2.047 0,-2.828 -0.782,-0.781 -2.049,-0.781 -2.829,0 l -3.547,3.547 -3.547,-3.547 c -0.779,-0.781 -2.047,-0.781 -2.828,0 -0.781,0.781 -0.781,2.047 0,2.828 l 3.547,3.547 -3.547,3.546 c -0.781,0.78 -0.781,2.048 0,2.828 0.391,0.391 0.902,0.586 1.414,0.586 0.512,0 1.024,-0.195 1.414,-0.586 l 3.547,-3.546 3.547,3.546 c 0.39,0.391 0.902,0.586 1.414,0.586 0.512,0 1.023,-0.195 1.415,-0.586 0.781,-0.78 0.781,-2.048 0,-2.828 z" fill-rule="evenodd" stroke="url(#B)" fill="url(#A)"/>
+      <path d="M27.343 23.093c-5.944 0-10.938 5.221-10.938 10.75 0 2.359 1.442 5.832 2.562 8.25.005.012.025.021.03.031l8.313 15.969 8.25-15.969c.005-.012.025-.02.03-.031 1.136-2.448 2.625-5.706 2.625-8.25.002-5.537-4.929-10.75-10.872-10.75zm5.02 3.706a3.08 3.08 0 0 0-2.193.909l-2.768 2.769-2.769-2.77a3.08 3.08 0 0 0-2.192-.908c-.828 0-1.607.323-2.191.909s-.908 1.363-.908 2.191a3.08 3.08 0 0 0 .908 2.192l2.769 2.768-2.769 2.77c-.586.584-.908 1.363-.908 2.191s.322 1.607.908 2.191 1.363.908 2.191.908a3.08 3.08 0 0 0 2.193-.908l2.768-2.767 2.769 2.767c.585.586 1.363.908 2.192.908s1.607-.322 2.191-.908a3.07 3.07 0 0 0 .908-2.191c0-.828-.322-1.607-.908-2.191l-2.769-2.77 2.769-2.768a3.08 3.08 0 0 0 0-4.384 3.08 3.08 0 0 0-2.191-.908z" stroke-opacity=".122" stroke="#fff" fill="none"/>
+    </g>
+  </g>
+</svg>
diff --git a/app/assets/images/open_note_marker@2x.png b/app/assets/images/open_note_marker@2x.png
deleted file mode 100644
index 84df3f725..000000000
Binary files a/app/assets/images/open_note_marker@2x.png and /dev/null differ
diff --git a/app/assets/javascripts/osm.js.erb b/app/assets/javascripts/osm.js.erb
index 2e33438db..e429f4479 100644
--- a/app/assets/javascripts/osm.js.erb
+++ b/app/assets/javascripts/osm.js.erb
@@ -39,9 +39,9 @@ OSM = {
   MARKER_ICON_2X:          <%= image_path("leaflet/dist/images/marker-icon-2x.png").to_json %>,
   MARKER_SHADOW:           <%= image_path("leaflet/dist/images/marker-shadow.png").to_json %>,
 
-  NEW_NOTE_MARKER:         <%= image_path("new_note_marker.png").to_json %>,
-  OPEN_NOTE_MARKER:        <%= image_path("open_note_marker.png").to_json %>,
-  CLOSED_NOTE_MARKER:      <%= image_path("closed_note_marker.png").to_json %>,
+  NEW_NOTE_MARKER:         <%= image_path("new_note_marker.svg").to_json %>,
+  OPEN_NOTE_MARKER:        <%= image_path("open_note_marker.svg").to_json %>,
+  CLOSED_NOTE_MARKER:      <%= image_path("closed_note_marker.svg").to_json %>,
 
   apiUrl: function (object) {
     var apiType = object.type === "note" ? "notes" : object.type;
diff --git a/app/views/notes/index.html.erb b/app/views/notes/index.html.erb
index 8622bbf29..d5efe0d79 100644
--- a/app/views/notes/index.html.erb
+++ b/app/views/notes/index.html.erb
@@ -27,9 +27,9 @@
     <tr<% if note.author == @user %> class="table-primary"<% end %>>
       <td>
         <% if note.closed? %>
-          <%= image_tag("closed_note_marker.png", :alt => "closed", :size => "25x40") %>
+          <%= image_tag("closed_note_marker.svg", :alt => "closed", :width => 25, :height => 40) %>
         <% else %>
-          <%= image_tag("open_note_marker.png", :alt => "open", :size => "25x40") %>
+          <%= image_tag("open_note_marker.svg", :alt => "open", :width => 25, :height => 40) %>
         <% end %>
       </td>
       <td><%= link_to note.id, note %></td>