Skip to content

Course List

The 2-Column Curriculum table is constructed using one or more Curriculum Table Subheaders along with an Accordion below each subheader.

Table of Contents

  1. Anatomy
  2. Usage Guidelines
    1. What can be customized?
  3. Specifications
    1. Properties
  4. Changelog
  5. Related
    1. Contains
  6. Examples

Anatomy

  1. Heading
  2. Description
  3. Groups

Usage Guidelines

The 2-Column Curriculum table is constructed using one or more Curriculum Table Subheaders along with an Accordion below each subheader.

  1. Clicking/tapping the View Long Course Description link takes the user to the associated Long Course Description page.

  2. In the designs in the left column a total credits required element sits under the header. It is a manual number, not dynamically calculated.

  3. Above each course group is a title in the highlight text style and an optional manual total for that group.

  4. Accordions are collapsed upon initial page load.

  5. The accordions display a title and credits for each course. In mobile the credits drop to the next line and are prefaced by, "Credit Hours".

  6. Expanding an accordion reveals a short description and a link to "View Course Abstract" if configured.

What can be customized?

  • Colors of accordions are dictated from accordion component.
  • Showing total credit hours per course or not.
  • Text of total credits required uses highlight style.
  • The header 'Curriculum Details' can be customized as of TUX Release 1.14.0 Dec 22, 2020

Specifications

Properties

PropertyTypeDescriptionRequiredDefault
descriptionstring HTML that goes in the left column. Yes-
course_groupsarray array of arrays each containing a title string and an array of courses with title and content strings that map to the accordion component. Yes-
└ itemstring - --
Headingstring Text for heading element. Defaults to 'Curriculum Details'. No-

Changelog

6.15.0 (2024-08-28)

  • fix: add plural credits when remove hours (2895d0b)

1.13.0 (2020-11-19)

  • fix: create standalone component template (68bfb8c)

1.8.0 (2020-08-03)

  • fix: position credits label on mobile (3363552)
  • fix: remove required courses header (a1bc689)

1.1.0

  • course-list added

Contains

Other core components embedded within this template.

Examples

Default

Curriculum Details

Nulla vitae elit libero, a pharetra augue. Nullam id dolor id nibh ultricies vehicula ut id elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

Set A

Credits

Maecenas sed diam eget risus varius blandit sit amet non magna. Cras mattis consectetur purus sit amet fermentum. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.

Nulla vitae elit libero, a pharetra augue. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.

Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Etiam porta sem malesuada magna mollis euismod.

Set B

Credits

Maecenas sed diam eget risus varius blandit sit amet non magna. Cras mattis consectetur purus sit amet fermentum. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.

Nulla vitae elit libero, a pharetra augue. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.

Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Etiam porta sem malesuada magna mollis euismod.

{{ include( 'components/course-list.twig', {
	description: "<p>Nulla vitae elit libero, a pharetra augue. Nullam id dolor id nibh ultricies vehicula ut id elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>"
	course_groups: {...}
} ) }}