Browse Source

Refactor document list component to have better semantics

pull/516/head
Paul Robert Lloyd 3 years ago
parent
commit
c53f7298af
  1. 16
      app/components/document_list_component.html.erb
  2. 7
      app/frontend/styles/_document-list.scss

16
app/components/document_list_component.html.erb

@ -1,15 +1,15 @@
<ul class="app-document-list">
<dl class="app-document-list">
<% items.each do |item| %>
<li class="app-document-list__item">
<h3 class="app-document-list__item-title">
<div class="app-document-list__item">
<dt class="app-document-list__item-title">
<%= govuk_link_to item[:name], item[:href] %>
</h3>
</dt>
<% if item[:description] %>
<p class="app-document-list__item-description"><%= item[:description] %></p>
<dd class="app-document-list__item-description"><%= item[:description] %></dd>
<% end %>
<% if item[:metadata] %>
<p class="app-document-list__item-metadata"><%= item[:metadata] %></p>
<dd class="app-document-list__item-metadata"><%= item[:metadata] %></dd>
<% end %>
</li>
</div>
<% end %>
</ul>
</dl>

7
app/frontend/styles/_document-list.scss

@ -1,15 +1,8 @@
.app-document-list {
list-style: none;
padding: 0;
}
.app-document-list__item {
margin-bottom: govuk-spacing(4);
&:last-child {
border-bottom: 0;
margin-bottom: 0;
padding-bottom: 0;
}
}

Loading…
Cancel
Save