emmadawsondev / guide-to-hf Goto Github PK
View Code? Open in Web Editor NEWA guide for super-newbie coders to Hacktoberfest written by super-newbie coders 2020
A guide for super-newbie coders to Hacktoberfest written by super-newbie coders 2020
Is this site available live anywhere, such as GitHub pages or Netlify?
It might help encourage new contributors if they could see their work go live on a real page, and gives a little demo of what to expect when it's up and running.
Instructions for 'how to get this to run after I check it out' should be included in the main README. It's the first place people typically look.
Format the CONTRIBUTING.md file so that it looks more pleasing.
Heading should be made bigger and bolder
Rules should stand out
The profile photo for Experience 14 (Shubham Arora) doesn't work or is broken.
Kindly visit https://emmalearnscode.github.io/guide-to-HF/experiences/shubham-arora.html to confirm.
More so, the experience directory https://github.com/emmalearnscode/guide-to-HF/tree/master/experiences doesn't look well arranged. Maybe I can sort it by file type (eg. html, css) or by experience (eg name of the contributor with their files in it).
I arrived to your website from a twitter link (the tweet is one of the top on the #hacktoberfest hashtag).
It's hard to actually get to the github repo itself. Suggest a prominent github logo link.
The current styles.css file uses normal colour and font properties throughout the CSS file like so:
dark red: #9C4668
pink: #ff8ae2
blue: #93c2db
darkblue: #072540
font-family: 'Inter', sans-serif;
font-family: 'Nunito', sans-serif;
Instead I would like custom CSS properties at the top of the file and the hex codes and fonts replaced throughout the CSS file with custom properties.
Name the properties as follows at the top of the file:
--bg-color: #072540; //dark blue
--bg-color-lt: #ffffff; //white
--text-color-lt: #ffffff; //white
--text-color-dk: #072540; //dark blue
--highlight-lt: #ff8ae2; // light pink
--highlight-dk: #9C4668; //dark pink
--font-header: 'Inter', sans-serif;
--font-normal: 'Nunito', sans-serif;
then change them in the corresponding places throughout the CSS file by using --var(name-of-property)
There are extra spaces in CONTRIBUTING.MD between ** and two titles:
Which means that if you view the CONTRIBUTING.MD in github the titles are not bold and the ** is visible
Little improvement suggestion:
It requires a little CSS knowledge.
In mobile devices (or simulating), open the top navigation menu;
The active menu item has a weird border radius and;
On hover / When active, it overlaps the other menu items.
The border radius issue is caused by the CSS 'border-radius' property, since it sets only the bottom radius.
About the overlapping, my guess is that the display 'block' set to the nav when the menu is open and/or the 'margin' set to the 'li' items, is causing this overlapping.
Tiny improvement suggestion for the site:
This should be a reasonably easy first issue, that requires a little CSS knowledge.
Hover over the top nav menu items. Notice how things jump around a little.
Some decorative properties change the size of the box-model values (margin, border, padding, content).
There are other decorative properties that do not (box shadow, background-color).
It should be relative simple to reimplement the hover effect without having it jump around on the nav bar.
On screens smaller than 600px add a media query for the p tag so that it has 5px padding on the right and left sides.
On screens less than 440px the cards (under section .Experiences on the index.html page) are one column wide but they have quite a lot of white space around them.
I could like the hamburger menu changing to a standard 3 bar instead of the inverted version it is now.
Example : [https://www.google.com/url?sa=i&url=https%3A%2F%2Fcreativemms.com%2Fblog%2Fwhy-the-hamburger-navigation-icon-is-dead%2F&psig=AOvVaw3cZPoniKYtmIF8s8almt-M&ust=1601815287021000&source=images&cd=vfe&ved=0CAIQjRxqFwoTCPCD-o25mOwCFQAAAAAdAAAAABAD]
In the contributors guide you've said to add a 'yourname.html' and css to the experiences folder.
But if a user/developer wants to see a list of their experiences on the main page, how would they see that? Do you add that manually and they need to wait to see that once the PR is approved?
Point 8 on the fork document shows that git remote -v
will output my github fork as the origin repo...this is obviously only true for me 😄
It might make more sense to replace references to JacksonBates
on the page with <username>
Very easy issue :)
At the moment the current navigation styling breaks at screen sizes smaller than 730px.
Please add a hamburger menu that appears at screen sizes less than 730px.
The navigation links should drop down when the hamburger is clicked on and disappear on a second click.
Add scripts to scripts.js and make a section at the bottom of the CSS file marked /Media Queries/
Please add the following line under the heading in the readme.md file:
This repo is hosted at https://emmalearnscode.github.io/guide-to-HF/index.html
Make sure the link works.
The readme.md file should be formatted so that it's more pleasing to look at.
These details can be added to the website and to the contributing.md, potentially as separate PRs ;)
When a user intends to make multiple contributions to a repository it is very easy for them to get their forked repo out of sync with this original repo.
To overcome this, they have to set their upstream remote as this repository.
From the command line (UNIX based, I'm afraid I'm not too familiar with Windows these days) they can follow these instructions:
git remote -v
This will list the current remotes. It should show something like this:
origin [email protected]:JacksonBates/guide-to-HF.git (fetch)
origin [email protected]:JacksonBates/guide-to-HF.git (push)
Then they can do this:
git remote add upstream [email protected]:emmalearnscode/guide-to-HF.git
Now if they do git remote -v
again they should see:
origin [email protected]:JacksonBates/guide-to-HF.git (fetch)
origin [email protected]:JacksonBates/guide-to-HF.git (push)
upstream [email protected]:emmalearnscode/guide-to-HF.git (fetch)
upstream [email protected]:emmalearnscode/guide-to-HF.git (push)
Now, before they do new work on the repo, they should pull any updates in from this original repo like this:
git pull upstream master
This takes all the changes on this repo and applies them to the fork to keep them in sync.
If anyone needs more detail to understand this, feel free to @ mention me :)
On the homepage there the last item in the navigation is a link to my github repo. However it's not on any of the other pages.
Please copy the link from the homepage and add it in the same place in the navbar to the three other pages on the site.
The images are not being viewed on the "Make a PR Request" webpage
The pull.html page doesn't have any content.
Recommend populating it, and/or remove the link until the page does have content.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.