чистый css

React/HW_React_4/src/App.scss

@@ -1,23 +1,26 @@
 .App {
   text-align: center;
+}
 
-  .Gallery{
+.Gallery{
     max-width: 80%;
     margin-top:40px;
 
-    img{
+}
+
+  .Gallery img{
       width: 400px;
       height:200px;
       border:3px solid blue;
-    }
+  }
 
-    button{
+  .Gallery  button{
       width: 100px;
       height: 25px;
       margin: 20px;
       border:1px solid yellow;
       border-radius: 10px;
-      bacKground-color:pink;
+      background-color:pink;
     }
 
     .Dots{
@@ -25,18 +28,17 @@
       flex-direction: row;
       justify-content: center;
       margin-top:10px;
+    }
 
-      .DotsFon {
+    .DotsFon {
         margin: 10px;
         width: 17px;
         height: 17px;
         background-color: black;
         border-radius: 50%;
-      }
-      .DotsFon--active {
+    }
+
+    .DotsFon--active {
         background-color: red;
-      }
     }
-  }
-}
 

React/HW_React_4/src/App.js

@@ -1,7 +1,7 @@
 import logoDefault from './logo.svg';
 import {useEffect, useState, useRef} from "react";
 import React from 'react';
-import './App.scss';
+import './App.css';
 import pic1 from './pics/h1.jpg';
 import pic2 from './pics/h2.jpg';
 import pic3 from './pics/h3.jpg';