Feature/next/article #263
Feature/next/article #263
Conversation
dw-buildit
added
the
WIP
|
For the 2nd commit |
|
Just adding a cross reference to issue #178, since this partially covers that. Partially, since we don't yet have provisions for article author, tags and/or categories. However, all of those could be added in a future PR, after the website MVP is complete. |
dw-buildit
force-pushed
the
feature/next/article
branch
2 times, most recently
from
21eaa67 to
ae72030
Compare
I did think that this was a feature that developers of Gravity would be able to use (dynamic notch size/position) although I wouldn't actually expect any users to use it. I've changed this commit's message anyway 👍 |
dw-buildit
force-pushed
the
feature/next/article
branch
from
79fa7ed to
8f7716c
Compare
dw-buildit
removed
the
WIP
dw-buildit
force-pushed
the
feature/next/article
branch
2 times, most recently
from
6ca636d to
a2f9aec
Compare
|
|
||
| This is the component for use as the page heading. | ||
|
|
||
| It consists of a `<h1>` as the page title, a `<p>` for a short description of the page, an optional `<time>` to display a date related to this content (usually publication date), and an optional `<img>` which will automatically gain a downward pointing notch. |
There was a problem hiding this comment.
Maybe add some guidance here about when to use a <header> element or a <div> to markup the page intro.
| </article> | ||
| <hr /> | ||
| <aside class="grav-o-container"> | ||
| <ul class="grav-c-related-items"> |
There was a problem hiding this comment.
You should replace this with {% include 'organisms-related-items' %}. That way, if the related items component ever changes, it will be reflected here. Also, it lets Pattern Lab / Fractal create lineage links between those components in the pattern library.
There was a problem hiding this comment.
Definitely! That was an oversight.
| } | ||
|
|
||
| @media all and (max-width: grav-breakpoint(medium)) { | ||
| padding-right: $grav-sp-s; |
There was a problem hiding this comment.
We can avoid this max-width media query. You can set this padding and the blockquote styles outside of the media query.
Then, below, in the min-width media query, where you already alter the blockquote styles as needed, you can update the padding to be large instead of small.
|
@james-nash CR amends completed. |
affects: @buildit/gravity-ui-nunjucks, @buildit/gravity-ui-web
affects: @buildit/gravity-ui-web the mixin now allows you to supply an inset value and a size value. these have to be in the same unit type
affects: @buildit/gravity-ui-web
affects: @buildit/gravity-ui-web
affects: @buildit/gravity-ui-nunjucks, @buildit/gravity-ui-web
affects: @buildit/gravity-ui-nunjucks, @buildit/gravity-ui-web
affects: @buildit/gravity-ui-web
affects: @buildit/gravity-ui-nunjucks, @buildit/gravity-ui-web
affects: @buildit/gravity-ui-nunjucks
affects: @buildit/gravity-ui-nunjucks - added related item to page - added blockquote with citation to copy
affects: @buildit/gravity-ui-web
affects: @buildit/gravity-ui-web
affects: @buildit/gravity-ui-web
affects: @buildit/gravity-ui-web
affects: @buildit/gravity-ui-nunjucks
affects: @buildit/gravity-ui-web
affects: @buildit/gravity-ui-web
affects: @buildit/gravity-ui-web
affects: @buildit/gravity-ui-web
affects: @buildit/gravity-ui-web
affects: @buildit/gravity-ui-nunjucks, @buildit/gravity-ui-web
dw-buildit
force-pushed
the
feature/next/article
branch
from
6bbc2c1 to
b35257b
Compare
|
🎉 This PR is included in version 3.0.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
This PR is two components and some global style updates.
The two components are:
Page Intro
To be used as the
<heading>for most of our pages. It includes the heading, description andoptional time and image as per reference designs.
Ostentatious Copy
This is expected to contain copy that you want to look a little more showy. Generally adds extra padding between elements and around the component itself. Pulls pull quotes out (margin wise) and on larger screen sizes indents a lot from the left.
Style Updates
The PR also includes updates to many text element, list element and some padding styles. Again to better reflect the reference design.
Also
There's styling for the
<hr>element.There's a page for viewing all the article components with semi-realistic data.