index.html

<!doctype html>
<html lang="en-us">

<head>

    <!-- Meta -->
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1">

    <title>Programming Basics</title>
    <meta name="description" content="">

    <!-- The compiled CSS file -->
    <link rel="stylesheet" href="./assets/Website/style.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
        integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

    <!-- Web fonts -->
    <link href="https://fonts.googleapis.com/css?family=Montserrat:400,400i,700|Source+Serif+Pro:700" rel="stylesheet">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Kaushan+Script&display=swap" rel="stylesheet">
    <!-- favicon.ico. Place these in the root directory. -->
    <link rel="shortcut icon" href="favicon.ico">

</head>

<body class="has-animations">


    <!-- Header -->
    <header class="align--center pt3">
        <div class="container--lg border--bottom pb3">
            <h1 class="mb2" >Programming Basics</h1>
            <h3 class="mb2">Start your Open Source Journey Here.</h3>
            <span>
                <a href="https://github.com/Astrodevil/Programming-Basics/" class="btn">View on Github</a>
            </span>
        </div>
    </header>
    <!--Nav bar added-->
  <div class="nav">
  <input type="checkbox" id="nav-check">
  
  <div class="nav-btn">
    <label for="nav-check">
      <span></span>
      <span></span>
      <span></span>
    </label>
  </div>
  
  <div class="nav-links">
    <a href="#about" >About</a>
    <a href="#guidelines" >Guidelines</a>
    <a href="#contributor" >Contributer</a>
    <a href="#support" >Support</a>
    <a href="#developer" >Devlopers</a>
    <a href="#opensource">Other Open Source Festival</a>
  </div>
