govuk-design-system-backlog icon indicating copy to clipboard operation
govuk-design-system-backlog copied to clipboard

Panel

Open govuk-design-system opened this issue 7 years ago • 12 comments

Use this issue to discuss this component in the GOV.UK Design System.

govuk-design-system avatar Jan 12 '18 16:01 govuk-design-system

The usage of .app-contact-panel on various pages uses a .govuk-link:focus link focus style #005ea5 on #ffbf47 which has a color contrast ratio of 4.07:1. I believe #0055a5 is the closest color that maintains 4.50:1.

AutoSponge avatar Jun 25 '18 17:06 AutoSponge

Hi Paul,

Thanks for raising that - good spot. This issue relates to the wider panel component from the Design System, so I'm going to copy your issue ot the Design System repo so we can track it there.

Ollie

36degrees avatar Jun 26 '18 08:06 36degrees

Ideas for future iterations of the panel component:

  • make it more generic, so it can be used to create other kinds of panel

timpaul avatar Jul 02 '18 15:07 timpaul

Interested to know why the text on this is centred as opposed to left-aligned as with pretty much everything else in the Design System.

JodiB-TPR avatar Aug 13 '21 17:08 JodiB-TPR

Hi @JodiB-TPR, we discussed this among the team and we think the reasoning for the centre aligned text in the panel was to make it stand out more; however this design decision was made a long time so we can’t be sure there wasn’t more to it!

We might decide differently today, but if we wanted to make a change we’d want to have evidence that the centre align was causing problems for users.

I hope this helps!

lfdebrux avatar Aug 18 '21 08:08 lfdebrux

I think I might have been the first to use this as success confirmation in a service, on Register to vote. I took the pattern from GOV.UK Publishing - for short, 'main answer' content:

https://www.gov.uk/bank-holidays https://www.gov.uk/vat-rates

As such I think they're centred as they are short and stand out from normal content. But yeh I don't know if we reviewed it all again that we might make everything left aligned.

joelanman avatar Aug 18 '21 13:08 joelanman

As part of the GOV.UK Frontend v3.14.0 ‘feature release’, we’ve fixed an accessibility issue where text could overflow the panel component. Thanks to @philsherry for originally reporting this issue.

vanitabarrett avatar Oct 04 '21 15:10 vanitabarrett

Out of interest, why isn't the text following the heading in a paragraph? It probably makes no difference to screen readers, but it is semantic to wrap text inside of <p> tags.

anevins12 avatar Oct 05 '21 07:10 anevins12

Hi, I'd like to share a variation to the panel component we've been using in Borders and trade - Goods Vehicle Movement Service (GVMS).

We've used the panel to display a barcode that lorry drivers use at border locations or inspection sites that the Border Force officers can scan to see the details of the movement. On average, 110,000 of these are created every week and we have positive feedback it works well (see below)

We also have video footage of the bar code in usage and we'll be happy to share if needs be.

"The barcode is critical for maintaining flow, it is very useful for customers who are simply able to present 2 barcodes (GMR and a French barcode equivalent) and useful for us, as our staff are quickly able to perform a scan. When GMRs are introduced for GB – EU traffic we will see the benefits on the UK terminal for this too"

“Barcode is great and working well, it has made a huge difference in minimising errors and we see the positive of this at the check in, in keeping the traffic flowing. We are very pleased that HMRC introduced this”

Bar code

Joe-Smart1 avatar Jul 24 '23 14:07 Joe-Smart1