Dividing Up the Title Area Styles

In this episode, you will walk through a couple of different approaches to handling the title area. Notice that it is comprised of the base styles for the title area plus the site title, site description, and header image styles. Ah, each of those is sub-components within the sub-module. So how would you handle the Sass styles?

A good rule of thumb is: can you quickly and easily find the styles. By breaking them up into partials for each of the sub-components, you can more easily find what you are looking for just by reading the partial’s file name. All site title styles are found then in the _site-title.scss partial.

Another strategy is to combine sub-components and leave them in a larger file, such as _title-area.scss. But then you need to realize what components are in that file.

Let’s walk through breaking up the title area into smaller, sub-component-centric partials.