Course Theme - Fix post title spacings for course and lesson default

[Imran92]

Changes proposed in this Pull Request:

• Fixed the spacings above and below the post title of lessons and courses for course theme to match the design.
• We've changed only spacings specific to the default templates of Course and Lesson, because if any user already changed to another template choosing that style, we don't want to break their existing look. The default look will not be very different either.

Testing instructions:

• Checkout this branch Fix extra empty header element echoing in course and lesson sensei#7063
• Create a course with a lesson
• Make sure learning mode is disabled for that course
• Now take the course and the lesson as a student
• Make sure the spacings above and below the Post Title matches the design

The top spacing is calculated as the spacing between the bottom of the site title to the top of the post title.

Design

Mobile:
(Top)

(Bottom)

Desktop:
(Top)

(Bottom)

Course Desktop:

Lesson Desktop:

Course Mobile:

Lesson Mobile:

Related issue(s):

#7144

[donnapep]

@Imran92 It looks like there are some conflicts that need to be resolved now. 🙁

Is there an associated issue for this? If not, would you mind adding the Figma file in the description so I can see what the design is supposed to look like? Oops, saw this linked at the very bottom. Maybe it could be linked in the sidebar so I don't miss it next time? 😅

Also, I think we need to change the branch from trunk for this now. 🙂

[Imran92]

Thanks for taking a look @donnapep !

@Imran92 It looks like there are some conflicts that need to be resolved now. 🙁

Resolved!

Oops, saw this linked at the very bottom. Maybe it could be linked in the sidebar so I don't miss it next time? 😅

Yeah PR template has it at the bottom and also doesn't seem to automatically connect to the issue. Added it on the sidebar now 🤜 🤛

Also, I think we need to change the branch from trunk for this now. 🙂

As it only fixes the spacings of the titles of the lesson and quiz template, I seems pretty safe to me to merge it in trunk. But it'll be a bit too much if one version update gets released only for this small update :P changed the target branch from trunk to frontend-improvements

[donnapep]

I see that the following 2 CSS classes are the ones that style courses and lessons, so I'm wondering which use case this selector is needed for?

[donnapep]

@Imran92 Can you provide an update here?

[Imran92]

Hi Donna 👋 I looked into it a bit to figure out what this #7294 (comment) selector was used for, but haven't figured out any. But I'll again try to find it out. In case I don't, I'll remove this particular selector and update this PR