| summary | time | deliverables |
|---|---|---|
Style the basic typography, colours and generic HTML elements for the eCommerce pattern library. |
2 hours |
Pattern library |
- Continue work on your
ecommerce-pattern-library - Targeting only HTML tags within your
theme.css, style the basic typography for your website. - Consider & style all the possible HTML tags related to typography.
- Think about the default typography for generic HTML elements:
- What’s the default stying for an
<h1>(not all<h1>tags need look the same, but what’s the primary) - What’s the default stying the links?
- What’s the default stying for lists?
- etc.
- What’s the default stying for an
Make sure to style (or at least consider) the following tags:
- Headings:
<h1>,<h2>,<h3>,<h4>,<h5>,<h6> - Lists:
<ul>,<ol>,<dl> - Links:
<a> - Blockquotes:
<blockquote>,<cite> - Emphasis & edits:,
<em>,<strong>,<del>,<ins>,<abbr>,<dfn>,<i>,<b>,<mark>,<q>,<s>,<u>
Focus on color, font-weight, font-style & font-family. We don’t need to specify margin, padding or font-size because those already exist within the Typografier classes.
You don’t have to refresh your whole Pattern Library after every change—it’s really slow So you can open up each section in the pattern library into a new browser tab and refresh there. Look for the little pop-out arrow at the top of a section.
Show teacher for marks during next class.