This text is for placement only. Vestibulum id ligula porta felis euismod semper. Maecenas sed diam eget risus varius blandit sit amet non magna. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Nullam id dolor id nibh ultricies vehicula ut id elit.
AccordionSCSS Location: /styles/scss/partial/_accordion.scss
- Status: Design
- Status: Development
- Status: Documentation
Displays a condensed list of content with specific titles and descriptions grouped together. All accordion panels are closed by default - expanding when the user clicks one of the accordion section titles.
- An accordion can be expanded or collapsed by clicking the entire header area or plus/minus icon.
- Users may have multiple accordions open at once.
Accordions deliver large amounts of content in a small space through progressive disclosure, and work especially well whenever vertical space is at premium. All accordion panels are closed by default – expanding when the user clicks one of the accordion section titles.
This accordion comes with a configuration attribute,
data-accordion-config-single that enables you to decide whether you want the accordion panel siblings to close or remain opened when selecting another panel. The example above is set to
- Each accordion header title is contained in an element with
- If the accordion panel is visible, the header button element should have
aria-expandedset to true. If the panel is not visible,
aria-expandedis set to false.
- Headers should have visible keyboard focus state
- All keyboard interactions relate to when headers are focused
Tab= Move to next focusable element
Space= Expand/Collapse Panel
Shift + Tab= Move to previous focusable element
↓= Cycle headers when header focused
Control + Option
→= Navigate through accordion content with screen reader
Screen Reader Expectations
When interacting with accordions, screen readers should announce the following information:
- Button (or other actionable element)
- Current state of Button - expanded or collapsed
- Panel content will be read if navigated to
Tab Order Expectations
When navigating through an accordion, the following tab order is expected:
- The next tab keypress will advance to the next Header text.
- When expanded and focused, all focusable elements inside the Accordion Panel are included in the tab order.
Our Total Rewards philosophy articulates the value of a career at Vertex. It represents the broad spectrum of programs we’ve designed to reward you throughout your career.
We demonstrate our commitment to Total Rewards through:
- Corporate Culture. We maintain a collaborative, friendly, and fun work environment that fosters outstanding performance, continual innovation, and a passion for understanding and addressing our customers’ needs.
- Work/Life Balance. We support work/life balance, helping you manage your time and energy between work and other aspects of your life.
- Career Opportunities. In both formal and informal ways, we offer opportunities for our people to learn, develop, and contribute.
Blockchain has given rise to new markets and new ways of connecting buyers and sellers -- such as value exchange and payments options based on general-purpose cryptocurrencies (Bitcoin) or in special-purpose tokens exchangeable for goods and services (utility and stablecoin tokens). Central bank interest, the rapid emergence of these global digital assets, and the digitization of global trade have challenged existing jurisdictional approaches to regulation including taxation.
We are at the forefront of these trends exploring how Blockchain can be utilized to help implement and comply with regulation.