Page Index
Toolkit section with nested column of downloads
3 columns with logos/images vertically aligned
Here is a sample 2 column block - the 'group' provides a div that can go full page width. It is the inner-container that is constrained by the layout container width (currently 1200px)
The top-level group block has classes added: . background-light (sets the light color); .background-alignfull (is what the alignfull block setting 'should' do); and .padding-tb-60 (provides the standard vertical spacing for sections like this)
The columns block has classes added: .act-alignwide (sets the content to the layout-container width); .videos-double (specific for the videos)
Even these paragraphs have the .act-alignwide class added to make sure they don't go beyond the layout-container since they are in a full-width parent. Another option would be to group this intro text into it's own group above the 50/50 columns with the constraining class.
Demonstration Video with Patient: St. Louis University Mental Status (SLUMS)
(6:12 minutes)
Webinar: Administration and Scoring of St. Louis University Mental Status (SLUMS)
(17:13 minutes)
This is just some spacing between 2 full-width sections. The section below the line has a white background with the top/bottom section padding used in all of these types of sections. This paragraph makes use of the class .content-full to constrain it to mid-width that is easier to read for multiple lines of text. Currently set at 1000px
I've added the class .content-narrow to this paragraph to keep it within the narrowest setting for the site. Currently it is set at 800px and centered.
Here is a sample 3 column block - the 'group' provides a div that can go full page width. It is the inner-container that is constrained by the layout container width (currently 1200px)
The top-level group block has classes added: .background-white (sets the white color to override any default set by the theme); .background-alignfull (is what the alignfull block setting 'should' do); and .padding-tb-60 (provides the standard vertical spacing for sections like this)
The columns block has classes added: .act-alignwide (sets the content to the layout-container width); .videos-triple (specific for the videos)
Delivering a
Diagnosis
Demonstration Video with Patient: Delivering a Diagnosis
(8:31 minutes)
Decision-Making & Capacity Assessment
Demonstration Video with Patient and Care Partner: Shared Decision-Making & Assessing Capacity to Consent
(12:42 minutes)
Care
Coordination
Demonstration Video with Patient: Care Coordination
(Full Version 34:48)
This next reusable section has nested columns and also controls the stacking on mobile
The top-level group uses the same classes as the video column blocks: .background-light (sets the light color); .background-alignfull (is what the alignfull block setting 'should' do); and .padding-tb-60 (provides the standard vertical spacing for sections like this)
The columns block has the .act-alignwide but it also includes .reverse-col-stack-mobile (puts the downloadable pdf below the text)
In this instance, the columns are not equal widths. The width is set on the column and can be changed.
The Provider Practice Tools has nested columns for the links. Each tool is 2 columns using: .resource-link (to help identify this column style) and .is-not-stacked-on-mobile (keeps the icon and text aligned on mobile)
Provider Practice Tools
Use these ACT on Alzheimer's® provider practice tools and resources to support patients and clients who have memory concerns and their care partners. These best practice tools incorporate the expertise of clinical and community-based service providers.
View video and webinar tutorials on administering and scoring cognitive screening instruments (MiniCog, SLUMS, MoCA)
Document icon Tips for Screening and Diagnosing in Diverse Populations.
This is just some spacing between 2 full-width sections. The section below the line has a white background with the top/bottom section padding used in all of these types of sections.
The 3 logos are images within a 3 column block. Within the Columns block and the individual columns, the content is set to vertically align in the middle (this block control button works) and the class .mar-b-0 has been added to the images.
Key Resources
column blocks
These are the column blocks that are used in the sector guides and on the front page. Making use of grid and flex box vs the Gutenberg columns that use float. These should respond more gracefully than the Gutenberg version.
First is a set of 3 cards
Dementia
Friendly Toolkit
A step-by-step guide for organizing a planning committee and creating an action plan for building a dementia-friendly community
Dementia Friendly
@ Work
Educational sessions for businesses and service organizations, with special versions for dental and medical offices.
Sector
Guides
Each sector in a community has a role in making it dementia friendly. These guides help provide tips and checklists for how to do it.
Second is a set of 9 cards - delete a group to get rid of an extra
If you want 2 cards wide, add the class .two-cards-wide at the top level group (where class .sector-grid-cards is located) to adjust minimum width of individual cards
Residential
Settings
A step-by-step guide for organizing a planning committee and creating an action plan for building a dementia-friendly community
Legal and
Financial Planning
A step-by-step guide for organizing a planning committee and creating an action plan for building a dementia-friendly community
Faith
Communities
A step-by-step guide for organizing a planning committee and creating an action plan for building a dementia-friendly community
Independent Living
A step-by-step guide for organizing a planning committee and creating an action plan for building a dementia-friendly community
Local Government Services
A step-by-step guide for organizing a planning committee and creating an action plan for building a dementia-friendly community
Transportation and Public Environments
A step-by-step guide for organizing a planning committee and creating an action plan for building a dementia-friendly community
Businesses
A step-by-step guide for organizing a planning committee and creating an action plan for building a dementia-friendly community
Health Care
Educational sessions for businesses and service organizations, with special versions for dental and medical offices.
Dental Care
Each sector in a community has a role in making it dementia friendly. These guides help provide tips and checklists for how to do it
This is the original Gutenberg block on the home page. Saving it here in case the new grid isn't wanted as a replacement
Dementia
Friendly Toolkit
A step-by-step guide for organizing a planning committee and creating an action plan for building a dementia-friendly community.
Dementia Friendly
@ Work
Educational sessions for businesses and service organizations, with special versions for dental and medical offices.
Sector
Guides
Each sector in a community has a role in making it dementia friendly. These guides help provide tips and checklists for how to do it.
