TODO:

Need improvements in the design of the issue cards as it is the main feature of the website.

• It has to be appealing and should have good ux.
• As much information as possible about the issue should be displayed in the card itself without opening the issue link, at the same time it should not be flooded with lot of info as it will affect the ux.

Description

There is a small typo in the tailwind class names

Describe the bug
The button in the hero section doesn't take the user to the github issues.

To Reproduce
Steps to reproduce the behavior:

1. Go to the hero section
2. Click on "Find issues" button
3. Nothing will happen

Expected behavior
The user should be taken to the github issues when clicking on the button

//TODO:

• Add a detailed guide on how to how contributing to this project in the Readme.md file.
• Refer to CONTRIBUTING.MD file provided in the repo
• Use screenshots to guide beginners for making their first contribution

TODO :

• Add Starter Hive Svg In footer.
• (Link to svg)[https://github.com/ArslanYM/StarterHive/blob/main/web/public/hive.svg]
• Add it here :
  

The contribution guide is missing the most important step, which is installing dependencies to start working on the project

TODO :

• when user clicks on links in the footer, the links should open in a new tab
  

The guide should :

• Provide a crisp tutorial to start development on your local host.
• provide link to technologies used in the web app
• provide a easy guide for beginners as well
  Link to the Readme file : https://github.com/ArslanYM/StarterHive/blob/main/web/README.md

After the 4th step there should be another step where you ask the contributor to :

Make the changes 

Refer

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is.
push the startedHive Text from top to the left and move the navbar links on the same side as the github links, I was thinking if making the navbar sticky and translucent with some box shadow so when the user scrolls down as we add more components, the navbar is consistent with his movements and the translucent background makes it look more attractive.

Adding some additional hover effects also works out on the navbar links

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered

Additional context
Please share your suggestions, something additional that you want me to add or dont want me to add

TODO:

• Add floating action to the below button when hovered over it.
  

#TODO:

• Add better looking divs to the main hero section instead of existing one div.
• For example :
  

The divs should be placed like this and later we must be able to insert an cover image inside.

//TODO:

• Make the title in the header better looking and bold.
• It should be the first thing that people notice when they land on the home page
  

Description

Feel like the padding on this button is a bit too less

Steps to Reproduce

1. Go to the website
2. Take a look at the GitHub button on the NavBar

Proposed Change

Note: I have also removed the Arrow icon in the proposal

I suggest to go with the basic and beginner friendly "grouping by file type" folder structure.

• src
  • assets
  • components
    • Button.jsx
    • Card.jsx
    • index.js
  • contexts
  • helpers
  • layouts
  • pages

pages: pages will be combination of multiple components and will be mapped to a specific app route. This is helpful for beginners and new commers as it will be the entry point of application and through this folder they will be able to navigate to the rest of the codebase.

every folder will have index.js file in it which will export all the necessary functions/components required outside the folder.

optionally we can introduce hoc, hooks and __tests__ if we need in future but we should avoid as it's not easy for beginners to understand.

To keep the codebase clean and maintainable:

• We should avoid importing from other than index.js file of a specific folder.
• Avoid creating nested folders, try to avoid more nesting at all.
• Keep the files in the correct folder according to their types.

TODO:

• The user should be able to navigate to different pages using the navbar and find issue button.

TODO:

• Add floating action to these image divs in hero section
• these divs should be floating normally without hover effect
  

TODO:

• Fix the height of these to be same.
• add floating animation to these divs

Need a logo or ui here

Describe the bug
License image is not loading the README.md because of incorrect path.

Screenshots

This button should open our github page in a new tab instead of just redirecting.

In README.md under section "Other points to remember while submitting your work:"

For points 1 & 3; space in folder name is not needed, and will we follow snake_case? in React mostly we uses PascalCase for component names and camelCase of js files.

For point 2; file extensions .py .c and .cpp. It needs to be changed to .js, .jsx, .css

TODO:

• Add github svg icon in the button of header file
• it should redirect to the following link when clicked on it.
  

Add the following :
-link to the CONTRIBUTORS.md file
-a small description thanking all your contributors

// TODO:

• Make a logo for this project
• Make a cover for this project with its name on it.
• The above mentioned should me minimal and match the name of the project.

bug: the main picture in the hero section is not loading when deployed on vercel but loads when built on local host.

Possible solution:

• change the path here
  

Create a table for the issue section with data about the issue.

The table should have the following information:

• Name of repo
• Issue Link
• Technology/Language used
• Status ( Open/Closed)

The text section in the home page can be made more attractive and prettier. The text together looks congested. Some padding and spacing will make this look good.

I would like to change the font and and little bit of shades to highlight keywords. Animation can also be added to the next and the button.

TODO:

• Create a complete guide to run this project on local host
• add images
• keep the theme as other pages
• style the page well , keep it one pager

TODO

• Add a list of issues as a json object, which will be used to add issues manually in the website.
• Render the issue cards on the issue page.

Describe the bug
Hovering on to "Home", "Contributors", "Docs" and "Find Issues" cursor is not a pointer.

To Reproduce
Steps to reproduce the behavior:
hover on any thing on navbar

Expected behavior
As per better UX it should be pointer

Assign this to me will give it after doing the change.

Provide a UI/UX mockup for the next version of this project.

The react app should have

• a basic home page
• a good first issue finder search bar
• beginner friendly project cards

TODO:

• Add a section in the readme that navigates/points to Contributors.md file where first timers can add thier names to the file and make a contribution
• Add a section in the readme asking frontend developers to contribute to web/ directory.

Describe the bug
There is a big white bar, that is visible on safari browsers
The Black bar is the device frame and the red bar is where the white bar can be observed.
To Reproduce
Steps to reproduce the behavior:

1. Grab a M1/M2 Macbook Air
2. Open the verbal deployment
3. Scroll down form then footer to see the whitespace

Expected behavior
No white Space beneath the nabber should be present.

Screenshots

Additional context
This does not appear to be a use agent problem as it is not present on the intel/mobile platform, I believe, it could only be limited to safari or it could be a major, css problem, further analysis is required.

Make the issues section better formatted.

💡 Link to repo
https://github.com/EddieHubCommunity/LinkFree

💡 Technology used
HTML, CSS ,JS

There's a typo that says 'Starter Hived' instead of 'StarterHive'.

Here it is:

Would like to fix it!

//TODO:

• To provide a logo that suits the features of this project and the name as well.
• to provide the logo for webapp as well as other uses.

TODO:

• Style the contributors section
• Make the font size bigger and better
• Add thanking message to contributors

TODO:

• Add images to divs in the main hero section.
• add more divs to fill the right portion of the hero section. Will provide more images later.
  here:
  

images:

Describe the bug
The hyperlink for the coding style in reading.md does not land into a valid website

Expected behavior
The hyperlink should land into a valid website

Screenshots

TODO:

• Make the size of social icons in footer bigger.
• Add an hover effect as well

TODO:

• Add discord , twiiter and github icons in the footer instead of exisiting ones.

• The links for them are

• Twitter: https://twitter.com/ArsalanYmalik

• Github: https://github.com/ArslanYM/StarterHive

• Discord: https://discord.gg/QBwU8KaJ

Describe the bug
navbar and hero section both are not aligned properly Hero section has too much space to its left side

To Reproduce
Steps to reproduce the behavior:

1. Go to home page

Expected behavior
both hero section and navbar should align together properly

The introduction should provide:

• A easy to understand idea about the project
• A small description of how it will help people
• Links to discord and the community page

Add a link+ small description in the main Readme file for people who want to contribute to the web app

TODO:

• on hover over the "open source" text in hero section, the text should stand out in animation instead of becoming smaller. Kind of like a float up.
• The opposite of how its behaving cuurently.
  

TODO:

• Make the readme more readable and concise
• dont skip any of the poiints in the readme
• your job is to make it better looking and concise

Link : https://github.com/ArslanYM/StarterHive/tree/main/web#readme

Add a small arrow button here :

Move this content to a separate file. (eg issues.md). Store that file in a directory names ISSUES.