From c818264ed47b032ea26b9f5874ef361b92e3faf4 Mon Sep 17 00:00:00 2001
From: Anastasiia Denysenko <nastyadenisenko17@gmail.com>
Date: Thu, 9 Jan 2025 17:43:01 +0200
Subject: [PATCH] code improvements

---
 src/index.html                |  8 ++++----
 src/styles/blocks/button.scss | 32 +++++++++++++++----------------
 src/styles/blocks/card.scss   | 36 +++++++++++++++++------------------
 src/styles/blocks/stars.scss  |  2 +-
 4 files changed, 38 insertions(+), 40 deletions(-)

diff --git a/src/index.html b/src/index.html
index 2e125aa422..ae1be58cc0 100644
--- a/src/index.html
+++ b/src/index.html
@@ -47,7 +47,7 @@
       </div>
     </div>
 
-    <div class="stars">
+    <div class="stars stars--4">
       <div class="stars__star"></div>
       <div class="stars__star"></div>
       <div class="stars__star"></div>
@@ -62,11 +62,11 @@
       <p class="cost__price">$2,199</p>
     </div>
 
-    <div
+    <button
       class="button"
       data-qa="hover"
     >
-      <button class="button__link">BUY</button>
-    </div>
+      BUY
+    </button>
   </body>
 </html>
diff --git a/src/styles/blocks/button.scss b/src/styles/blocks/button.scss
index f3585a8ffd..15a2b356c8 100644
--- a/src/styles/blocks/button.scss
+++ b/src/styles/blocks/button.scss
@@ -2,24 +2,22 @@
   margin-left: $retreat-margin-left;
   margin-top: 16px;
 
-  &__link {
-    width: $tablet-min-width;
-    height: 40px;
-    background-color: $main-butter-color;
-    border: 1px solid $main-butter-color;
-    border-radius: 5px;
-    cursor: pointer;
+  width: $tablet-min-width;
+  height: 40px;
+  background-color: $main-butter-color;
+  border: 1px solid $main-butter-color;
+  border-radius: 5px;
+  cursor: pointer;
 
-    font-size: 14px;
-    font-weight: 700;
-    line-height: 16px;
-    text-align: center;
-    color: white;
+  font-size: 14px;
+  font-weight: 700;
+  line-height: 16px;
+  text-align: center;
+  color: white;
 
-    &:hover {
-      background-color: white;
-      color: $main-butter-color;
-      border: 1px solid $main-butter-color;
-    }
+  &:hover {
+    background-color: white;
+    color: $main-butter-color;
+    border: 1px solid $main-butter-color;
   }
 }
diff --git a/src/styles/blocks/card.scss b/src/styles/blocks/card.scss
index 7b78b145bf..24c8d39368 100644
--- a/src/styles/blocks/card.scss
+++ b/src/styles/blocks/card.scss
@@ -11,25 +11,25 @@
 
   &__text {
     margin-left: $retreat-margin-left;
-  }
 
-  &__text--name {
-    margin: 0;
-    padding-bottom: 4px;
-    padding-top: 35px;
-    font-size: 12px;
-    width: $tablet-min-width;
-    height: 36px;
-    font-weight: 500;
-    line-height: 18px;
-  }
+    &--name {
+      margin: 0;
+      padding-bottom: 4px;
+      padding-top: 35px;
+      font-size: 12px;
+      width: $tablet-min-width;
+      height: 36px;
+      font-weight: 500;
+      line-height: 18px;
+    }
 
-  &__text--description {
-    margin: 0;
-    font-size: 10px;
-    color: #616070;
-    height: 14px;
-    font-weight: 400;
-    line-height: 14px;
+    &--description {
+      margin: 0;
+      font-size: 10px;
+      color: #616070;
+      height: 14px;
+      font-weight: 400;
+      line-height: 14px;
+    }
   }
 }
diff --git a/src/styles/blocks/stars.scss b/src/styles/blocks/stars.scss
index 7178344cb4..c5724df8d6 100644
--- a/src/styles/blocks/stars.scss
+++ b/src/styles/blocks/stars.scss
@@ -12,7 +12,7 @@
     padding-right: 4px;
   }
 
-  &__star:nth-child(-n + 4) {
+  &--4 &__star:nth-child(-n + 4) {
     background-image: url(../images/star-active.svg);
   }