Create Military Families and Spouses page

[rickr]

No description provided.

[hollomancer]

@RobKriner, I believe we had a design for this already...

[hollomancer]

[alexspence]

I've actually already done alot of the work for this page, as I was using it as the original homepage. components are in scenes/home/families.

If no one else picks it up I can probably tackle it in a few days.

[hollomancer]

Once this page is up, I have some followup work to redirect Google Adwords to this page as a landing.

[kylemh]

I had a question on this. It looks very similar to the front-page. Do we have liberties to change up the banner image? This banner actually looks better suited for /families than it does the home page!

[hollomancer]

@kylemh, yeah - do you have something in mind?

[kylemh]

Looking at this again, I think we should just use the second image, as the banner image.

Have "The Facts" be devoid of an image.

[hollomancer]

Depends how this looks on mobile. I like 'The Facts' being a two-column, and I do see your previous point about the banner being better suited for /families than the home page.

[kylemh]

I'd say that we can keep this wireframe exactly as is, but only if we change the landing page's banner.

[hollomancer]

Until we figure that out, I'm comfortable leaving it the way it is (or making it blank, like the /about page currently is right now), as an MVP.

[mwagz]

I'll pick this one up. If @rickr or @hollomancer want to assign it to me.

[kylemh]

@mwagz to be clear - the wireframe is a great guideline, but do not use the same image header.

If you are able to replicate the curved hero bottom border, please try to cordon off that code for us to use on the landing page! 👍 also keep in mind that I'll be refactoring Nav/Header this weekend. Let me know if you implement any ideas so I don't reinvent the wheel. Consider using the

component as it is being used for the landing page within home.js

[mwagz]

@kylemh I didn't do anything crazy, but I did use as many pre-existing components as I was able to identify. For the curved hero bottom border, I came up with a solution that I'm not totally proud of, but it accomplishes the task.

There are 2 components in my PR, HeaderClipMaskLeft and HeaderClipMaskRight. These components are absolutely positioned to the first section on the page (the quote, in my case). I then set that section to be relatively positioned and include these new components in the Section. Reference is here.

These components could use some expanding upon. They're currently restricted to white and using props we could probably just use one component for both sides.

Outside of that stuff, I think I honored everything you outlined. I did take some liberties on mobile breakpoints.

[JennWeideman]

https://www.123rf.com this is a site full of free stock images. It might be nice if we could change up the images now and then

[kylemh]

This page is nearly done. Somebody may feel free to hijack @mwagz's work to finish

[kylemh]

With this page not mapped out as an aspect of parity, it'll be subject to redesign before creating a new issue on the new repo. Leaving open until redesign is prepared.