Typography

Toggle Index

Font

Franklin Gothic will be used across all applications.

                    
                        font-family: 'franklin-gothic-urw',sans-serif;
                        font-weight: 400;

Table Field Names

All field names should be capitalized
Prepositions ("to," "for," "in," "at," "of," etc.) should be lowercase.
If there are two or more words, the words should have a space between them.
There should be no colons after field names.
If a table displays when a record was last modified, the field name should be labeled "Last Modified". The data should be formatted as MM/DD/YYYY by [CompID].

Exam ID	Type	Category	Name	Course	Year	Last Modified
Exam 4813	Type Graded	Category Quiz	Name Medical Care of LGBTQ+ Patients Elective PRL Quiz	Course Medical Care of LGBTQ+ Patients	Year 2020-2021	Last Modified 01/07/2021 by abc123

Button Labels

All button labels should be capitalized.

Prepositions (“to,” “for,” “in,” “at,” “of,” etc.) should be lowercase.

If there are two or more words, the words should have a space between them.

Field Labels

Form field labels should be succinct and descriptive, but they should not contain instructional text/tooltip text. Refer to the Forms page for information on tooltips.
Field labels should be left-aligned above the form field.
There should be no colons after field labels.

Radio Buttons and Checkboxes

There should be a space between the radio buttons/checkboxes and the text associated with them. The text should be to the right of the buttons.

Headings

Page headings should use <h1> tags, and include class="text-2xl".

CSS Code:

                
                    h1 {
                        font-size: 1.5rem;
                        line-height: 2rem;
                        padding-top: 0.5rem;
                    }

For centering a heading include:

                
                    <h1 style="text-align:center">

Page subheadings should use <h2> tags, and include class="text-xl".

CSS Code:

                
                    h2 {
                        font-size: 1.25rem;
                        line-height: 1.75rem;
                    }

Text Standards and Formats

All names should be displayed as First Name Last Name (ComputingID), with the exception of drop-down menus.
For drop-down menus, names should be displayed as Last Name, First Name (ComputingID).
Define what "Year" means. Year should be specified as either SMD Year or Curriculum Year. If Curriculum Year is being used, the format should be xxxx-xxxx.
All dates should be formatted as MM/DD/YYYY.
All times should be formatted as HH:MM XM.