Adds svgs and new site styling

[bdougie]

What is this?

I got some quick SVGs created from my designer friend and threw this together before seeing #35 open, but after stumbling upon #11.

I did notice currently open PR has some things broken and don't see it being merged before those are fixed. So I still opened this PR, since it's a quicker iteration towards something presentable.

I can work with @viviangb to see about making some minor tweaks where the styling breaks.

Goal

While the #31 Gitbook thing is being figured, it would be nice to see small approvements to the site happen.

current state:

flexbox usage

.benefits {
  ...
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
}

note: I used flexbox in my change, I am a big fan, but did not see it being used anywhere else in the css and ok to do this hard way with floats ;)

Gulp build setup issue

I see you have a gulp deploy command that deploys to gh-pages, which I have not done. When I attempt to just gulp I get errors about my CNAME, most like because I don't have rights to deploy.

For now, I did not update src folder and updated the dist directly and looking for some quick feedback.

Should I hold off or continue to work to make this Gulp build from src to dist?

Preview

As I mentioned in a comment, consider using Netlify, it has a better deploy story

You can preview the site here http://pharmacist-lisa-21114.netlify.com/

web

mobile

[yocontra]

Seems fine to me - just adding SVGs to the benefits section. I appreciate the incremental approach, it makes it much easier to merge.

One critique: I think the images could use a little bit of bottom margin so it isn't crushing the text.

Also, would be open to switching the whole site to flexbox now that it exists in all browsers.

[bdougie]

Thanks for taking a look at the PR. I force pushed a change to double the margin between titles and images for some breathing room.

My netlify link auto updated to reflect the change.

I saw you closed the other PR, I am game to add flexbox to the page as well as adding another section from mocks to the page (in separate PRs). The mock from alice was great and it would be a shame to not see that happen -- even if it is for a few months before a gitbook overhaul happens.

Basically, I have availability to do CSS if you want it.

[yocontra]

@bdougie I'm going to redo the whole site, but would still love to have these SVGs for the detail page. I'm going to push it today and I'll ping you when it is finished. I'll put emoji as placeholders. Sound like a plan?

[bdougie]

Sounds goods -- looking forward to seeing your updates 🎉

[yocontra]

Done, want to send a new PR?

[phated]

👎 on netlify

[bdougie]

👍 on SVGs, will do now.

[leo]

@phated @contra Are you interested in moving the site to @zeit, maybe? I'd love to assist you with that. I recently wrote a feature for our CLI, which basically makes the whole deployment as easy as running a single command.

[phated]

Well, @contra just removed all build process completely. I'm not sure if we want to add that back in. Maybe after we let the community contribute on https://github.com/gulpjs/gulpjs.github.io/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22 ??

Edit: (I do love Zeit though, and that would be the place we'd host if not github pages)