-
Notifications
You must be signed in to change notification settings - Fork 382
/
index.html
10383 lines (9993 loc) · 398 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="shortcut icon" href="icons/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
/>
<link
rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.4.1/css/all.css"
/>
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Righteous&display=swap"
/>
<link rel="stylesheet" href="index.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<title>Poké-Dex</title>
</head>
<body>
<audio
src="./sound/mario.mp3"
class="audio"
style="visibility: hidden"
></audio>
<!-- Navigation Bar -->
<nav class="navbar navbar-expand-lg navbar-dark fixed-top">
<a class="navbar-brand navTitle" href="index.html">
<img height="10%" width="20%" src="icons/pokedex.svg" /> Poké-Dex
</a>
<button
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation"
class="navbar-toggler"
data-target="#navbarSupportedContent"
data-toggle="collapse"
type="button"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
<li class="nav-item itemNav">
<a class="nav-link" href="#header">Home</a>
</li>
<li class="nav-item itemNav">
<a class="nav-link" href="#gallery-title">Pokémon</a>
</li>
<li class="nav-item itemNav">
<a class="nav-link" href="about.html">About</a>
</li>
<li class="nav-item itemNav">
<p class="nav-link" id="toggle">🌞</p>
</li>
</ul>
</div>
</nav>
<!-- Header Section -->
<div class="jumbotron text-center" id="header">
<h2 class="display-4">Poké-Dex</h2>
</div>
<!-- Share pokemon info -->
<div class="info">
<p class="lead">
We all love Pokémon, don't we? Go ahead and share your favourite with
us!
</p>
<a href="#gallery-title"
><i class="fas fa-chevron-down fa-6x gallery-icon" id="icon1"></i
></a>
</div>
<!-- Gallery -->
<div id="gallery-title" class="gallery-div">
<h1 class="gallery-head" id="gallery1">Pokémon gallery</h1>
<div class="view-div">
<button class="view-button" id="normal-view">
<img src="icons/grid-small.png" /> Normal
</button>
<button class="view-button" id="compact-view">
<img src="icons/grid-large.png" /> Compact
</button>
</div>
</div>
<a
href="#gallery-title"
id="#upArrow"
style="position: relative; display: var(--arrow-display)"
>
<img
src="./icons/up_arrow.png"
style="
z-index: 10;
position: fixed;
top: auto;
bottom: 10px;
right: 10px;
background-color: white;
border-radius: 100px;
"
/>
</a>
<section id="gallery">
<div class="container">
<div id="pokemon-row" class="row">
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge normal">Normal</div>
</div>
<img class="card-img-top" src="./images/Ditto.png" alt="Ditto" />
<div class="card-body">
<h5 class="card-title">Ditto</h5>
<p class="card-text">
Ditto is a unique Pokémon because of the ability to breed with
any Pokémon except for another Ditto or Pokémon in the
Undiscovered Egg group. It is a simple, pinkish-purple,
amorphous blob, with two small dots as eyes and a long, curved
mouth. Ditto will transform into anything it sees, even
inanimate objects. When it sees an enemy, it will change its
DNA code to match theirs.
</p>
<a
href="https://github.com/nandiniguptaz"
class="btn btn-outline-danger btn-sm"
>Contributed by - Nandini</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge electric">Electric</div>
</div>
<img
class="card-img-top"
src="./images/Zeraora.png"
alt="Zeraora"
/>
<div class="card-body">
<h5 class="card-title">Zeraora</h5>
<p class="card-text">
Zeraora can close the distance between itself and its
opponents as fast as lightning, dealing massive amounts of
damage all at once. It has excellent combination of Dash and
Attack moves. Its high stats in both mobility and offense make
Zeraora perfect for moving quickly around the battlefield and
attacking your opponents. Zeraora's low endurance, however,
means that you need to keep an eye on its HP level and be
ready to make a quick retreat when necessary.
</p>
<a
href="https://github.com/Ahsan-Ehtesham"
class="btn btn-outline-danger btn-sm"
>Contributed by - Ahsan-Ehtesham</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge normal">Normal</div>
<div class="badge flying">Flying</div>
</div>
<img
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/083.png"
alt="Farfetch'd"
/>
<div class="card-body">
<h5 class="card-title">Farfetch'd</h5>
<h5 class="card-subtitle">#083</h5>
<p class="card-text">
Farfetch'd is a wild duck Pokémon that is a Normal/Flying
type. The plant stalk it holds is its weapon. The stalk is
used like a sword to cut all sorts of things. If it eats the
stick it carries as emergency rations, it runs off in search
of a new stick. This Pokémon has been known to fight others
over sticks.
</p>
<a
href="https://github.com/ajaj895"
class="btn btn-outline-danger btn-sm"
>
Contributed by - ajaj895
</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge dark">Dark</div>
<div class="badge grass">Grass</div>
</div>
<img
class="card-img-top"
src="https://cdn2.bulbagarden.net/upload/thumb/a/a5/893Zarude.png/1200px-893Zarude.png"
alt="Zarude"
/>
<div class="card-body">
<h5 class="card-title">Zarude</h5>
<h5 class="card-subtitle">#893</h5>
<p class="card-text">
Zarude is a Dark and Grass type Pokémon introduced in
Generation 8. It is known as the Rogue Monkey Pokémon. This
Pokémon also featured in the movie 'Pokémon the Movie: Secrets
of the Jungle'. This Pokémon lives in a pack with others of
its kind. It's incredibly aggressive, and the other Pokémon of
the forest fear it.
</p>
<a
href="https://github.com/Mridul2820"
class="btn btn-outline-danger btn-sm"
>
Contributed by - Mridul2820
</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge electric">Electric</div>
</div>
<img
alt="Detective Pikachu"
class="card-img-top"
src="./images/Detective_Pikachu.png"
/>
<br /><br /><br />
<div class="card-body">
<h5 class="card-title">Detective Pikachu</h5>
<p class="card-text">
Detective Pikachu was once an ordinary Pikachu belonging to
Harry Goodman, a detective who works at Ryme City Detective
Agency. While on a case, Harry and Pikachu met with a car
accident where Harry goes missing and Pikachu gains amnesia
while also mysteriously gaining the ability to act and speak
like a human. Two months after the accident, he meets Tim
Goodman sometime after Tim arrives in Ryme City. Together with
Tim and the Ryme City Detective Agency, Pikachu solves puzzles
and mysteries.
</p>
<a
href="https://github.com/m3gh4l4"
class="btn btn-outline-danger btn-sm"
>Contributed by - m3gh4l4</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge dragon">Dragon</div>
</div>
<img
alt="Fraxure"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/611.png"
/>
<br /><br /><br />
<div class="card-body">
<h5 class="card-title">Fraxure</h5>
<p class="card-text">
Fraxure is a bipedal reptilian Pokémon with dinosaur and
draconian traits. Its sturdy, thickset body is composed of
green and gray armor-like scales. It has long, sharp gray
tusks with red tips protruding from either side of is mouth.
Its mouth is beak-like, similar to that of a turtle.
</p>
<a
href="https://github.com/Yuktashettigar16"
class="btn btn-outline-danger btn-sm"
>Contributed by - Yuktashettigar16</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge grass">Grass</div>
</div>
<img
alt="Bayleef"
class="card-img-top"
src="./images/bayleef.png"
/>
<br /><br /><br />
<div class="card-body">
<h5 class="card-title">Bayleef</h5>
<p class="card-text">
Bayleef is a quadrupedal, pale-yellow Pokémon that resembles a
sauropod dinosaur. It has a long neck, red eyes, a short,
rounded snout, and a stubby tail. Each foot has a single,
light gray nail. Sprouting from its forehead is a green leaf
that curves back over its head and around its neck are a
series of tightly curled leaves. Inside the leaves are small
tree shoots.
</p>
<a
href="https://github.com/alfredoptarigan"
class="btn btn-outline-danger btn-sm"
>Contributed by alfredoptarigan</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge psychic">Psychic </div>
</div>
<img
alt="Abra"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/063.png"
/>
<div class="card-body">
<h5 class="card-title">Abra</h5>
<h6 class="card-subtitle">#063</h6>
<p class="card-text">
Abra uses psychic powers while it sleeps. Its dreams affect
the powers that the Pokemon wields.
</p>
<a
href="https://github.com/felipprodrigues"
class="btn btn-outline-danger btn-sm"
>Contributed by - felipprodrigues</a
>
<a
style="margin-top: 20px"
href="https://github.com/Float07"
class="btn btn-outline-danger btn-sm"
>
Improved by - Float07</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge normal">Normal</div>
</div>
<img
alt="Arceus"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/493.png"
/>
<div class="card-body">
<h5 class="card-title">Arceus</h5>
<h6 class="card-subtitle">#493</h6>
<p class="card-text">
It is described in mythology as the Pokémon that shaped the
universe with its 1,000 arms. It is told in mythology that
this Pokémon was born before the universe even existed.
</p>
<a
class="btn btn-outline-danger btn-sm"
href="https://github.com/sudo-nick16"
>Contributed by - sudo-nick16</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge fighting">Fighting</div>
</div>
<img
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/056.png"
alt="Mankey"
/>
<div class="card-body">
<h5 class="card-title">Mankey</h5>
<h6 class="card-subtitle">#056</h6>
<p class="card-text">
Mankey is a simian Pokémon, similar to a New World monkey. It
is bipedal and has a round body covered in whitish, shaggy
fur. Its nose is similar to a pig's snout, and it has narrow,
red eyes and triangular ears with brown insides. Mankey's
three-fingered hands, two-toed feet, and the tip of its
curved, prehensile tail are brown. Along with Stufful, it is
the smallest known Fighting-type Pokémon.
</p>
<a
href="https://github.com/gitgibber"
class="btn btn-outline-danger btn-sm"
>Contributed by - gitgibber</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge fighting">Fighting</div>
</div>
<img
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/057.png"
alt="Primeape"
/>
<div class="card-body">
<h5 class="card-title">Primeape</h5>
<h6 class="card-subtitle">#057</h6>
<p class="card-text">
Primeape is a Fighting-type Pokémon introduced in Generation
I. It evolves from Mankey starting at level 28.
</p>
<a
href="https://github.com/pbharathreddy"
class="btn btn-outline-danger btn-sm"
>Contributed by - Bharath Reddy</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge dark">Dark</div>
<div class="badge ground">Ground</div>
</div>
<img
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/553.png"
alt="Krookodile"
/>
<div class="card-body">
<h5 class="card-title">Krookodile</h5>
<h6 class="card-subtitle">#553</h6>
<p class="card-text">
Krookodile is a Ground/Dark type Pokémon introduced in
Generation 5 . It is known as the Intimidation Pokémon. This
Pokémon is known as the Bully of the Sands. Krookodile’s
mighty jaws can bite through heavy plates of iron with almost
no effort at all. Fun Fact: Ash's Krookodile has not lost a
single match in the Unova region in the anime.
</p>
<a
href="https://github.com/shreayan98c"
class="btn btn-outline-danger btn-sm"
>Contributed by - Shreayan Chaudhary</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<!-- Code by Shrimad Bhagwat -->
<div class="card">
<div class="header">
<div class="badge psychic">Psychic</div>
</div>
<img
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/150.png"
alt="Mewtwo"
/>
<div class="card-body">
<h5 class="card-title">Mewtwo</h5>
<h6 class="card-subtitle">#150</h6>
<p class="card-text">
Mewtwo is a Psychic-type Legendary Pokémon introduced in
Generation I.
</p>
<a
href="https://github.com/Shrimad-Bhagwat"
class="btn btn-outline-danger btn-sm"
>Contributed by - Shrimad Bhagwat</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge electric">Electric</div>
</div>
<img
alt="Pikachu"
class="card-img-top"
src="https://i.pinimg.com/originals/76/47/9d/76479dd91dc55c2768ddccfc30a4fbf5.png"
/>
<div class="card-body">
<h5 class="card-title">Pikachu</h5>
<h6 class="card-subtitle">#025</h6>
<p class="card-text">
An Electric Type Pokémon who is loved by everyone and is Ash's
Best Friend!
</p>
<a
class="btn btn-outline-danger btn-sm"
href="https://github.com/AM1CODES"
>Contributed by - AM1CODES</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge flying">Flying</div>
<div class="badge rock">Rock</div>
</div>
<img
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/142.png"
alt="Aerodactyl"
/>
<div class="card-body">
<h5 class="card-title">Aerodactyl</h5>
<h6 class="card-subtitle">#142</h6>
<p class="card-text">
Aerodactyl is a dual-type Rock/Flying Fossil Pokémon
introduced in Generation I. It is resurrected from an Old
Amber, and while it is not known to evolve into or from any
other Pokémon, Aerodactyl can Mega Evolve into Mega Aerodactyl
using the Aerodactylite.
</p>
<a
href="https://github.com/narenbakshi97"
class="btn btn-outline-danger btn-sm"
>Contributed by - Naren Bakshi</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge electric">Electric</div>
<div class="badge steel">Steel</div>
</div>
<img
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/082.png"
alt="Magneton"
/>
<div class="card-body">
<h5 class="card-title">Magneton</h5>
<p class="card-text">
This Pokémon is three Magnemite that have linked together.
Magneton sends out powerful radio waves to study its
surroundings.
</p>
<a
href="https://github.com/shyam640"
class="btn btn-outline-danger btn-sm"
>Contributed by - shyam640</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge ghost">Ghost</div>
<div class="badge poison">Poison</div>
</div>
<img
alt="Haunter"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/093.png"
/>
<div class="card-body">
<h5 class="card-title">Haunter</h5>
<h6 class="card-subtitle">#093</h6>
<p class="card-text">
Haunter is a dual ghost/poison type dangerous Pokémon. If one
beckons you while floating in darkness, you must never
approach it. This Pokémon will try to lick you with its tongue
and steal your life away.
</p>
<a
class="btn btn-outline-danger btn-sm"
href="https://github.com/auxfuse"
>Contributed by - Auxfuse</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge flying">Flying</div>
<div class="badge ground">Ground</div>
</div>
<img
class="card-img-top"
src="images/gliscor.png"
alt="Gliscor"
/>
<div class="card-body">
<h5 class="card-title">Gliscor</h5>
<p class="card-text">
Gliscor is a large, mainly blue-purple vampire bat-like
Pokémon. Its legs have two toes and a slightly darker circular
coloration on the underside, and its tail has two barbs,
giving its tail the resemblance of a vampire's fangs. Its arms
are red with thin striations and are completely detached from
its black wings, and each is ended with large pincers. Its
ears have discernible, red, chambered ear insides, and its
eyes are yellow.
</p>
<a
href="https://github.com/AniketNayek3101"
class="btn btn-outline-danger btn-sm"
>Contributed by - AniketNayek3101</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge water">Water</div>
</div>
<img
alt="Horsea"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/116.png"
/>
<div class="card-body">
<h5 class="card-title">Horsea</h5>
<h6 class="card-subtitle">#116</h6>
<p class="card-text">
Horsea is a water-type dragon pokemon.It evolves into Seadra
and then into Kingdra(dragon-scale).Horsea eats small insects
and moss off of rocks. If the ocean current turns fast, this
POKéMON anchors itself by wrapping its tail around rocks or
coral to prevent being washed away.
</p>
<a
href="https://github.com/donppyl"
class="btn btn-outline-danger btn-sm"
>Contributed by - Donppyl</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/405.png"
alt="Luxray"
/>
<div class="card-body">
<h5 class="card-title">Luxray</h5>
<h6 class="card-subtitle">#405</h6>
<p class="card-text">
Luxray can see through solid objects. It will instantly spot
prey trying to hide behind walls, even if the walls are thick.
</p>
<a
href="https://github.com/guptasajal411"
class="btn btn-outline-danger btn-sm"
>Contributed by - guptasajal411</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
alt="Bellossom"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/182.png"
/>
<div class="card-body">
<h5 class="card-title">Bellossom</h5>
<h6 class="card-subtitle">#182</h6>
<p class="card-text">
Plentiful in the tropics. When it dances, its petals rub
together and make a pleasant ringing sound.
</p>
<a
href="https://github.com/thalytabdn"
class="btn btn-outline-danger btn-sm"
>Contributed by - thalytabdn</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/689.png"
alt="Barbaracle"
/>
<div class="card-body">
<h5 class="card-title">Barbaracle</h5>
<p class="card-text">
Barbaracle is a Rock/Water type Pokémon introduced in
Generation 6. It is known as the Collective Pokémon.
</p>
<a
href="https://github.com/the-artemis"
class="btn btn-outline-danger btn-sm"
>Contributed by - The_Artemis</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
alt="Bellsprout"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/069.png"
/>
<div class="card-body">
<h5 class="card-title">Bellsprout</h5>
<h6 class="card-subtitle">#069</h6>
<p class="card-text">
Bellsprout is a Grass/Poison type Pokémon introduced in
Generation 1. It is known as the Flower Pokémon.
</p>
<a
href="https://github.com/Benzson92"
class="btn btn-outline-danger btn-sm"
>Contributed by - Benzson92</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
alt="Celebi"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/251.png"
/>
<div class="card-body">
<h5 class="card-title">Celebi</h5>
<h6 class="card-subtitle">#251</h6>
<p class="card-text">
"Celebi is a mythical psychic and grass pokemon with no
further evolutions. Celebi is the gaurdian of the Ilex forest"
</p>
<a
class="btn btn-outline-danger btn-sm"
href="https://github.com/Shreya-L"
>Contributed by Shreya-L</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/689.png"
alt="Barbaracle"
/>
<div class="card-body">
<h5 class="card-title">Barbaracle</h5>
<p class="card-text">
Barbaracle is a Rock/Water type Pokémon introduced in
Generation 6. It is known as the Collective Pokémon.
</p>
<a
href="https://github.com/the-artemis"
class="btn btn-outline-danger btn-sm"
>Contributed by - The_Artemis</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
class="card-img-top"
src="https://static.pokemonpets.com/images/monsters-images-800-800/2474-Shiny-PorygonZ.png"
alt="Porygon-Z"
/>
<div class="card-body">
<h5 class="card-title">Porygon-Z</h5>
<h6 class="card-subtitle">#474</h6>
<p class="card-text">
Porygon-Z's appearance is similar to that of Porygon and
Porygon2, though darker in color when compared to both of
them. It has a very smooth appearance much like Porygon2.
</p>
<a
href="https://github.com/mkhy19"
class="btn btn-outline-danger btn-sm"
>Contributed by - mkhy19</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
alt="Treecko"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/252.png"
/>
<div class="card-body">
<h5 class="card-title">Treecko</h5>
<h6 class="card-subtitle">#252</h6>
<p class="card-text">
Treecko has small hooks on the bottom of its feet that enable
it to scale vertical walls. This Pokémon attacks by slamming
foes with its thick tail.
</p>
<a
class="btn btn-outline-danger btn-sm"
href="https://github.com/letbarros"
>Contributed by Leticia Barros</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
alt="Vileplume"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/045.png"
/>
<div class="card-body">
<h5 class="card-title">Vileplume</h5>
<h6 class="card-subtitle">#045</h6>
<p class="card-text">
Vileplume is a Grass/Poison type Pokémon , also known as the
Flower Pokémon.It has the world’s largest petals. With every
step, the petals shake out heavy clouds of toxic pollen.
</p>
<a
class="btn btn-outline-danger btn-sm"
href="https://github.com/asthakri50"
>Contributed by - Astha Kumari</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<div class="header">
<div class="badge water">Water</div>
</div>
<img
alt="Vaporeon"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/134.png"
/>
<div class="card-body">
<h5 class="card-title">Vaporeon</h5>
<h6 class="card-subtitle">#134</h6>
<p class="card-text">
Vaporeon is a Water-type Pokémon and is one of several evolved
forms of Eevee.
</p>
<a
class="btn btn-outline-danger btn-sm"
href="https://github.com/bradmwong"
>Contributed by bradmwong</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
alt="Eelektross"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/604.png"
/>
<div class="card-body">
<h5 class="card-title">Eelektross</h5>
<h6 class="card-subtitle">#604</h6>
<p class="card-text">
Eelektross is an Electric type Pokémon. While not invincible,
this electric eel is an unusual footnote that usually has to
get taken out by brute force alone.
</p>
<a
class="btn btn-outline-danger btn-sm"
href="https://github.com/kkkkkabir"
>Contributed by - Kabir Jain</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
alt="Kecleon"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/352.png"
/>
<div class="card-body">
<h5 class="card-title">Kecleon</h5>
<h6 class="card-subtitle">#352</h6>
<p class="card-text">
Kecleon's ability Color Change forces it to change its type to
whatever the last move used against it was.
</p>
<a
class="btn btn-outline-danger btn-sm"
href="https://github.com/ComputerScientist-01"
>Contributed by - Jayvardhan Rathi</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
alt="Bulbasaur"
class="card-img-top"
src="https://www.pngkit.com/png/full/62-622458_pokemon-png-icon-png-images-pokemon-bulbasaur-png.png"
/>
<div class="card-body">
<h5 class="card-title">Bulbasaur</h5>
<h6 class="card-subtitle">#001</h6>
<p class="card-text">
"Bulbasaur is a cute Pokémon born with a large seed firmly
affixed to its back; the seed grows in size as the Pokémon
does. Along with Squirtle and Charmander, Bulbasaur is one of
the three Pokémon available at the beginning of Pokémon Red
and Blue. It evolves into Ivysaur."
</p>
<a
class="btn btn-outline-danger btn-sm"
href="https://github.com/nikhil-2911"
>Contributed by - nikhil-2911</a
>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card">
<img
alt="Wimpod"
class="card-img-top"
src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/767.png"
/>
<div class="card-body">
<h5 class="card-title">Wimpod</h5>
<h6 class="card-subtitle">#767</h6>
<p class="card-text">
This Pokémon is cowardly by nature and wary of both noise and
sudden movements.
</p>
<a
class="btn btn-outline-danger btn-sm"
href="https://github.com/acearpit"
>Contributed by - acearpit</a
>
</div>
</div>