Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

In blockquotes, use cite element instead of footer. #2647 #2859

Closed
wants to merge 4 commits into from
Closed

In blockquotes, use cite element instead of footer. #2647 #2859

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
fb9eee0
In blockquotes, use cite element instead of footer. #2647
tfrommen Oct 2, 2017
41da560
Remove obsolete CSS rule.
tfrommen Oct 3, 2017
210f465
Add support for legacy citation in <footer> element. #2647
tfrommen Oct 4, 2017
0e66d37
Add support for styling legacy footer-based citations.
tfrommen Oct 10, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion blocks/library/pullquote/editor.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
}

.wp-block-pullquote {
footer .blocks-editable__tinymce[data-is-empty="true"]:before {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is there ever a scenario where this rule is applied? Looks like this is old and safe to remove.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just tell me (anyone) if I should remove it, or not. 🙂

cite .blocks-editable__tinymce[data-is-empty="true"]:before {
font-size: 14px;
font-family: $default-font;
}
Expand Down
6 changes: 3 additions & 3 deletions blocks/library/pullquote/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ registerBlockType( 'core/pullquote', {
},
citation: {
type: 'array',
source: children( 'footer' ),
source: children( 'cite,footer' ),
},
align: {
type: 'string',
Expand Down Expand Up @@ -83,7 +83,7 @@ registerBlockType( 'core/pullquote', {
/>
{ ( citation || !! focus ) && (
<Editable
tagName="footer"
tagName="cite"
value={ citation }
placeholder={ __( 'Write caption…' ) }
onChange={
Expand All @@ -106,7 +106,7 @@ registerBlockType( 'core/pullquote', {
<blockquote className={ `align${ align }` }>
{ value && value.map( ( paragraph, i ) => <p key={ i }>{ paragraph.props.children }</p> ) }
{ citation && citation.length > 0 && (
<footer>{ citation }</footer>
<cite>{ citation }</cite>
) }
</blockquote>
);
Expand Down
6 changes: 1 addition & 5 deletions blocks/library/pullquote/style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,15 +21,11 @@
line-height: 1.6;
}

footer {
cite {
color: $dark-gray-600;
position: relative;
font-weight: 900;
text-transform: uppercase;
font-size: 13px;
}

footer p {
font-family: $default-font;
}
}
6 changes: 3 additions & 3 deletions blocks/library/quote/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ registerBlockType( 'core/quote', {
},
citation: {
type: 'array',
source: children( 'footer' ),
source: children( 'cite,footer' ),
},
align: {
type: 'string',
Expand Down Expand Up @@ -194,7 +194,7 @@ registerBlockType( 'core/quote', {
/>
{ ( ( citation && citation.length > 0 ) || !! focus ) && (
<Editable
tagName="footer"
tagName="cite"
value={ citation }
placeholder={ __( 'Write citation…' ) }
onChange={
Expand Down Expand Up @@ -222,7 +222,7 @@ registerBlockType( 'core/quote', {
<p key={ i }>{ paragraph.props.children }</p>
) ) }
{ citation && citation.length > 0 && (
<footer>{ citation }</footer>
<cite>{ citation }</cite>
) }
</blockquote>
);
Expand Down
4 changes: 2 additions & 2 deletions blocks/library/quote/style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
margin: 0 0 16px;
box-shadow: inset 0px 0px 0px 0px $light-gray-500;

footer {
cite {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We should also probably keep these rules for a few releases as cite, footer {}.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@mtias makes sense—for a while. I just did that.

color: $dark-gray-100;
margin-top: 1em;
position: relative;
Expand All @@ -23,7 +23,7 @@
font-style: italic;
line-height: 1.6;
}
footer {
cite {
font-size: 19px;
text-align: right;
}
Expand Down
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__pullquote.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<!-- wp:core/pullquote -->
<blockquote class="wp-block-pullquote">
<p>Testing pullquote block...</p><footer>...with a caption</footer>
<p>Testing pullquote block...</p><cite>...with a caption</cite>
</blockquote>
<!-- /wp:core/pullquote -->
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__pullquote.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,6 @@
],
"align": "none"
},
"originalContent": "<blockquote class=\"wp-block-pullquote\">\n<p>Testing pullquote block...</p><footer>...with a caption</footer>\n</blockquote>"
"originalContent": "<blockquote class=\"wp-block-pullquote\">\n<p>Testing pullquote block...</p><cite>...with a caption</cite>\n</blockquote>"
}
]
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__pullquote.parsed.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
{
"blockName": "core/pullquote",
"attrs": null,
"rawContent": "\n<blockquote class=\"wp-block-pullquote\">\n<p>Testing pullquote block...</p><footer>...with a caption</footer>\n</blockquote>\n"
"rawContent": "\n<blockquote class=\"wp-block-pullquote\">\n<p>Testing pullquote block...</p><cite>...with a caption</cite>\n</blockquote>\n"
},
{
"attrs": {},
Expand Down
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__pullquote.serialized.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<!-- wp:core/pullquote -->
<blockquote class="wp-block-pullquote">
<p>Testing pullquote block...</p>
<footer>...with a caption</footer>
<cite>...with a caption</cite>
</blockquote>
<!-- /wp:core/pullquote -->
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__pullquote__multi-paragraph.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,6 @@
<blockquote class="wp-block-pullquote alignnone">
<p>Paragraph <strong>one</strong></p>
<p>Paragraph two</p>
<footer>by whomever</footer>
<cite>by whomever</cite>
</blockquote>
<!-- /wp:core/pullquote -->
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__pullquote__multi-paragraph.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,6 @@
],
"align": "none"
},
"originalContent": "<blockquote class=\"wp-block-pullquote alignnone\">\n <p>Paragraph <strong>one</strong></p>\n <p>Paragraph two</p>\n <footer>by whomever</footer>\n</blockquote>"
"originalContent": "<blockquote class=\"wp-block-pullquote alignnone\">\n <p>Paragraph <strong>one</strong></p>\n <p>Paragraph two</p>\n <cite>by whomever</cite>\n</blockquote>"
}
]
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__pullquote__multi-paragraph.parsed.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
{
"blockName": "core/pullquote",
"attrs": null,
"rawContent": "\n<blockquote class=\"wp-block-pullquote alignnone\">\n <p>Paragraph <strong>one</strong></p>\n <p>Paragraph two</p>\n <footer>by whomever</footer>\n</blockquote>\n"
"rawContent": "\n<blockquote class=\"wp-block-pullquote alignnone\">\n <p>Paragraph <strong>one</strong></p>\n <p>Paragraph two</p>\n <cite>by whomever</cite>\n</blockquote>\n"
},
{
"attrs": {},
Expand Down
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__pullquote__multi-paragraph.serialized.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,6 @@
<blockquote class="wp-block-pullquote alignnone">
<p>Paragraph <strong>one</strong></p>
<p>Paragraph two</p>
<footer>by whomever</footer>
<cite>by whomever</cite>
</blockquote>
<!-- /wp:core/pullquote -->
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__quote__style-1.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
<!-- wp:core/quote {"style":"1"} -->
<blockquote class="wp-block-quote blocks-quote-style-1"><p>The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.</p><footer>Matt Mullenweg, 2017</footer></blockquote>
<blockquote class="wp-block-quote blocks-quote-style-1"><p>The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.</p><cite>Matt Mullenweg, 2017</cite></blockquote>
<!-- /wp:core/quote -->
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__quote__style-1.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,6 @@
],
"style": 1
},
"originalContent": "<blockquote class=\"wp-block-quote blocks-quote-style-1\"><p>The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.</p><footer>Matt Mullenweg, 2017</footer></blockquote>"
"originalContent": "<blockquote class=\"wp-block-quote blocks-quote-style-1\"><p>The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.</p><cite>Matt Mullenweg, 2017</cite></blockquote>"
}
]
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__quote__style-1.parsed.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
"attrs": {
"style": "1"
},
"rawContent": "\n<blockquote class=\"wp-block-quote blocks-quote-style-1\"><p>The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.</p><footer>Matt Mullenweg, 2017</footer></blockquote>\n"
"rawContent": "\n<blockquote class=\"wp-block-quote blocks-quote-style-1\"><p>The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.</p><cite>Matt Mullenweg, 2017</cite></blockquote>\n"
},
{
"attrs": {},
Expand Down
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__quote__style-1.serialized.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<!-- wp:core/quote -->
<blockquote class="wp-block-quote blocks-quote-style-1">
<p>The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.</p>
<footer>Matt Mullenweg, 2017</footer>
<cite>Matt Mullenweg, 2017</cite>
</blockquote>
<!-- /wp:core/quote -->
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__quote__style-2.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
<!-- wp:core/quote {"style":"2"} -->
<blockquote class="wp-block-quote blocks-quote-style-2"><p>There is no greater agony than bearing an untold story inside you.</p><footer>Maya Angelou</footer></blockquote>
<blockquote class="wp-block-quote blocks-quote-style-2"><p>There is no greater agony than bearing an untold story inside you.</p><cite>Maya Angelou</cite></blockquote>
<!-- /wp:core/quote -->
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__quote__style-2.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,6 @@
],
"style": 2
},
"originalContent": "<blockquote class=\"wp-block-quote blocks-quote-style-2\"><p>There is no greater agony than bearing an untold story inside you.</p><footer>Maya Angelou</footer></blockquote>"
"originalContent": "<blockquote class=\"wp-block-quote blocks-quote-style-2\"><p>There is no greater agony than bearing an untold story inside you.</p><cite>Maya Angelou</cite></blockquote>"
}
]
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__quote__style-2.parsed.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
"attrs": {
"style": "2"
},
"rawContent": "\n<blockquote class=\"wp-block-quote blocks-quote-style-2\"><p>There is no greater agony than bearing an untold story inside you.</p><footer>Maya Angelou</footer></blockquote>\n"
"rawContent": "\n<blockquote class=\"wp-block-quote blocks-quote-style-2\"><p>There is no greater agony than bearing an untold story inside you.</p><cite>Maya Angelou</cite></blockquote>\n"
},
{
"attrs": {},
Expand Down
2 changes: 1 addition & 1 deletion blocks/test/fixtures/core__quote__style-2.serialized.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<!-- wp:core/quote {"style":2} -->
<blockquote class="wp-block-quote blocks-quote-style-2">
<p>There is no greater agony than bearing an untold story inside you.</p>
<footer>Maya Angelou</footer>
<cite>Maya Angelou</cite>
</blockquote>
<!-- /wp:core/quote -->
6 changes: 3 additions & 3 deletions phpunit/fixtures/long-content.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ <h2>Visual Editing</h2>
<p>A huge benefit of blocks is that you can edit them in place and manipulate your content directly. Instead of having fields for editing things like the source of a quote, or the text of a button, you can directly change the content. Try editing the following quote:</p>
<!-- /wp:core/paragraph -->
<!-- wp:core/quote { "style": 1 } -->
<blockquote class="blocks-quote-style-1 wp-block-quote"><p>The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.</p><footer>Matt Mullenweg, 2017</footer></blockquote>
<blockquote class="blocks-quote-style-1 wp-block-quote"><p>The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.</p><cite>Matt Mullenweg, 2017</cite></blockquote>
<!-- /wp:core/quote -->
<!-- wp:core/paragraph -->
<p>The information corresponding to the source of the quote is a separate text field, similar to captions under images, so the structure of the quote is protected even if you select, modify, or remove the source. It's always easy to add it back.</p>
Expand All @@ -65,7 +65,7 @@ <h2>Visual Editing</h2>
<p>Blocks can be anything you need. For instance, you may want to insert a subdued quote as part of the composition of your text, or you may prefer to display a giant stylized one. All of these options are available in the inserter.</p>
<!-- /wp:core/paragraph -->
<!-- wp:core/quote { "style": 2 } -->
<blockquote class="blocks-quote-style-2 wp-block-quote"><p>There is no greater agony than bearing an untold story inside you.</p><footer>Maya Angelou</footer></blockquote>
<blockquote class="blocks-quote-style-2 wp-block-quote"><p>There is no greater agony than bearing an untold story inside you.</p><cite>Maya Angelou</cite></blockquote>
<!-- /wp:core/quote -->
<!-- wp:core/separator -->
<hr class="wp-block-separator" />
Expand Down Expand Up @@ -109,7 +109,7 @@ <h6>Nominavi deseruisse</h6>
<ul><li>Est quis reque cetero ad</li><li>Sea id autem nominavi deseruisse</li><li>Veniam qualisque definitionem pri id, ea autem feugiat delenit ius, mei at loem affert accumsan</li><li>Dicat eruditi cu est, te pro dicant pericula conclusionemque</li><li>Eius postea volumus mei ad</li></ul>
<!-- /wp:core/list -->
<!-- wp:core/pullquote -->
<blockquote class="blocks-pullquote wp-block-pullquote"><p>Code is Poetry</p><footer>The WordPress community</footer></blockquote>
<blockquote class="blocks-pullquote wp-block-pullquote"><p>Code is Poetry</p><cite>The WordPress community</cite></blockquote>
<!-- /wp:core/pullquote -->
<!-- wp:core/separator -->
<hr class="wp-block-separator" />
Expand Down
6 changes: 3 additions & 3 deletions post-content.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ window._wpGutenbergPost.content = {
'<!-- /wp:core/paragraph -->',

'<!-- wp:core/quote {"style":1} -->',
'<blockquote class="wp-block-quote blocks-quote-style-1"><p>The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.</p><footer>Matt Mullenweg, 2017</footer></blockquote>',
'<blockquote class="wp-block-quote blocks-quote-style-1"><p>The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.</p><cite>Matt Mullenweg, 2017</cite></blockquote>',
'<!-- /wp:core/quote -->',

'<!-- wp:core/paragraph -->',
Expand All @@ -95,7 +95,7 @@ window._wpGutenbergPost.content = {
'<!-- /wp:core/paragraph -->',

'<!-- wp:core/quote {"style":2} -->',
'<blockquote class="wp-block-quote blocks-quote-style-2"><p>There is no greater agony than bearing an untold story inside you.</p><footer>Maya Angelou</footer></blockquote>',
'<blockquote class="wp-block-quote blocks-quote-style-2"><p>There is no greater agony than bearing an untold story inside you.</p><cite>Maya Angelou</cite></blockquote>',
'<!-- /wp:core/quote -->',

'<!-- wp:core/separator -->',
Expand Down Expand Up @@ -153,7 +153,7 @@ return &lt;Button&gt;Click Me!&lt;/Button&gt;;\n\
'<!-- /wp:core/list -->',

'<!-- wp:core/pullquote -->',
'<blockquote class="wp-block-pullquote alignnone"><p>Code is Poetry</p><footer>The WordPress community</footer></blockquote>',
'<blockquote class="wp-block-pullquote alignnone"><p>Code is Poetry</p><cite>The WordPress community</cite></blockquote>',
'<!-- /wp:core/pullquote -->',

'<!-- wp:core/separator -->',
Expand Down