Welcome to the Toast Theme.
This is a bare-bones starter theme that we use for our websites.
There’s no design here, just some initial Gutenberg blocks to get us started.
Our theme is built from Gutenberg Blocks, and they are all listed on this page in alphabetical order.
Generally, blocks should not be overly modified for a site build.
If your site needs some custom content, create a new block rather than modifying an existing one.
If in doubt, ask Aaron, Dave or Charlotte.
Accordions.
These do what they say on the tin and can hold and display pretty-much any content.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam augue ipsum, congue a elit at, sagittis aliquam massa. Proin efficitur leo enim, non sodales metus sollicitudin et.
Ut lobortis velit purus, vel ultricies nibh posuere eget. Nullam ornare sem id ligula maximus ullamcorper. Ut porta massa eget justo tempus fringilla. Ut eu commodo dui. Pellentesque ornare, nisi ac posuere pretium, odio ligula rhoncus enim, nec commodo lorem lorem at ligula. Sed quis sapien at tellus efficitur pulvinar. Praesent interdum faucibus iaculis. Nulla facilisi. Aenean eu elit eleifend, accumsan ex at, sodales eros. Etiam ut dui feugiat, aliquam ante at, convallis est. Pellentesque tincidunt rutrum enim, a suscipit neque semper vitae. Nulla sagittis felis risus, eget sodales magna ornare ultrices.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam augue ipsum, congue a elit at, sagittis aliquam massa. Proin efficitur leo enim, non sodales metus sollicitudin et.
Ut lobortis velit purus, vel ultricies nibh posuere eget. Nullam ornare sem id ligula maximus ullamcorper. Ut porta massa eget justo tempus fringilla. Ut eu commodo dui. Pellentesque ornare, nisi ac posuere pretium, odio ligula rhoncus enim, nec commodo lorem lorem at ligula. Sed quis sapien at tellus efficitur pulvinar. Praesent interdum faucibus iaculis. Nulla facilisi. Aenean eu elit eleifend, accumsan ex at, sodales eros. Etiam ut dui feugiat, aliquam ante at, convallis est.
Columns, our main block.
This is some intro text.
Columns use Grid CSS to create flexible layouts for text and image content.
This column has the helper-class boxed p2 applied to it to add shadow and padding.
The size of each column is controlled with Aarons fr- CSS classes.
This block is fr-1-2-1.
These classes also have tablet and mobile options: tablet-fr- and mobile-fr-.
This block also has functions for background colour, background image, padding, margins and text colour, so it’s very flexible.
These are columns with modal popups
This is the optional introduction.
Modal option one
This is a column-based block with a title and a content section and a button that triggers a modal.
This is the modal content.
This can be modified to meet the needs of the theme.
Modal option two
This is a modal column with an image for the modal trigger.
Modal option two
This is the second modal content.
This can be modified to meet the needs of the theme.
This modal was created using a grid that pulls the trigger modal image into the modal with additional text.
This would be used for Team pages with staff pop-ups etc.
Test Video
These modals also work with videos.
@Aaron – We need to add some jQuery to stop the video playing when the modal is closed.
This is a basic, non-designed call-to-action module.
This content is fully editable.
This is another call to action, with the image placed on the right.
This content is fully editable.
This is a flip box column.
This is an experimental block and should be used with caution. Note that if you need more than one row for this block, you should add a new block.
This is the title of the flip.
Ut lobortis velit purus, vel ultricies nibh posuere eget. Nullam ornare sem id ligula maximus ullamcorper.
This is the title of the flip.
Ut lobortis velit purus, vel ultricies nibh posuere eget. Nullam ornare sem id ligula maximus ullamcorper. Ut porta massa eget justo tempus fringilla. Ut eu commodo dui. Pellentesque ornare, nisi ac posuere pretium, odio ligula rhoncus enim, nec commodo lorem lorem at ligula.
Front
Back
Front
Back
This is a hero block.
It generally lives right at the top of the page.
This is button one This is button twoPost listings block.
This is the intro text.
This is the Post Listing Block with Convert to slider ON
This also has the additional style of full-width applied.
Tabs block.
With some optional intro text.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam augue ipsum, congue a elit at, sagittis aliquam massa. Proin efficitur leo enim, non sodales metus sollicitudin et.
Ut lobortis velit purus, vel ultricies nibh posuere eget. Nullam ornare sem id ligula maximus ullamcorper. Ut porta massa eget justo tempus fringilla. Ut eu commodo dui. Pellentesque ornare, nisi ac posuere pretium, odio ligula rhoncus enim, nec commodo lorem lorem at ligula. Sed quis sapien at tellus efficitur pulvinar. Praesent interdum faucibus iaculis. Nulla facilisi. Aenean eu elit eleifend, accumsan ex at, sodales eros. Etiam ut dui feugiat, aliquam ante at, convallis est. Pellentesque tincidunt rutrum enim, a suscipit neque semper vitae. Nulla sagittis felis risus, eget sodales magna ornare ultrices.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam augue ipsum, congue a elit at, sagittis aliquam massa. Proin efficitur leo enim, non sodales metus sollicitudin et.
Ut lobortis velit purus, vel ultricies nibh posuere eget. Nullam ornare sem id ligula maximus ullamcorper. Ut porta massa eget justo tempus fringilla. Ut eu commodo dui. Pellentesque ornare, nisi ac posuere pretium, odio ligula rhoncus enim, nec commodo lorem lorem at ligula. Sed quis sapien at tellus efficitur pulvinar. Praesent interdum faucibus iaculis. Nulla facilisi. Aenean eu elit eleifend, accumsan ex at, sodales eros. Etiam ut dui feugiat, aliquam ante at, convallis est. Pellentesque tincidunt rutrum enim, a suscipit neque semper vitae. Nulla sagittis felis risus, eget sodales magna ornare ultrices.
Etiam ut dui feugiat, aliquam ante at, convallis est. Pellentesque tincidunt rutrum enim, a suscipit neque semper vitae. Nulla sagittis felis risus, eget sodales magna ornare ultrices.
Etiam ut dui feugiat, aliquam ante at, convallis est.
Pellentesque tincidunt rutrum enim, a suscipit neque semper vitae. Nulla sagittis felis risus, eget sodales magna ornare ultrices.
Tiles block.
This is the introduction.
I am tile one.
A flexible block for building tile-based layouts.
I am tile two.
Each tile in the same layout can be different.
This is the title
This is the content of the tile.
Another Tile
This is the content of the tile, this one has a bit more conten.
Vertical tabs block.
With an optional intro section.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam augue ipsum, congue a elit at, sagittis aliquam massa. Proin efficitur leo enim, non sodales metus sollicitudin et.
Ut lobortis velit purus, vel ultricies nibh posuere eget. Nullam ornare sem id ligula maximus ullamcorper. Ut porta massa eget justo tempus fringilla. Ut eu commodo dui. Pellentesque ornare, nisi ac posuere pretium, odio ligula rhoncus enim, nec commodo lorem lorem at ligula. Sed quis sapien at tellus efficitur pulvinar. Praesent interdum faucibus iaculis. Nulla facilisi. Aenean eu elit eleifend, accumsan ex at, sodales eros.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam augue ipsum, congue a elit at, sagittis aliquam massa. Proin efficitur leo enim, non sodales metus sollicitudin et.
Ut lobortis velit purus, vel ultricies nibh posuere eget. Nullam ornare sem id ligula maximus ullamcorper. Ut porta massa eget justo tempus fringilla. Ut eu commodo dui. Pellentesque ornare, nisi ac posuere pretium, odio ligula rhoncus enim, nec commodo lorem lorem at ligula. Sed quis sapien at tellus efficitur pulvinar. Praesent interdum faucibus iaculis. Nulla facilisi. Aenean eu elit eleifend, accumsan ex at, sodales eros. Etiam ut dui feugiat, aliquam ante at, convallis est. Pellentesque tincidunt rutrum enim, a suscipit neque semper vitae. Nulla sagittis felis risus, eget sodales magna ornare ultrices.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Ut lobortis velit purus, vel ultricies nibh posuere eget. Nullam ornare sem id ligula maximus ullamcorper. Sed quis sapien at tellus efficitur pulvinar. Praesent interdum faucibus iaculis. Nulla facilisi. Aenean eu elit eleifend, accumsan ex at, sodales eros. Etiam ut dui feugiat, aliquam ante at, convallis est. Pellentesque tincidunt rutrum enim, a suscipit neque semper vitae. Nulla sagittis felis risus, eget sodales magna ornare ultrices.
