<p dir="auto">Implemented this:</p>
<blockquote>
<p dir="auto"><a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1319980982" data-permission-text="Title is private" data-url="https://github.com/openstreetmap/openstreetmap-website/issues/3631" data-hovercard-type="pull_request" data-hovercard-url="/openstreetmap/openstreetmap-website/pull/3631/hovercard?comment_id=1203797930&comment_type=issue_comment" href="https://github.com/openstreetmap/openstreetmap-website/pull/3631#issuecomment-1203797930">#3631 (comment)</a><br>
Many of the close buttons <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="726596516" data-permission-text="Title is private" data-url="https://github.com/openstreetmap/openstreetmap-website/issues/2901" data-hovercard-type="pull_request" data-hovercard-url="/openstreetmap/openstreetmap-website/pull/2901/hovercard" href="https://github.com/openstreetmap/openstreetmap-website/pull/2901">#2901</a> recently to use flexbox for layout, rather than floating, but there's still some (as found in this PR) where the icons are floating around. These could be refactored to follow the convention used in the sidebar.</p>
</blockquote>
<p dir="auto">Also refactored common code in Leaflet sidebars that wrote close buttons among other things.</p>

<hr>

<h4>You can view, comment on, or merge this pull request online at:</h4>
<p>  <a href='https://github.com/openstreetmap/openstreetmap-website/pull/3666'>https://github.com/openstreetmap/openstreetmap-website/pull/3666</a></p>

<h4>Commit Summary</h4>
<ul>
  <li><a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/commits/8a02bd67d9d20c4a6b01b58e88b8d65163a3798e" class="commit-link">8a02bd6</a>  Create Leaflet sidebar pane control with header writer fn</li>
  <li><a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/commits/71e7208a0aceccf47edce739803130096999da5d" class="commit-link">71e7208</a>  Create pane button fn</li>
  <li><a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/commits/9acde429bf8e92c67233461e8a6f5074eb2ff637" class="commit-link">9acde42</a>  Inverted onAdd() method of sidebar panes</li>
  <li><a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/commits/4ef55ac3aaa7bad06dbded9ebdf20d2f8e45f35c" class="commit-link">4ef55ac</a>  Position Leaflet sidebar close buttons with flex</li>
  <li><a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/commits/41924fb69e8393fbf7360128ccc3e094a7e1b793" class="commit-link">41924fb</a>  Remove unnecessary float from flex-positioned close button</li>
  <li><a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/commits/5a256a6f2bf13d8d364b4f8daa6c4f6577de1540" class="commit-link">5a256a6</a>  Position 'too many features' close button with flex</li>
  <li><a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/commits/f41b5558b7230f2d557c358febf0ed9b669407c7" class="commit-link">f41b555</a>  Position directions close button with flex</li>
  <li><a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/commits/2da8855cc2d6a0dd9be8e5eebd96c1f7df277135" class="commit-link">2da8855</a>  Fix eslint errors</li>
</ul>

<h4 style="display: inline-block">File Changes </h4> <p style="display: inline-block">(<a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/files">9 files</a>)</p>
<ul>
  <li>
    <strong>M</strong>
    <a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/files#diff-cdc070ced1c4000efd1e28357fd26b2fd617d7fccfeae0324222231db75dd6ee">app/assets/javascripts/index.js</a>
    (1)
  </li>
  <li>
    <strong>M</strong>
    <a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/files#diff-999fd69dc428de17d14446f737f8c03cd280be7b66a1ac07fb765b900a19c2c4">app/assets/javascripts/index/browse.js</a>
    (29)
  </li>
  <li>
    <strong>M</strong>
    <a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/files#diff-fdb9558c2ba79ddf9fbcb92594a8a8fa54abb1b3e25ce264de37951b428a958b">app/assets/javascripts/index/directions.js</a>
    (29)
  </li>
  <li>
    <strong>M</strong>
    <a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/files#diff-08a7ab143240d1f24d2cfc6f105ae9a1d8bc7fc5d1b95a280cb8a76180e93397">app/assets/javascripts/leaflet.key.js</a>
    (41)
  </li>
  <li>
    <strong>M</strong>
    <a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/files#diff-87e33ea7d5e625dd851a78a3192719681de20caea8edd278a10f5342585c98e7">app/assets/javascripts/leaflet.layers.js</a>
    (40)
  </li>
  <li>
    <strong>M</strong>
    <a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/files#diff-e15f8139afbbcbe98b89298674e7980a4a4500dbc54a431e1325a11adfe83f83">app/assets/javascripts/leaflet.share.js</a>
    (51)
  </li>
  <li>
    <strong>A</strong>
    <a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/files#diff-c4925852e0efd740fa9486b55efb267e4d1f1984fcdcd3125c5d1784b7a0f7a1">app/assets/javascripts/leaflet.sidebar-pane.js</a>
    (53)
  </li>
  <li>
    <strong>M</strong>
    <a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/files#diff-a822b3bdb367bb476aeea5e822498b298c7f314c747785581ea64963a9fd3363">app/views/application/_sidebar_header.html.erb</a>
    (2)
  </li>
  <li>
    <strong>M</strong>
    <a href="https://github.com/openstreetmap/openstreetmap-website/pull/3666/files#diff-60b815932a6942ef4da576f75ee4e9b670e2aeb07950b7f8494bdbedb319c8c2">app/views/layouts/_search.html.erb</a>
    (2)
  </li>
</ul>

<h4>Patch Links:</h4>
<ul>
  <li><a href='https://github.com/openstreetmap/openstreetmap-website/pull/3666.patch'>https://github.com/openstreetmap/openstreetmap-website/pull/3666.patch</a></li>
  <li><a href='https://github.com/openstreetmap/openstreetmap-website/pull/3666.diff'>https://github.com/openstreetmap/openstreetmap-website/pull/3666.diff</a></li>
</ul>

<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/3666">view it on GitHub</a>, or <a href="https://github.com/notifications/unsubscribe-auth/AAK2OLOZ65GAHOYEO65RXBLV3KHJTANCNFSM57Z7UO3Q">unsubscribe</a>.<br />You are receiving this because you are subscribed to this thread.<img src="https://github.com/notifications/beacon/AAK2OLPZIQJ2JXXL5NHL4DTV3KHJTA5CNFSM57Z7UO32YY3PNVWWK3TUL52HS4DFUVEXG43VMWVGG33NNVSW45C7NFSM4UFH7UWA.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/3666</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/3666",
"url": "https://github.com/openstreetmap/openstreetmap-website/pull/3666",
"name": "View Pull Request"
},
"description": "View this Pull Request on GitHub",
"publisher": {
"@type": "Organization",
"name": "GitHub",
"url": "https://github.com"
}
}
]</script>