</div>
<!--Nav bar end-->
    <main id="about">
        <!-- Focus -->
        <div class="container--lg pt1 pb1">
            <a href="https://hacktoberfest.digitalocean.com/"><img class=""
                    src="./assets/Website/img/HacktoberFest 2021.png" alt="HacktoberFest2021"></a>
            <div class="grid-row grid-row--center">
                <div class="grid-column span-1"></div>
                <div class="grid-column mt3 mb2">
                    <div class="border--bottom pb2 mb2">
                        <h2>About❓</h2>
                        <p>Want to start your open-source journey? You are at right place🎯<br><br>
                            This project contains basic solutions, source codes, book pdfs related to different
                            programming languages🤗. As everyone is learning one or many programming languages, so
                            contribution to this project will be very easy for you.<br><br>
                            You can also take help from this project towards your learning or you can contribute to make
                            this more helpful for others.<br><br>
                            So, What are you waiting for?</p>
                    </div>
                </div>
                <div class="grid-column span-1"></div>
            </div>
            <div class="grid-row grid-row--center">
                <div class="grid-column span-1"></div>
                <div class="grid-column mt3 mb2">
                    <div class="border--bottom pb2 mb2">
                        <h2 id ="guidelines">Contributing Guidelines 📝</h2>
                        <p>Thank you for your interest in contributing to our Repo! Pull requests are welcome. For major
                            changes, please open an issue first to discuss what you would like to change.<br><br>
                            To start contributing, follow the below guidelines:<br><br>
                        <ol>
                            1. Star and Fork this repository.<br><br>
                            2. Clone your forked copy of the project.<br><br>
                            <code style="width: 150px;">
                                    git clone https://github.com/&lt;your_user_name&gt;/Programming-Basics.git
                                </code><br><br>
                            3. Navigate to the project directory 📁 .<br><br>
                            <code>
                                    cd Programming-Basics
                                </code><br><br>
                            4. Add a reference(remote) to the original repository.<br><br>
                            <code>
                                    git remote add upstream https://github.com/Astrodevil/Programming-Basics.git 
                                </code><br><br>
                            5. Check the remotes for this repository.<br><br>
                            <code>
                                    git remote -v
                                </code><br><br>
                            6. Always take a pull from the upstream repository to your master branch to keep it at par
                            with the main project(updated repository).<br><br>
                            <code>
                                    git pull upstream main
                                </code><br><br>
                            7. Create a new branch.<br><br>
                            <code>
                                    git checkout -b &lt;your_branch_name&gt;
                                </code><br><br>
                            8. Perfom your desired changes to the code base.<br><br>
                            9. Track your changes✔️ .<br><br>
                            <code>
                                    git add . 
                                </code><br><br>
                            10. Commit your changes .<br><br>
                            <code>
                                    git commit -m "Relevant message"
                                </code><br><br>
                            11. Push the committed changes in your feature branch to your remote repo.<br><br>
                            <code>
                                    git push -u origin &lt;your_branch_name&gt;
                                </code><br><br>
                            12. To create a pull request, click on compare and pull requests.<br><br>
                            13. Add appropriate title and description to your pull request explaining your
                            changes and efforts done.<br><br>
                            14. Click on Create Pull Request.<br><br>
                            15. Woohoo! You have made a PR to the Programming-Basics 💥 . Wait for your
                            submission to be accepted and your PR to be merged.<br>
                        </ol>
                        </p>
                    </div>
                </div>
            </div>

            <div class="grid-row grid-row--center">
                <div class="grid-column span-1"></div>
                <div class="grid-column mt3 mb2">
                    <div class="border--bottom pb2 mb2 ">
                     
                        <h2  id ="opensource">Other Open Source Program :</h2>
                     

                        <div class="d-flex justify-content-between">
                        <span>
                            <a href="https://summerofcode.withgoogle.com/">

                            <img src="https://summerofcode.withgoogle.com/static/img/summer-of-code-logo.svg" width="100px" height="100px">

                            </a>
                            
                        </span>
                         <span>
                            
                            <a href="https://gssoc.girlscript.tech
                            ">

                            <img src="https://gssoc.girlscript.tech/images/favicon/favicon.png" width="100px" height="100px">

                            </a>
                        
                        </span>
                        
                         <span>
                            
                            <a href="https://osoc.be
                            ">

                            <img src="https://osoc.be/img/logo/logo-osoc-color.svg" width="100px" height="100px">

                            </a>
                        
                        </span>
                        
                           
                         <span>
                            
                            <a href="http://www.pclubsummerofcode.in/static/mentors/img/pclub-logo-white.png
                            ">

                            <img src="http://www.pclubsummerofcode.in/static/mentors/img/pclub-logo-white.png" width="100px" height="100px">

                            </a>
                        
                        </span>
                        
                         <span>
                            
                            <a href="https://codeheat.org
                            ">

                            <img src="https://codeheat.org/img/logo-dark.png" width="100px" height="100px">

                            </a>
                        
                        </span>
                        <span>
                        <a href="https://opensourceinternships.herokuapp.com/">..more
                        </a>
                        </span>


                        </div>
                    </div>
                </div>
            </div>
            

            <div class="grid-row grid-row--center">
                <div class="grid-column span-1"></div>
                <div class="grid-column mt3 mb2">
                    <div class="border--bottom pb2 mb2">
                        <h2 id ="contributor">Our valuable Contributors👩‍💻👨‍💻 :</h2>
                        <span><a href="https://github.com/Astrodevil/Programming-Basics/graphs/contributors">
                                <img src="https://contributors-img.web.app/image?repo=Astrodevil/Programming-Basics" />
                            </a></span>
                    </div>
                </div>
            </div>
        </div>

    </main>

    <!-- Footer -->

    <footer class="pt1 pb3 align--center-on-mobile">
        <div class="container">
            <div class="grid-row">
                <div class="grid-column mt2 span-half">
                    <p id="developer">Developed by <a href="https://www.linkedin.com/in/-sahibsingh-/">Sahib Singh</a> & <a href="https://www.linkedin.com/in/nishant-kumar-4231061b4"> Nishant Kumar</a></p>
                </div>
            </div>
        </div>
    </footer>
    <div id="support">
         <script data-name="BMC-Widget" data-cfasync="false" src="https://cdnjs.buymeacoffee.com/1.0.0/widget.prod.min.js" data-id="Astrodevil" data-description="Support me on Buy me a coffee!" data-message="" data-color="#40DCA5" data-position="Right" data-x_margin="50" data-y_margin="50">
</script>
    </div>
    <!-- Scroll reveal -->
    <script src="https://unpkg.com/scrollreveal@4.0.0/dist/scrollreveal.min.js"></script>
    <!-- The compiled JavaScript file -->
    <script src="./assets/Website/script.js"></script>
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
        integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
        crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
        integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
        crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
        integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
        crossorigin="anonymous"></script>

</body>

</html>