Unlock your potential with a Pro Membership
Here is where you propel your career forward. Come join us today. Learn more.
Dividing Up the Title Area Styles
Lab: Part 2c – Header Sass Module – Developer’s Genesis Starter Child Theme
Video Runtime: 05:15
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.
Code. Eat. Code. Sleep. Dream about Code. Code.
Episodes
Total Lab Runtime: 00:47:58
- 1 Lab Introductionfree 02:45
- 2 Base Stylespro 04:09
- 3 Dividing Up the Title Area Stylespro 05:15
- 4 Title Area Styles - Part 1pro 14:54
- 5 Title Area Styles Part 2pro 06:17
- 6 Header Right Stylespro 12:22
- 7 Push the Theme to GitHubpro 02:16