Coder Social home page Coder Social logo

prekshamohre / hacktober-fests Goto Github PK

View Code? Open in Web Editor NEW

This project forked from shankarlohar/hacktober-fests

0.0 1.0 0.0 154 KB

Learn to make your first open source contribution here.

Home Page: https://shankarlohar.github.io/Hacktober-Fests/

JavaScript 0.01% CSS 8.32% HTML 91.68%

hacktober-fests's Introduction

Hacktober-Fests

Hey everyone! below you can learn to contribute to open source ๐Ÿ˜Š.

Try improving this Java Snake Game if you already know how to contribute! click -> ๐Ÿ

image

Add your card to the website. Or add a fun feature... Anything you feel is cool or weird - Add it! ๐Ÿ‘Œ

Open the index.html file and scroll to the bottom to reach the mark.
Now add this follwing code snippet. (with your github username where required)
<!-- Team member -->
            <div class="col-xs-12 col-sm-6 col-md-4">
                <div class="image-flip" >
                    <div class="mainflip flip-0">
                        <div class="frontside">
                            <div class="card">
                                <div class="card-body text-center">
                                    <p><img class=" img-fluid" src="[PASTE LINK TO YOUR IMAGE]" alt="card image"></p>
                                    <h4 class="card-title">[YOUR NAME]</h4>
                                    <p class="card-text">[ADD YOUR LINE]</p>
                                    <a href="https://github.com/[YOUR GITHUB USERNAME]" class="btn btn-primary btn-sm"><i class="fa fa-plus"></i></a>
                                </div>
                            </div>
                        </div>
                        <div class="backside">
                            <div class="card">
                                <div class="card-body text-center mt-4">
                                    <h4 class="card-title">[YOUR NAME]</h4>
                                    <p class="card-text">[ADD YOUR LINE]</p>
                                    <ul class="list-inline">
                                        <li class="list-inline-item">
                                            <a class="social-icon text-xs-center" target="_blank" href="[YOUR FACEBOOK URL]">
                                                <i class="fa fa-facebook"></i>
                                            </a>
                                        </li>
                                        <li class="list-inline-item">
                                            <a class="social-icon text-xs-center" target="_blank" href="[YOUR TWITTER]">
                                                <i class="fa fa-twitter"></i>
                                            </a>
                                        </li>
                                        <li class="list-inline-item">
                                            <a class="social-icon text-xs-center" target="_blank" href="[YOUR INSTAGRAM]">
                                                <i class="fa fa-instagram"></i>
                                            </a>
                                        </li>
                                        <li class="list-inline-item">
                                            <a class="social-icon text-xs-center" target="_blank" href="[YOUR LINKEDIN]">
                                                <i class="fa fa-linkedin"></i>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- ./Team member -->

Save HTML file, Push your code to your forked repository and send a merge request

  • Step 3: Change the background Color of the webpage
Open the style.css file and find the mark to this code snippet and change the color.
#team {
    /* Change this tag color to your choice */
    background: [YOUR COLOR HEX CODE OR NAME] !important;
}

Push your code and send a merge request

  • Step 4: Change navbar color.
Open the index.html(changed) file and find the mark to this code snippet and change the color.
<!-- Change navbar background color here -->
    <nav class="navbar navbar-expand-lg navbar-light" style="background-color: [YOUR COLOR HERE];">

Push your code and send a merge request

  • Step 5: Add your name to the contributers list.
Open the README.md file and scroll to the bottom to contributers mentions.
Now add this follwing code snippet (with your github username where required.) at the mark.
<td align="center">
<a href="https://github.com/[YOUR GITHUB USERNAME HERE]">
    <img src="[YOUR PROFILE IMAGE URL]" width="100px;" alt=""/>
    <br />
    <sub>
        <b>
            [YOUR NAME HERE]
        </b>
    </sub>
</td>

Save your file Push your code and send a merge request

  • Additional Step: You can add something to the website of your own! ๐Ÿ˜Š or check the issues tab of this repository. You know now how it works. ๐Ÿ˜‰

    image

    Contributer of the login page

  • Step 6: Check your HACKTOBERFEST page!

START CONTRIBUTING ๐Ÿ‘

Thank you โค!


Shankar Lohar

Sourav Nayek

Harsh Chhikara

Rudransh Khandelwal

Vaibhav Rajput

Tanuj Kalonia

MUJJI-ASIF

PARINATI GAUR

Naveen Yadav

Joseph Jaison

hacktober-fests's People

Contributors

sourav416 avatar vaibhavsinghrajput avatar ruds18 avatar bhavyangana avatar tanuj-kalonia avatar joseph-jaison avatar naveen28101 avatar gaurgirl6117 avatar shreyashmohadikar avatar muji-asif avatar prekshamohre avatar adityagoel0320 avatar argishh avatar hitesh11tahiliani avatar danica2345 avatar adityasp1 avatar fikriazain avatar guilhermeorcezi avatar harshchhikara avatar monson2002 avatar nikhilkd avatar shubhee01 avatar sidhrth04 avatar piyush-mahajan avatar rohinirai010 avatar sarthaksharma660 avatar lokesh-rathore avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.