csteinert / friends-of-gdic Goto Github PK

It would be helpful to folks who are new to Git/GitHub if there was a bit more information in the README.md file about how the pull request process works. Written documentation or a link to an existing explanation would be great.

Now that we have a legit header (thanks @parkerdyer!), I'd like the H1 element to be inside of it, and have the logo and text be centered.

Use the template (the commented-out section in the index.html file) to add your name to the end of the list!

Now that we have access to custom CSS properties (variables! woo!) let's add some for the colors in the app. Here's some info on custom CSS properties: https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables

Steps:

1. Create variables for --black and --white in styles.css
2. Replace all instances of those colors in styles.css with their respective variables

I've picked out the two fonts I like. Link to them in index.html and set the correct styles in styles.css!

I would like the header fonts (h1 and h2) to be in Patrick Hand SC:
https://fonts.google.com/specimen/Patrick+Hand+SC

And I would like the body text to be in Source Sans Pro: https://fonts.google.com/specimen/Source+Sans+Pro

The footer is fixed so that it's always on the bottom of the screen, which is perfect I love it. Unfortunately, it has the potential to cut off the bottom of the list (on smaller screens, once the list gets long enough) in its current state.

In the below image, I created the test scenario by copy-pasting a bunch of LI elements to fill out the list, and then used the Inspector in Chrome to see if any of the elements were covered.

There's a few different ways to fix this using just CSS, pick whichever one works best for you!

The list items (<LI>) elements are too close together, in my opinion:

Add some space between the LIs using CSS. (Margin? Padding? Your choice!)

Since this has been published as a github-dot-io page (https://csteinert.github.io/friends-of-gdic) I'd like to have a link on the bottom of index.html to help people find their way back to the repository (https://github.com/csteinert/friends-of-gdic).

Ack, there's no DOCTYPE on index.html! Please add one.

More information about DOCTYPE here: https://developer.mozilla.org/en-US/docs/Glossary/Doctype

The index.html page is currently white and blank and sad. Find a fun repeating background (maybe create one on http://bgpatterns.com/ ?) and add it to the body via the styles.css file.

Make sure the text is still legible with the new background! (Tip: setting a background color on main may help with this, and don't be afraid of RGBA values!)

It would be helpful to folks who are new to Git/GitHub if there was a bit more information in the README.md file about how to clone a repo to their computer and begin working on it. Written documentation or a link to an existing explanation would be great.