Details component

[mileshinch]

gds https://design-system.service.gov.uk/components/details/#:~:text=Use%20the%20details%20component%20to%20make%20a%20page,that%20the%20majority%20of%20your%20users%20will%20need.

• learn what a details component is and how it is different from accordion
• understand how the component pages are put together
• build a basic component page for Details
• apply gds styling
• parameters
• check basic accessibility requirements
• Examples

[Ibrahim-Haizel]

Would look into this as part of your research

https://svelte.dev/docs/svelte/bind#details-bind:open

honestly not sure how much the accordion is related given the details component can just use the default semantic html tag "<details< >/details>" which I think handles most of the accessibility and state for you

[mileshinch]

Thank you I will look at that.

This afternoon I built the component page. I spent time understanding how the different parts of the component page work.

Next I will work on the component itself. Starting by getting a basic version of it working.

[mileshinch]

I applied GDS styling, added text content parameters and checked some accessibility requirements.
Next steps

• work out what other parameters should be included
• test the component with a screen reader
• work out if it needs ARIA and include if it does
• test on combinations of browsers and operating systems
• test with users - The github discussion mentioned issues with users not clicking it because they thought it was a link.