feat(pharos): add layout component

[Niznikr]

This change: (check at least one)

• Adds a new feature
• Fixes a bug
• Improves maintainability
• Improves documentation
• Is a release activity

Is this a breaking change? (check one)

• Yes
• No

Is the: (complete all)

• Title of this pull request clear, concise, and indicative of the issue number it addresses, if any?
• Test suite(s) passing?
• Code coverage maximal?
• Changeset added?

What does this change address?
Add a layout component for our various page layouts used on the platform. The three layouts include:

• 1 column: margins range from 1.25rem to 9rem with fixed-width content
• 1 column w/sidenav: margin is 1.5rem on mobile, otherwise 3.5rem with fluid content
• 2 column: margin is 1.5rem on mobile, otherwise 3.5rem with fluid content

The layouts should support our defined breakpoints:

• small: 360px
• medium: 768px
• large: 1056px
• xlarge: 1360px
• max: 1584px

How does this change work?

• Add design tokens for breakpoints and grid gutter
• Add layout component which applies a 12-column grid for a specified layout
• Add Sass mixins for establishing grid styles for the breakpoints
• Add Sass maps for storing column and margin design decisions
• Update example Storybook pages to utilize the component

Additional context
CSS variables cannot currently be used for media queries so I opted to use the Sass tokens.

[changeset-bot]

🦋 Changeset detected

Latest commit: 41151ec

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages

Name	Type
@ithaka/pharos	Minor
@ithaka/pharos-cli	Patch
@ithaka/pharos-site	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[daneah]

Overall I think I enjoy the DX of this. This component feels geared pretty specifically toward page-level layouts, and as such I wonder if it might be better to name it <pharos-layout> or similar to avoid conveying that it should be used for granular gridding needs.

[Niznikr]

Yeah <pharos-layout> might work better! Will see how others feel about that.