mrashwin2142 / openquotes

OpenQuotes is an open-source collection of inspirational quotes. Contribute your favorite quotes and join our open source journey to inspire the world. Start sharing positivity today!

OpenQuotes

Welcome to OpenQuotes - Share Your Inspiration!

This project aims to simplify and guide the way beginners make their first open source contribution. If you're looking to contribute your favorite quotes and be part of our journey to inspire the world, follow the steps below.

Live App Link: OpenQuotes Live App

Contributors

Thanks to all our amazing contributors who have helped make OpenQuotes an inspiring and collaborative project!

Ashwin Dhangar 💻 🖋 🎨 🤔	codeGallery01 💻	Patrick 💻	Delta7Actual 💻	Vivek Mandloi 💻	devraushan 💻	YeiHuynh 🤔
HTQun 📖	pheb2014939 💻	Umar Farouk 💻	vtkmy 💻	NimishToshniwal 💻	vinhhung0306 💻	Kertyn 💻
WDmaster235 💻	ndpdung25 💻	JustNgoc 💻

How to Contribute

1. Fork this Repository

If you don't have Git on your machine, install it.

• Fork this repository by clicking on the "Fork" button at the top of this page. This creates a copy of the repository in your GitHub account.
• Don't forget to click the "Star" button at the top right of the repository page to show your support!

2. Clone the Repository

- Clone your forked repository to your local machine. In your GitHub account, navigate to your forked repository and click the "Code" button. Copy the URL.

• Open your terminal and run the following command, replacing "url you just copied" with the URL you copied:

git clone "url you just copied"

For example:

git clone [email protected]:this-is-you/openquotes.git

Install project:

git clone https://github.com/MrAshwin2142/OpenQuotes.git

3. Create a Branch

