Accordion (+ toggle)
* Note that the accordion title/trigger can be an h2-h6 depending on the context. There is no visual difference, only a semantic difference.
Badge
Box
Color box
Border box
Buttons
Button styles
Button sizes
This is a default sized button
Button block
Button small variant
This is a small button with less padding
Button disabled variant
Button with external link
This is a button with an external link
Card
Card: Primary
Vertical
Title that really grabs attention
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
New IT Infrastructure Upgrade at UBC Completed
The latest IT infrastructure upgrade has been completed, providing enhanced performance, security and reliability for the entire campus.
Horizontal
Jennifer Burns
Chief Information Officer
Reporting to the Provost and Vice-President Academic, Jennifer provides leadership in ensuring the Institution's digital capabilities meet the needs of UBC's teaching and research community, as well as identifying opportunities to deliver efficient and effective administrative solutions.
Susan Anderson
Mechanics of functional materials, such as gecko-inspired adhesives, high toughness elastomers, hydrogels, and nanostructured metal alloys.
Susan Anderson
Mechanics of functional materials, such as gecko-inspired adhesives, high toughness elastomers, hydrogels, and nanostructured metal alloys.
Jennifer Burns
Chief Information Officer
Reporting to the Provost and Vice-President Academic, Jennifer provides leadership in ensuring the Institution's digital capabilities meet the needs of UBC's teaching and research community, as well as identifying opportunities to deliver efficient and effective administrative solutions.
Event Title Goes Here
Reporting to the Provost and Vice-President Academic, Jennifer provides leadership in ensuring the Institution's digital capabilities meet the needs of UBC's teaching and research community, as well as identifying opportunities to deliver efficient and effective administrative solutions.
Card: Icon
Event Title Goes Here
Card: Image
Experiential Learning
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Experiential Learning
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Experiential Learning
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
