Reference Guide
This guide walks through the many component features and styling that will be displayed on the live SCASr website. Navigate to a component of interest for a quick preview!
Accordion
Use this component on a page to serve as an at-a-glance view of important content with the ability to delve deeper into more content under that title if desired. Accordions can also be used to minimize scrolling and create interesting large lists without displaying large amounts of text all at once.
Articles
This component takes a singular image and wraps it with long text. This can be used with a bio or a scientific paper to show the scientist behind the paper and the paper contents.
BioCards
Use this component for small headshots and captions like photos of the board of directors.
Blogs
Blogs can be used to preview and link to web pages with longform text and images (ie: a Student Reports section that displays each report in the same section.) This component allows users to easily navigate to the desired report to view.
Buttons Internal and External
Use buttons to create a simple and eye catching way for end users to interact with your website. Whether registering for a grant or navigating from one page to another, internal and external linking buttons make navigation easy for the user.
Callouts
Callouts share similar purposes to buttons helping end users navigate internally and externally by using a helpful icon or image. Use these to attract and help users take actions like becoming a member or making a donation.
Content
Use this component to add any text, paragraphs, headings, bulleted lists, hyperlinks, and tables.
Events
This component is best used for creating schedules and small Calendars with information specific to a particular event. Events can also link out to a page with additional details.
Forms
Use forms to collect information from users (ie: submissions, sign up for newsletter, etc.)
Page Images
This component can be used to add images to be displayed on a page with or without image captions.
PhotoGallery
This component can be used to create multiple preview cards with captions and an image carousel upon image card selection.
Preview Cards:
Carousel:
VideoBlog
To publish youtube videos on a page use the videoblog component and enter a video description.