Change to the repository directory on your computer (if you're not already there):

cd openquotes

Now create a new branch for your contribution:

git switch -c add-your-name

Replace add-your-name with a branch name that describes your contribution.

4. Make Changes and Commit

Open the quotes.js file in a text editor, add your favorite quote and your name to the array of quotes.

Save the file, and then in your terminal, execute the following commands:

git status
git add quotes.js
git commit -m "Add your quote and name to the collection"

Replace "Add your quote and name to the collection" with a meaningful commit message.

5. Push Changes to GitHub

Push your changes to your GitHub repository with:

git push -u origin add-your-name

6. Create a Pull Request

1. On GitHub.com, navigate to the main page of the repository.

2. In the "Branch" menu, choose the branch that contains your commits.

3. Above the list of files, in the yellow banner, click Compare & pull request to create a pull request for the associated branch.

4. Use the base branch dropdown menu to select the branch you'd like to merge your changes into, then use the compare branch drop-down menu to choose the topic branch you made your changes in.

5. ype a title and description for your pull request.

6. To create a pull request that is ready for review, click Create Pull Request. To create a draft pull request, use the drop-down and select Create Draft Pull Request, then click Draft Pull Request. For more information about draft pull requests, see "About pull requests."

After your pull request has been reviewed, it can be merged into the repository.

7. Celebrate Your Contribution

You've completed the standard fork, clone, edit, and pull request workflow. Congrats on your contribution to OpenQuotes! Share your contribution with friends and followers and celebrate your open source journey.

8. Spread the Inspiration

Share your contribution and our project with your friends and followers. Encourage them to join the open source community and start their own journey. Together, we can inspire and make the world a better place, one quote at a time.

openquotes's Issues

Add Background Image to Page

Hello there! I've created this issue, and I'm excited to welcome new contributors to OpenQuotes. This is a great opportunity for beginners to start their open source journey.

Issue Details:

We're looking to enhance the visual appeal of the OpenQuotes project by adding a background image to the page. The image we have in mind is this beautiful Sakura flower background: Background Image.

Task:

Your task is to modify the project's CSS to incorporate this background image and make the page more aesthetically pleasing.

Getting Started:

Fork the OpenQuotes repository.
Clone your fork to your local machine.
Add the background image to the project's CSS.
Commit your changes and push to your fork.
Create a pull request to contribute your enhancement.

Acceptance Criteria:

The background image is visually appealing and responsive.
The image does not interfere with the readability of the quotes.
The project maintains its simplicity and readability.
Feel free to reach out if you have any questions or need guidance. This issue is marked as a "good first issue," making it an excellent starting point for your open source journey. We look forward to your contributions and to seeing the OpenQuotes project become even more inspiring and visually engaging.

Happy coding, and welcome to the OpenQuotes community! 🌸✨🚀

Change Quote Display Method to Randomize Quotes

Hello, OpenQuotes community! 👋

We're considering an improvement to the way quotes are displayed on the OpenQuotes platform. Currently, quotes cycle in a specific order, but we believe introducing randomness can make the experience more exciting and refreshing for our users.

Issue Details:

Task: The task is to modify the project's code to display random quotes on the page. Each time a user visits or refreshes the page, they will see a different quote, enhancing the variety and appeal.

Contributor-Friendly: This issue is ideal for those interested in front-end development and adding a dynamic touch to the project.

Join us in making OpenQuotes a platform where every visit brings a fresh burst of inspiration. If you have questions or need guidance, please feel free to reach out.

Update README for First-Time Contributors

Hello, OpenQuotes community! 👋

We believe in making the OpenQuotes project as welcoming and beginner-friendly as possible. To ensure a smooth onboarding experience for our first-time contributors, we want to revamp our README file to provide clear and concise guidance on how to add quotes or make any contribution.

Issue Details:

Readability: The goal is to make the README easy to understand, with step-by-step instructions for contributors who are new to open source.

Clarity: We want to provide a clear overview of the contribution process, from forking the repository to creating a pull request.

Inclusivity: We aim to create an environment where everyone, regardless of their experience, can make their first contribution with confidence.

How to Get Started:

• Fork the OpenQuotes repository if you haven't already.
• Work on updating the README file to provide comprehensive guidance for first-time contributors.
• Submit a pull request to share your improvements with the community.

Contributor-Friendly: This issue is perfect for those interested in documentation and ensuring that our project is accessible to all contributors, regardless of their experience level.

Join us in making OpenQuotes even more welcoming to first-time contributors. If you have any questions or ideas, please feel free to reach out. We appreciate your contributions and look forward to improving our project together! 🌟

Unequal contributor sizes at Read.md

Describe the bug
The sizes of the cell and images for each contributors is unequal at the Read.md, specifically the images making it look a bit off.

To Reproduce
Steps to reproduce the behavior:

1. Go to either Read.md or scroll to it from repository home.
2. See error.

Expected behavior
The sizes of the cell and images will not be equal although assuming from the code, they are made to be.

Screenshots

Desktop (please complete the following information):

• OS: [NA]
• Browser [NA]
• Version [NA]

Smartphone (please complete the following information):

• Device: [OPPO A5s]
• OS: [V5.2.1]
• Browser [Chrome]
• Version [Chrome 118.0.5993.111]

Additional context

I did some test and the width of the image and cell seems to be affected by the length of the text bellow it and not the declared value in the code.

Add New Quote

Hello, OpenQuotes community! 👋

We believe in the power of inspirational words, and we're always excited to expand our collection of quotes. This issue is an invitation to add a new quote to the OpenQuotes project. Your contribution can inspire and uplift countless individuals.

Issue Details:

Task: The task is simple. Add your favorite quote to our growing collection. Your quote can be a source of motivation, positivity, or wisdom.

How to Get Started:

• Fork the OpenQuotes repository if you haven't already.
• Navigate to the quotes.js file.
• Add your new quote to the array of quotes.
• Include your name.
• Optionally, add your GitHub link to get credit for your contribution.
  ex.

 {
    quote: "Your Quote",
    name: "Your Name",
    profileLink: "Your Github Profile",
  },

• Submit a pull request to share your new quote with the community.

Contributor-Friendly: This issue is perfect for those who want to make a positive impact with a simple contribution. It's a great way to start your open source journey or to continue your open source involvement.

Join us in adding a new source of inspiration to OpenQuotes. We appreciate your contributions and look forward to sharing your wisdom with the world! 🌟

Make Page Mobile Responsive

Hello everyone! 👋

As we continue to improve the OpenQuotes project, one of our next objectives is to enhance the mobile user experience by making our page fully responsive. This will ensure that our content looks great and is easy to access on a variety of mobile devices.

Issue Details:

Responsiveness:

The objective is to create a responsive design for the OpenQuotes page, making it user-friendly on smartphones and tablets. This includes optimizing the layout, font sizes, and images for smaller screens.

How to Get Started:

• Fork the OpenQuotes repository if you haven't already.
• Work on the necessary CSS and HTML changes to achieve mobile responsiveness.
• Submit a pull request to share your improvements with the community.

Contributor-Friendly:

This issue is ideal for contributors who are interested in frontend development and want to dive into creating responsive designs. It's an excellent opportunity to start your open source journey or further develop your skills.

Let's come together to make OpenQuotes accessible to a wider audience by ensuring it's mobile-responsive. If you have any questions or need assistance, don't hesitate to reach out. We appreciate your contributions and look forward to making OpenQuotes an even better platform for inspiration! 🌟📱

Text Overlapping Issue on Mobile

Hello everyone! 👋

We've identified a bug in the OpenQuotes project where text is overlapping on mobile devices, affecting the user experience. We're looking for assistance in resolving this issue to ensure a seamless experience for our mobile users.

Issue Details:

Problem: Text is currently overlapping on the mobile version of the OpenQuotes page, making it difficult to read and navigate.
How to Reproduce:

Open the OpenQuotes project on a mobile device (e.g., smartphone or tablet).

Navigate to [specific page or section where the issue occurs].

Observe the text overlapping issue.

Expected Behavior:

Text should be displayed clearly and should not overlap.

How to Get Started:

• Fork the OpenQuotes repository if you haven't already.
• Work on resolving the text overlapping issue on the mobile version of the project.
• Submit a pull request to share your solution with the community.

Contributor-Friendly: This bug report is suitable for contributors interested in UI and mobile responsiveness.

Join us in fixing this issue to ensure that our mobile users have an optimal experience. If you have any questions or ideas for a solution, please feel free to reach out. We appreciate your contributions and look forward to making OpenQuotes even better for all users! 🌟📱

UI Enhancement - Improve User Experience

Hello, potential contributors! 👋

We're on a mission to create a more visually appealing and user-friendly experience for OpenQuotes users. To achieve this, we're inviting new contributors to take on the task of making small UI improvements. This is an excellent opportunity to get involved in open source and to put your design skills to good use.

Issue Details:

Task: Your task is to enhance the project's user interface by making small but impactful improvements. This could include adjusting fonts, refining color choices, or fine-tuning the layout.

Objective: The goal is to create a visually pleasing and easy-to-navigate user interface, providing an enjoyable experience for our users.

How to Get Started:

• Fork the OpenQuotes repository if you haven't already.
• Analyze the project's current UI, focusing on areas that could benefit from improvement.
• Make your UI enhancements, ensuring they align with the project's overall design and purpose.
• Submit a pull request to share your improvements with the community.

Contributor-Friendly: This issue is ideal for those interested in UI design and improvements. Whether you're a beginner or an experienced designer, your contributions will help make OpenQuotes even better.

Join us in enhancing the user experience by refining the project's user interface. If you have any questions, need guidance, or want to share your progress, please reach out. We're excited to see your creative touch improve OpenQuotes! 🎨🌟

Change Background in every 5 minutes

Task: The task is to implement a feature that rotates the background image at regular intervals, providing a dynamic visual experience.

Good First Issue - Add Your Favorite Quotes

Contributing to OpenQuotes: Add Your Favorite Quotes

Welcome to OpenQuotes! We're excited to have you join our open-source community. Contributing is easy, and it's a great way to start your open-source journey. Follow these simple steps to add your favorite quotes to the project.

Step 1: Fork the Repository

1. Click the 'Fork' button at the top of the OpenQuotes repository. This action creates a copy of the repository in your GitHub account.

Step 2: Clone Your Fork

1. Go to your GitHub account and open your forked OpenQuotes repository.

2. Click on the 'Code' button and copy the repository URL to your clipboard.

3. Open your terminal or command prompt.

4. Use the following command to clone the repository to your local machine:

   git clone "repository_url"

   Replace "repository_url" with the URL you copied.

Step 3: Add Your Quote

1. Go to the project directory on your computer:

   cd OpenQuotes

2. Open the quotes.js file in your preferred text editor.

3. Add your quote to the quotes array following this format:

   {
       quote: "Your Quote Here",
       name: "Your Name",
       githubLink: "Your GitHub Profile URL"
   },

   • Replace "Your Quote Here" with your favorite quote.
   • Replace "Your Name" with your name.
   • Replace "Your GitHub Profile URL" with your GitHub profile link.

Step 4: Commit Your Changes

1. In your terminal, check the status of your changes:

   git status

2. Add your changes to a new commit:

   git add quotes.js

3. Commit your changes with a descriptive message:

   git commit -m "Added my inspirational quote"

Step 5: Push Your Changes

1. Push your changes to your GitHub repository:

   git push

Step 6: Create a Pull Request

1. Visit your forked OpenQuotes repository on GitHub.

2. Click the 'New Pull Request' button.

3. Compare the changes and click 'Create Pull Request.'

4. Provide a meaningful title and description for your pull request.

5. Click 'Create Pull Request' to submit it.

Congratulations! You've successfully added your quote to OpenQuotes. Your journey in open source has begun. If you have any questions or need assistance, feel free to reach out.

Thank you for your contribution!