Git Product home page Git Product logo

pokemon's Introduction

logo

In its ninth year, Hacktoberfest is a month-long celebration of open source software hosted by DigitalOcean. We welcome you to join open-source software enthusiasts, beginners, and the development community by contributing to open-source projects throughout the month of October. This can be accomplished in a variety of ways:

  • Prepare and share your project for collaboration
  • Contribute to the betterment of a project via pull requests
  • Organize an event
  • Mentor others
  • Donate directly to open source projects


Pokemon

series image

There is no doubt that we spent the majority of our youth watching anime, particularly Pokemon; we have seen and experienced it all. With Hacktoberfest 2022 approaching and me being one of the first people as maintainer, I decided to make this repository, which is essentially a very basic web-page that allows the user to browse and upload their favourite pokemons.

You can find all types characters on https://pokemon.gameinfo.io/

Contents of the Webpage

  1. index.html - Contains the content of the main/home page.
  2. index.css - Contains the styling given to the home page.
  3. about.html - Contains a little information about me.

What can you contribute?

Whether you are a rookie or a veteran, you can always offer something to a project. You may add your favourite character to the internet as a card in this project! Or perhaps you don't like the line you're reading right now and want to alter it. Sure! So why not?

How can you contribute?

To contribute in Hacktoberfest2022 , checkout the given link and win hactoberfest t-shirt ... https://hacktoberfest.digitalocean.com/

And That's It! Follow these steps to make your very first Pull request.

But what if i don't know how to add cards? :(

Everyone is not aware of every tool available in the world, no matter how simple or sophisticated it is. It's also not required to be familiar with every tool available. To add your own card, use the code below!

         <div class="card mb-3" style="max-width: 578px">
          <div class="row g-0">
            <div class="col-md-4">
              <img
                src="images/pikachu.png"
                class="img-fluid rounded-start"
                alt="..."
                data-aos="zoom-in"
                data-aos-duration="1000"
                data-aos-delay="60"
                style="width: 100%"
              />
            </div>
            <div class="col-md-8">
              <div class="card-body">
                <h5 class="card-title">Pokemon Name</h5>
                <p class="card-text">
                  Pokemon description
                </p>
                <p class="card-text electric">Pokemon Type</p>
              </div>
            </div>
          </div>
        </div>

Copy this code and paste it in the index.html file to make your changes. Try and test it on your own system and then create a Pull request. You can adjust height of image of character so that it will fit in card.

After this you just have to add correct class color to the pokemon type by changing the existing "yellow" to respective class color. For correct colors refer the same website.

Examples- image image image image

   .electric (Class name if the same color class doesn't exist) {
      background-color: yellow (Change the color here);
      width: 50%;
      border-radius: 5px;
      text-align: center;
  }

Congratulations!

Congratulation! You've just created your first pull request, and if it's merged, you may see it by clicking the link above!

pokemon's People

Contributors

dsasaank-369 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.