<p></p>
<p><b>@gravitystorm</b> commented on this pull request.</p>

<hr>

<p>In <a href="https://github.com/openstreetmap/openstreetmap-website/pull/5635#discussion_r1961881761">app/assets/stylesheets/common.scss</a>:</p>
<pre style='color:#555'>> @@ -581,6 +581,15 @@ header .search_forms,
   }
 }
 
+.search_forms {
</pre>
<p dir="auto">We try hard to avoid writing custom CSS for features on the website - typically, we only use Bootstrap classes applied directly to the elements.</p>
<p dir="auto">Most existing CSS in this file can be considered a target for refactoring.</p>

<hr>

<p>In <a href="https://github.com/openstreetmap/openstreetmap-website/pull/5635#discussion_r1961882629">app/assets/stylesheets/common.scss</a>:</p>
<pre style='color:#555'>> @@ -581,6 +581,15 @@ header .search_forms,
   }
 }
 
+.search_forms {
+  .geolocate {
+    transition: filter 0.15s ease-in-out;
</pre>
<p dir="auto">We don't use transitions on any other button content, so I don't think it's necessary here</p>

<hr>

<p>In <a href="https://github.com/openstreetmap/openstreetmap-website/pull/5635#discussion_r1961884895">app/assets/stylesheets/common.scss</a>:</p>
<pre style='color:#555'>> @@ -581,6 +581,15 @@ header .search_forms,
   }
 }
 
+.search_forms {
+  .geolocate {
+    transition: filter 0.15s ease-in-out;
+  }
+  .btn:not(:hover) .geolocate {
+    filter: brightness(53%);
</pre>
<p dir="auto">I can see what this is doing, but I don't think it's the right approach. We should either:</p>
<ul dir="auto">
<li>Add icons to the spritesheet, with the colours that we want (for light mode, and dark mode if necessary)</li>
<li>Or we should take the approach of the "swap directions" button, which has inline SVG and automatic colouring.</li>
</ul>

<hr>

<p>In <a href="https://github.com/openstreetmap/openstreetmap-website/pull/5635#discussion_r1961893541">app/assets/javascripts/index/search.js</a>:</p>
<pre style='color:#555'>> @@ -11,7 +11,7 @@ OSM.Search = function (map) {
     e.preventDefault();
     const query = $(this).closest("form").find("input[name=query]").val();
     let search = "";
-    if (query) search = "?" + new URLSearchParams({ from: query });
+    if (query) search = "?" + new URLSearchParams({ to: query });
</pre>
<p dir="auto">This suggested behaviour is very common. I know that because personally it usually frustrates me - when I'm using other apps and planning to go from A to B I search for A first, then the site offers direction <em>to</em> A, and then I need to swap start/end points. So that's why I know that <code class="notranslate">search query</code> -> <code class="notranslate">routing destination</code> is much more common than <code class="notranslate">search query</code> -> <code class="notranslate">routing origin</code>.</p>
<p dir="auto">Overall I'd be in favour of this change, even if it frustrates me, because it's much more likely that if you search for one place and use the geolocation button, the searched place is going to be the destination.</p>

<p style="font-size:small;-webkit-text-size-adjust:none;color:#666;">—<br />Reply to this email directly, <a href="https://github.com/openstreetmap/openstreetmap-website/pull/5635#pullrequestreview-2627160624">view it on GitHub</a>, or <a href="https://github.com/notifications/unsubscribe-auth/AAK2OLPGACINDLWUQV2JGUD2QSPGBAVCNFSM6AAAAABWYRUQD6VHI2DSMVQWIX3LMV43YUDVNRWFEZLROVSXG5CSMV3GSZLXHMZDMMRXGE3DANRSGQ">unsubscribe</a>.<br />You are receiving this because you are subscribed to this thread.<img src="https://github.com/notifications/beacon/AAK2OLKJA2F5R4QF6EMJF5L2QSPGBA5CNFSM6AAAAABWYRUQD6WGG33NNVSW45C7OR4XAZNRKB2WY3CSMVYXKZLTORJGK5TJMV32UY3PNVWWK3TUL5UWJTU4S5FDA.gif" height="1" width="1" alt="" /><span style="color: transparent; font-size: 0; display: none; visibility: hidden; overflow: hidden; opacity: 0; width: 0; height: 0; max-width: 0; max-height: 0; mso-hide: all">Message ID: <span><openstreetmap/openstreetmap-website/pull/5635/review/2627160624</span><span>@</span><span>github</span><span>.</span><span>com></span></span></p>
<script type="application/ld+json">[
{
"@context": "http://schema.org",
"@type": "EmailMessage",
"potentialAction": {
"@type": "ViewAction",
"target": "https://github.com/openstreetmap/openstreetmap-website/pull/5635#pullrequestreview-2627160624",
"url": "https://github.com/openstreetmap/openstreetmap-website/pull/5635#pullrequestreview-2627160624",
"name": "View Pull Request"
},
"description": "View this Pull Request on GitHub",
"publisher": {
"@type": "Organization",
"name": "GitHub",
"url": "https://github.com"
}
}
]</script>