src/App.tsx

@@ -2,14 +2,12 @@ import React from 'react';
 import './App.css';
 import { Header } from './Header';
 import { Filters } from './Filters';
-import { Pokemon } from './Pokemon';
 
 function App() {
   return (
     <div className="App app_container">
       <Header />
       <Filters />
-      <Pokemon />
     </div>
   );
 }

src/Pokemon.css

@@ -1,108 +0,0 @@
-:root {
-    --grass: #5FBD58;
-    --bug: #92BC2C;
-    --dark: #595761;
-    --dragon: #0C69C8;
-    --electric: #F2D94E;
-    --fairy: #EE90E6;
-    --fighting: #D3425F;
-    --fire: #dc872f;
-    --flying: #A1BBEC;
-    --ghost: #5F6DBC;
-    --ground: #DA7C4D;
-    --ice: #75D0C1;
-    --normal: #A0A29F;
-    --poison: #B763CF;
-    --psychic: #ff2ca8;
-    --rock: #a38c21;
-    --steel: #5695A3;
-    --water: #539DDF;
-}
-
-html {
-    --pokename: #000;
-    --cardborder: #fff;
-    --pokenumber: hsl(228, 28%, 20%);
-    --info: #fff
-}
-
-@font-face {
-    font-family: 'Press Start 2P';
-    src: url("assets/PressStart2P-Regular.ttf") format("truetype");
-}
-
-.thumbnail__container {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: space-between;
-    padding: 1.5rem 0;
-    margin: 2rem;
-    /* border: 15px solid var(--cardborder); */
-    border-radius: 1rem;
-    min-width: 220px;
-    height: 285px;
-    text-align: center;
-    /* box-shadow: 0 5px 25px 1px rgb(0 0 0 / 50%); */
-    box-shadow:
-            0 1.6px 1.6px rgba(0, 0, 0, 0.023),
-            0 3.8px 3.8px rgba(0, 0, 0, 0.034),
-            0 6.9px 6.9px rgba(0, 0, 0, 0.041),
-            0 11.4px 11.4px rgba(0, 0, 0, 0.049),
-            0 18.8px 18.8px rgba(0, 0, 0, 0.056),
-            0 32.8px 32.8px rgba(0, 0, 0, 0.067),
-            0 71px 71px rgba(0, 0, 0, 0.09)
-;
-    transition: all 0.2s ease-in-out;
-}
-
-.thumbnail__container:hover {
-    transform: scale(1.2);
-}
-
-.thumbnail__container .poke__number {
-    font-size: 1.75em;
-}
-
-.info__icon:hover {
-    opacity: 1;
-}
-
-.info__icon {
-    margin-right: 15px;
-    margin-top: -4px;
-    font-size: 25px;
-    opacity: 0.5;
-}
-
-h3 {
-    font-family: 'Press Start 2P', cursive;
-    margin-bottom: 0.2rem;
-}
-
-.thumbnail__container .poke__number {
-    border-radius: 1rem;
-    padding: 0.2rem 0.4rem;
-    font-weight: 400;
-    font-size: 35px;
-    font-family: 'Teko', sans-serif;
-}
-
-.thumbnail__container img {
-    width: 120px;
-    height: 120px;
-}
-
-.thumbnail__container small {
-    text-transform: capitalize;
-}
-
-.card__header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-}
-
-.poke__name h3 {
-    margin-top: 0px;
-}

src/Pokemon.tsx

@@ -1,32 +0,0 @@
-import React from 'react';
-import './Pokemon.css';
-import testimage from './assets/cardimg.svg';
-
-export function Pokemon() {
-  return (
-    <div className="thumbnail__container">
-      <div className="card__header">
-        <div className="poke__number">#006</div>
-        <div className="info__icon">
-          <svg
-            stroke="currentColor"
-            fill="currentColor"
-            strokeWidth="0"
-            viewBox="0 0 512 512"
-            height="1em"
-            width="1em"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path d="M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z"></path>
-          </svg>
-        </div>
-      </div>
-      <div className="image__container">
-        <img src={testimage} alt="test" height={150} />
-      </div>
-      <div className="poke__name">
-        <h3>Charizard</h3>
-      </div>
-    </div>
-  );
-}