Automattic / wp-calypso

The JavaScript and API powered WordPress.com
https://developer.wordpress.com
GNU General Public License v2.0
12.43k stars 1.99k forks source link

Comment form: No spacing between title and the form on Atomic sites #83991

Open alaczek opened 11 months ago

alaczek commented 11 months ago

Quick summary

I noticed there's no spacing between the form title and comment form on Atomic sites.

Comment form on Atomic site using Carnation theme:

image

Comment form on simple site using Carnation theme:

image

Simple sites have this style applied.

image

This appears to be coming from: mu-plugins/verbum/dist/index.css, line 247

This is missing on Atomic sites, and there's also this style inserted inline:

image

Steps to reproduce

  1. On an Atomic site with Carnation theme active and comments enabled, navigate to a single post.
  2. Scroll down to the comments form, and notice there's no gap between "Leave a comment" title and the comment form.
  3. Compare this to a simple site with Carnation theme active - scroll down to the comments form, and notice the gap between "Leave a comment" title and the comment form.
  4. Tested and reproduced in Carnation, Luce, SND, Fewer, Issue.

What you expected to happen

I expected some spacing between title and comment form, preferably mirroring simple sites behavior.

What actually happened

There was no gap between title and comment form.

Impact

Some (< 50%)

Available workarounds?

No but the platform is still usable

Platform (Simple and/or Atomic)

Atomic

Logs or notes

No response

liviopv commented 11 months ago

πŸ“Œ REPRODUCTION RESULTS

πŸ“Œ FINDINGS/SCREENSHOTS/VIDEO Atomic, Lativ theme, Gutenberg 17.0.2 CleanShot 2023-11-18 at 14 16 34@2x

Atomic, Enroute theme, Gutenberg 17.0.2 CleanShot 2023-11-18 at 14 18 39@2x

Atomic, TT3, Gutenberg 17.0.2 CleanShot 2023-11-18 at 14 19 25@2x

Simple, Enroute, Gutenberg 17.0.2 CleanShot 2023-11-18 at 14 20 33@2x

πŸ“Œ ACTIONS

πŸ“Œ Message Switching priority to Normal, considering the low user-impact and easy CSS workaround:

.wp-block-comments h3#reply-title {
    margin-top: var(--wp--preset--spacing--70);
}
davemart-in commented 1 week ago

Moved this over to the Loop board.