Update archive-lesson-plan.php

[cynthianorman]

Splitting the row in 2 parts with the search field top right align and the heading title just below it left align.

[jonathanbossenger]

Fixes #1808

[jonathanbossenger]

It looks like this also fixes #1813

[jonathanbossenger]

This looks good to me. I tested the lesson plan archive by topic, as well as the lesson plan archive with a search, and it all works as expected.

We might want to at some point in the future consider making that section of the lesson plan archive look more like the same section in the tutorial archive, but that's a future problem to tackle.

[jonathanbossenger]

@adamwoodnz when you have a moment, would you mind merging and deploying this change?

[adamwoodnz]

Thanks for contributing this fix @cynthianorman

This pattern of title or paragraph on the left with search on the right is very common throughout the site, so I'd like to see if we can maintain that if possible. I've left a comment inline regarding a solution using column classes, which is used in other places.

Let me know if you're comfortable trying that, or I'm happy to assist.

[adamwoodnz]

I think we could change this layout to use a col class to limit the width of the title, something like:

		<div class="row gutters between section-heading section-heading--with-space">
			<?php the_archive_title( '<h1 class="section-heading_title h2 col-8">', '</h1>' ); ?>
			<?php get_template_part( 'template-parts/component', 'archive-search' ); ?>
		</div>

This is the approach taken with the section intro pattern:

Because this is a shared pattern there is more complexity to the change though unfortunately. This style rule is being applied to override the align-middle class, and is affecting the layout when changed to the above, when the class should actually just be removed:

@media only screen and (min-width: 768px) {
    .section-heading.row {
        align-items:baseline;
    }
}

In my tests that seems to be safe. I think we should try to remove this class from the template headings throughout the site, and then remove this style rule too.

[adamwoodnz]

Moving the search before the title changes the mobile view, currently search is second:

[cynthianorman]

hi @adamwoodnz thanks so much for your guidance! I've made the suggested changes and pushed them already. Please let me know if I need to change anything else.
This is what we can expect now for long titles - https://prnt.sc/2BmZBg3_NfUR

[jonathanbossenger]

Thank you for reviewing and picking these items up @adamwoodnz

[adamwoodnz]

Nearly there! I've added another commit and opened a new PR, as I can't push to your branch. Please try it out.

[jonathanbossenger]

Thank you for all the hard work so far @cynthianorman and @adamwoodnz.

I'm going to close this PR now in favor of #1834