search

localgovdrupal / localgov_base

The base theme for LocalGov Drupal websites.
8 stars 15 forks source link

Focus effect on a Labelled Icon. #555

Closed msayoung closed 4 months ago

msayoung commented 5 months ago

In the Subscribe panel paragraph (available on Subsite overview) there are optional Labelled Icons.

The focus effect only applies to the icon rather than the whole link.

image

markconroy commented 4 months ago

We have 2 issues here (both caused by the same item)

  1. The focus style is only applied to the icon, and
  2. The label is wrapping to a second line

The reason for both is because we have <span>s inside the container (which is correct), but inside the title span we are then rendering the field content which pulls in a field template, which places a div inside the span. Being a block-level element, this div is overriding the inline nature of the parent span which causes both of our issues. PR #556 fixes this for us.

Screenshot 2024-06-06 at 11 22 33

=== Thanks to Big Blue Door for sponsoring my time to work on this.