lkrryba / weekly-web-dev-challenge-poll Goto Github PK

Refine responsive layout on larger screens

Photos here: https://drive.google.com/file/d/1Hvid3YFG8BsUqfMfYk6DypFgQC-9Cn3k/view?usp=sharing

It would be fun to have a different gradient every time the page loads.

Colors to use:

Green: #AAD1B6
Blue: #B5CAF9
Purple: #C7B9FF
Pink: #F0B9DD
Orange: #F3BF99
Yellow: #FBF3AB

This should be removed from all previous challenge pages and should only appear on the current challenge page.

This can be hard-coded.

Carry out audit of what could be improved and carry out changes.

Challenges affected are: Freestyle, Pricing Component, and Tip Calculator challenges.

Note: Only the winners need to be added.

Keep all the JavaScript files to a utils folder will make the project's directory more manageable and structured.

Would like to take this issue and I will raise a PR with necessary changes, Thanks

I think about the width of 850px and less we should bring the hamburger menu and increase the gap of the challenge container grid by a little bit

P.S.: I'm using Viewport Dimension extension for the preview of width and height

I would like to make the header consistent with scrimba's header. Perhaps adding the hover states as well.

Raised as per Leanne's instructions.

Brand colors (use some or all):

Green: #AAD1B6
Blue: #B5CAF9
Purple: #C7B9FF
Pink: #F0B9DD
Orange: #F3BF99
Yellow: #FBF3AB

Having a readme file with a link to the website would be useful so people can go straight to the submissions page.

Make the Scrimba logo smaller and 'Weekly Web Dev Challenge Submissions' title bigger, plus any other improvements you would like to do. Match as closely as possible to scrimba.com styling.

Ensure that the nav, header & footer from the main page are used across all pages on the site (Hall of Fame, FAQ, previous challenges, etc).

I would like the site to be checked for accessibility issues and necessary fixes implemented.

This should be styled like the main page, with images taken from the challenge winners.

This can be static, i.e the challenge name and image need to be updated manually every time there is a new challenge.

The new page should then be linked to the nav bar and the existing previous challenges ul should be removed.

Footer contents:

• Link to Weekly Web Dev Challenge page: https://scrimba.com/learn/weeklychallenge
• Link to Scrimba main page: https://scrimba.com/
• Twitter: https://twitter.com/scrimba
• YouTube: https://www.youtube.com/c/Scrimba
• Podcast: https://scrimba.com/podcast/

See latest challenge for example.

Winners are marked with winner: true in submissions.json. It would be great if they could be added to the Hall of Fame automatically when winner is set to true, but this isn't essential.

Also add a title saying "Submissions:" or similar above the submissions.

The function for this is line 73 - 84 in index.js.

Hello @lkrryba. As of the picture below, there are (1) & (2) spacing issues, (3) cool transitions while hovering links issues.

This should have links to:

• The latest challenge
• Previous challenges (for now, a link which scrolls to the list at the bottom of the submissions)
• The Hall of Fame: https://weeklywebdevchallenge.scrimba.com/hall-of-fame
• The Scrimba homepage scrimba.com

Currently, they are stored in a list at the bottom of the submissions, but this isn't optimal and eventually we'll run out of space.

This should be a separate html file. It will eventually be linked to the main page via the nav bar, but this will be a separate issue and PR.

It would be good to have header and footer components so that we can ensure consistency across all pages and only update in one place if necessary. Please use the header and footer currently available on the current challenge page.

This is to make sure that the submissions have a good chance of being seen, regardless of when they are submitted.

https://weeklywebdevchallenge.scrimba.com/faq.html

As you can see here, little bit of Pumpkin's image is hidden behind the taskbar.

For example, user fills in a form with username, screenshot of their submission, and link to code, Leanne then approves before it is added to submissions.json.

• Link to contributors here: https://github.com/lkrryba/weekly-web-dev-challenge-poll/graphs/contributors
• The @Pumpkin link should remain in the footer under the link to contributors