Colors
These are the colors used throughout the site. Each has been assigned to a variable in the "framework/variables.scss" file.
Theme
Monotone Spectrum
Typography
These are our basic typographic styles. Make updates in the "framework/typography.scss" file.
H1. The quick brown fox jumps over the lazy dog.
H2. The quick brown fox jumps over the lazy dog.
H3. The quick brown fox jumps over the lazy dog.
H4. The quick brown fox jumps over the lazy dog.
H5. The quick brown fox jumps over the lazy dog.
H6. The quick brown fox jumps over the lazy dog.
H1. The quick brown fox jumps over the lazy dog.
H2. The quick brown fox jumps over the lazy dog.
H3. The quick brown fox jumps over the lazy dog.
H4. The quick brown fox jumps over the lazy dog.
H5. The quick brown fox jumps over the lazy dog.
H6. The quick brown fox jumps over the lazy dog.
Lead Paragraph
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et justo sed dui feugiat cursus. Phasellus pharetra dui lobortis odio efficitur suscipit. Aenean condimentum ullamcorper ullamcorper. Nunc a tempus neque. Pellentesque nec pharetra purus. Proin fermentum purus non tortor posuere, vel convallis dolor interdum. Suspendisse aliquet felis metus, vel tempus purus tincidunt eget.
Default Paragraph
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et justo sed dui feugiat cursus. Phasellus pharetra dui lobortis odio efficitur suscipit. Aenean condimentum ullamcorper ullamcorper. Nunc a tempus neque. Pellentesque nec pharetra purus. Proin fermentum purus non tortor posuere, vel convallis dolor interdum. Suspendisse aliquet felis metus, vel tempus purus tincidunt eget.
Small Paragraph
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et justo sed dui feugiat cursus. Phasellus pharetra dui lobortis odio efficitur suscipit. Aenean condimentum ullamcorper ullamcorper. Nunc a tempus neque. Pellentesque nec pharetra purus. Proin fermentum purus non tortor posuere, vel convallis dolor interdum. Suspendisse aliquet felis metus, vel tempus purus tincidunt eget.
Blockquote
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam at porttitor sem. Aliquam erat volutpat. Donec placerat nisl magna, et faucibus arcu. John Doe
Lists
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ligula est, aliquam eu blandit ac, dictum nec erat.
- Nulla quis sapien non lacus rutrum mollis suscipit scelerisque velit. In hac habitasse platea dictumst.
- Duis in justo tincidunt, luctus ligula sed, placerat diam. Morbi eget tellus ipsum. Fusce iaculis maximus sem eget tincidunt.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ligula est, aliquam eu blandit ac, dictum nec erat.
- Nulla quis sapien non lacus rutrum mollis suscipit scelerisque velit. In hac habitasse platea dictumst.
- Duis in justo tincidunt, luctus ligula sed, placerat diam. Morbi eget tellus ipsum. Fusce iaculis maximus sem eget tincidunt.
Cards
These are our card styles. Make updates in the "framework/cards.scss" file.
4x (Recipes)
Featured Display (Stories)
3x (Stories)
3x Widescreen (Series)
4x Widescreen Small (Episodes)
Extra Small (Stories & Recipes)
Tiles
These are our tile styles. Make updates in the "framework/tile.scss" file.
Interests Tiles
Appetizers
Appetizers
Appetizers
Appetizers
Appetizers
Appetizers
Appetizers
Appetizers
Appetizers
Appetizers
Appetizers
Carousels
These are our table styles. Make updates in the "framework/carousel.scss" file.
We use Slick.js for carousels. For full documentation and options visit http://kenwheeler.github.io/slick/.
Marquee Slider
Widescreen Slider (Episodes)
Taxonomy Slider (Recipe Categories)
Category
Category
Category
Category
Category
Category
Category
Category
Category
Category
Category
Icon Slider (Story Category)
Grilling & Barbeque
Health & Fitness
Holiday
Kid Friendly
Party Dishes
Popular
Quick & Easy
Slow Cooker
Texas Traditions
Tips & Tricks
Tips & Tricks
Forms
These are our basic form styles. Make updates in the "framework/forms.scss" file.
Notices
These are our basic notice styles. Make updates in the "framework/notices.scss" file.
Success
Info
Warning
Error
Icons
A custom font set has been created using the IcoMoon App.
Arrows & Carets
Social & Interactions
Category Icons
Utilities
Favicons
These are our website favicons and app icons.
SVG (Scalable)
Android (512x512)
Android (192x192)
Apple (180x180)
Favicon (32x32)
Modals
These are our modal styles. Make updates in the "framework/modals.scss" file.
Loading Elements
These are our built-in options to add loaders to a section or page. Make updates in the "loading.scss" file.
This is a modal title
Nostrud ad veniam nulla aute est velit. Esse esse cupidatat amet velit id elit consequat minim ullamco mollit. Excepteur ea laboris adipisicing aliqua proident occaecat do.
This is a modal title
Nostrud ad veniam nulla aute est velit. Esse esse cupidatat amet velit id elit consequat minim ullamco mollit. Excepteur ea laboris adipisicing aliqua proident occaecat do.
This is a modal title
Nostrud ad veniam nulla aute est velit. Esse esse cupidatat amet velit id elit consequat minim ullamco mollit. Excepteur ea laboris adipisicing aliqua proident occaecat do.
This is a modal title
Nostrud ad veniam nulla aute est velit. Esse esse cupidatat amet velit id elit consequat minim ullamco mollit. Excepteur ea laboris adipisicing aliqua proident occaecat do.
This is a modal title
Nostrud ad veniam nulla aute est velit. Esse esse cupidatat amet velit id elit consequat minim ullamco mollit. Excepteur ea laboris adipisicing aliqua proident occaecat do.
User Interactions & Social
We have some built-in functions that make use of data attributes to make sharing on common social networks easier. You can find out more by viewing the "lib/wl-share.js" file.
Red Vertical
Black Horizontal