ajout sticky

src/App.css

@@ -9,6 +9,11 @@ body {
 background-color: #ffff;
 }
 
+.sticky {
+  position: sticky;
+  top: 0px;
+}
+
 .single-poke {
   background-color: #ff0000;
 }

src/App.js

@@ -38,23 +38,24 @@ class App extends Component {
   render() {
     return (
       <div className="App">
-        <section className="single-poke">
-        <img src="https://logos-world.net/wp-content/uploads/2020/05/Pokemon-Logo.png" alt="logo-pokemon"/>
+        <div className='sticky'>
+          <section className="single-poke">
+          <img src="https://logos-world.net/wp-content/uploads/2020/05/Pokemon-Logo.png" alt="logo-pokemon"/>
 
-          {this.state.currentPokemon ?
-            (<div className="poke-info">
-              <img className="big" src={`https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/${this.state.currentPokemon.id}.png`} alt="img-info"></img>
-              <div>
-                <p><b>Name : </b> {this.state.currentPokemon.name}</p>
-                <p><b>Height : </b>{this.state.currentPokemon.height}</p>
-                <p><b>Weight : </b>{this.state.currentPokemon.weight}</p>
-                <p><b>Type : </b>{this.state.currentPokemon.types[0].type.name}</p>
-
-              </div>
-            </div>) :
-            (<h1>Choisis un pokemon</h1>)
-          }
-        </section>
+            {this.state.currentPokemon ?
+              (<div className="poke-info">
+                <img className="big" src={`https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/${this.state.currentPokemon.id}.png`} alt="img-info"></img>
+                <div>
+                  <p><b>Name : </b> {this.state.currentPokemon.name}</p>
+                  <p><b>Height : </b>{this.state.currentPokemon.height}</p>
+                  <p><b>Weight : </b>{this.state.currentPokemon.weight}</p>
+                  <p><b>Type : </b>{this.state.currentPokemon.types[0].type.name}</p>
+                </div>
+              </div>) :
+              (<h1>Choisis un pokemon</h1>)
+            }
+          </section>
+        </div>
         <section className="poke-img">
           {this.state.list.map((elem, index) => {
             return (