A11y: Duplicate id's in GridResponsiveSidebarColumn

[jennur]

The mobile tablet computer only classes has display: none when not visible, but they should also have visibility: hidden to be hidden from assistive technologies (this is currently causing a ton of duplicate id a11y errors).

From my understanding visibility: hidden should do the job, but it needs to be tested.

Edit: From researching this issue, the id's need to be unique regardless of their visibility. This means we need to find a way to assign unique id's to elements for each hidden/visible state. I.e. for the GridResponsiveSidebarColumn, we need to set one id for the input elements in the mobile/tablet version, and one for the desktop version.

Other possible solutions TO BE TESTED (if the id is only used to connect the input with the label):

• Replace the id with aria-label on the inputs