The sock component is the main call to action and displays three large, animated links to the user.
Name Description
slot[name=""] The default slot the children of the sock, has a max child count of 3
slot[name="edit-description"] A slot for handling inline editing of the description attribute, if the attribute is present this will not be shown
slot[name="edit-header"] A slot for handling inline editing of the header attribute, if the attribute is present this will not be shown
part::(base) The base suite-surface element
part::(items-wrapper) The wrapper around the default slot
Main Sock Example The sock component is for displaying a series of links together and has a max child count of 3.
Apply Now Request Information Tour Campus
Detailed Sock Example The sock component has a "detailed" variant for displaying sections with headers, descriptions, and calls to action. It also has a max child count of 3.
Application Process Tuition and Fees Financial Aid Tour Campus
 For use in the detailed sock variant to display more information in each section.
Name Description
slot[name="cta"] The slot for calls to action
part::(base) The base suite-surface element
part::(header) The suite-text component for the header
part::(description) The suite-text component for the description
part::(cta-wrapper) The wrapper around the cta slot
Highlighting a Word in the Header The sock-item component has a header attribute that can highlight a word using the ** identifier.
Application Process Tuition and Fees Financial Aid Tour Campus