<p><span class="issue-keyword tooltipped tooltipped-se" aria-label="This pull request closes issue #2823.">Fixes</span> <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="697624749" data-permission-text="Title is private" data-url="https://github.com/openstreetmap/openstreetmap-website/issues/2823" data-hovercard-type="issue" data-hovercard-url="/openstreetmap/openstreetmap-website/issues/2823/hovercard" href="https://github.com/openstreetmap/openstreetmap-website/issues/2823">#2823</a></p>
<p>The panels are collapsed by default, when there is a long list of features, but open on short lists to save on clicks. 10 items is arbitrary but seemed reasonable.</p>
<p><a target="_blank" rel="noopener noreferrer" href="https://user-images.githubusercontent.com/360803/93344084-9085df80-f831-11ea-979b-42d66143c8dd.png"><img src="https://user-images.githubusercontent.com/360803/93344084-9085df80-f831-11ea-979b-42d66143c8dd.png" alt="Screenshot from 2020-09-16 15-29-19" style="max-width:100%;"></a></p>
<p>This is one of those "how hard can it be", "oh wait that took longer than expected" kinds of thing. Thanks to <a class="user-mention" data-hovercard-type="user" data-hovercard-url="/users/tordans/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/tordans">@tordans</a> for the pure-html suggestion, I think it looks reasonable. But I think a proper designer could do better. I'm not 100% happy with the duplication between the <code><h4></code> section titles and the <code><summary></code> labels, but putting titles in the summaries breaks the layout and I think this PR is at least a little better than the previous situation. Similarly, I went back and forth on whether small lists should be handled differently, whether small lists should even have the summaries, and trying to balance consistent behaviour vs excess clicking etc.</p>
<p>Feedback welcome, and I'm happy to change things in future too.</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/2837'>https://github.com/openstreetmap/openstreetmap-website/pull/2837</a></p>
<h4>Commit Summary</h4>
<ul>
<li>Show linked features as collapsable detail panels on feature browse pages</li>
</ul>
<h4>File Changes</h4>
<ul>
<li>
<strong>M</strong>
<a href="https://github.com/openstreetmap/openstreetmap-website/pull/2837/files#diff-cadb03614fd69c72a82a99f6af6c3c22">app/views/browse/_node.html.erb</a>
(24)
</li>
<li>
<strong>M</strong>
<a href="https://github.com/openstreetmap/openstreetmap-website/pull/2837/files#diff-f2fb4b9ca7f6bb961fc6c28d8f964a52">app/views/browse/_relation.html.erb</a>
(14)
</li>
<li>
<strong>M</strong>
<a href="https://github.com/openstreetmap/openstreetmap-website/pull/2837/files#diff-680c699c09c527162aa641c79b872fce">app/views/browse/_way.html.erb</a>
(34)
</li>
<li>
<strong>M</strong>
<a href="https://github.com/openstreetmap/openstreetmap-website/pull/2837/files#diff-37c9b835927e3c363588f172de9bb6fa">config/locales/en.yml</a>
(11)
</li>
</ul>
<h4>Patch Links:</h4>
<ul>
<li><a href='https://github.com/openstreetmap/openstreetmap-website/pull/2837.patch'>https://github.com/openstreetmap/openstreetmap-website/pull/2837.patch</a></li>
<li><a href='https://github.com/openstreetmap/openstreetmap-website/pull/2837.diff'>https://github.com/openstreetmap/openstreetmap-website/pull/2837.diff</a></li>
</ul>
<p style="font-size:small;-webkit-text-size-adjust:none;color:#666;">—<br />You are receiving this because you are subscribed to this thread.<br />Reply to this email directly, <a href="https://github.com/openstreetmap/openstreetmap-website/pull/2837">view it on GitHub</a>, or <a href="https://github.com/notifications/unsubscribe-auth/AAK2OLI5VNY2R6UP7T7KBZLSGC5MVANCNFSM4RO3C2SA">unsubscribe</a>.<img src="https://github.com/notifications/beacon/AAK2OLMN2YRJT4MA6QTISVLSGC5MVA5CNFSM4RO3C2SKYY3PNVWWK3TUL52HS4DFUVEXG43VMWVGG33NNVSW45C7NFSM4KPDONSQ.gif" height="1" width="1" alt="" /></p>
<script type="application/ld+json">[
{
"@context": "http://schema.org",
"@type": "EmailMessage",
"potentialAction": {
"@type": "ViewAction",
"target": "https://github.com/openstreetmap/openstreetmap-website/pull/2837",
"url": "https://github.com/openstreetmap/openstreetmap-website/pull/2837",
"name": "View Pull Request"
},
"description": "View this Pull Request on GitHub",
"publisher": {
"@type": "Organization",
"name": "GitHub",
"url": "https://github.com"
}
}
]</script>