[wp-trac] [WordPress Trac] #47811: Twenty Nineteen: Improve compatibility with custom colors in the separator block.

[WordPress Trac]

#47811: Twenty Nineteen: Improve compatibility with custom colors in the separator
block.
-------------------------------------+------------------------------
 Reporter:  kjellr                   |       Owner:  (none)
     Type:  enhancement              |      Status:  new
 Priority:  normal                   |   Milestone:  Awaiting Review
Component:  Bundled Theme            |     Version:
 Severity:  normal                   |  Resolution:
 Keywords:  has-patch needs-testing  |     Focuses:
-------------------------------------+------------------------------
Description changed by kjellr:

Old description:

> There's a soon-to-land Gutenberg PR that adds custom color support to the
> separator block:
>
> https://github.com/WordPress/gutenberg/pull/16784
>
> The custom color functionality added in that ticket is incompatible with
> Twenty Nineteen. The theme's styles override the custom colors in a
> couple places, and result in a mismatch between the front end and the
> editor. I'm attaching a small patch to fix that.
>
> This should be fixed ideally before that change is merged in, in order to
> ensure that the theme works with that functionality at launch.
>
> ----
>
> To test:
>
> - Run a development version of Gutenberg with this PR active:
> https://github.com/WordPress/gutenberg/pull/16784
> - (Or, wait until that PR is merged, and then run that)
> - Start a post with all three styles of the separator block. Ensure that
> by default, these appear as intended in the editor and in the front end.
> - Using the new sidebar controls, assign a color to each of the
> separators, and ensure that the new color shows up in the editor and in
> the front end.
>
> ----
>
> **Before**
>
> ''Editor''
>
> [[Image(https://cldup.com/guK2WwJvwB-3000x3000.png)]]
>
> ''Front End''
>
> [[Image(https://cldup.com/Fpbel8TYAm-3000x3000.png)]]
>

> **After**
>
> ''Editor''
>
> [[Image(https://cldup.com/zukGKwF6NN-3000x3000.png)]]
>
> ''Front End''
>
> [[Image(https://cldup.com/sbs8Tnfods-1200x1200.png)]]

New description:

 There's a new Gutenberg feature that adds custom color support to the
 separator block:

 https://github.com/WordPress/gutenberg/pull/16784

 The custom color functionality added in that ticket is incompatible with
 Twenty Nineteen. The theme's styles override the custom colors in a couple
 places, and result in a mismatch between the front end and the editor. I'm
 attaching a small patch to fix that.

 The separator color functionality is set for the 6.3 release of Gutenberg,
 so this should be fixed in Twenty Nineteen before that version is merged
 in, in order to ensure that the theme works with that functionality at
 launch.

 ----

 To test:

 - Run a development version of Gutenberg with `master` active (or, wait
 until Gutenberg 6.3 is available in plugin form, and test with that)
 - Start a post with all three styles of the separator block. Ensure that
 by default, these appear as intended in the editor and in the front end.
 - Using the new sidebar controls, assign a color to each of the
 separators, and ensure that the new color shows up in the editor and in
 the front end.

 ----

 **Before**

 ''Editor''

 [[Image(https://cldup.com/guK2WwJvwB-3000x3000.png)]]

 ''Front End''

 [[Image(https://cldup.com/Fpbel8TYAm-3000x3000.png)]]


 **After**

 ''Editor''

 [[Image(https://cldup.com/zukGKwF6NN-3000x3000.png)]]

 ''Front End''

 [[Image(https://cldup.com/sbs8Tnfods-1200x1200.png)]]

--

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/47811#comment:1>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform