to check

mate-academy · Jun 18, 2024 · b65407d · b65407d
1 parent 935fc1e
commit b65407d
Show file tree

Hide file tree

Showing 7 changed files with 89 additions and 87 deletions.
diff --git a/src/styles/blocks/card.scss b/src/styles/blocks/card.scss
@@ -1,5 +1,6 @@
 @use '../utils/variables' as *;
 
+
 .card {
   display: flex;
   justify-content: center;
@@ -37,6 +38,13 @@
     min-height: 14px;
   }
 
+  &__reviews {
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    margin-bottom: 24px;
+  }
+
   &__reviews-raiting {
     display: flex;
     align-items: flex-end;

diff --git a/src/styles/blocks/navigation.scss b/src/styles/blocks/navigation.scss
@@ -31,6 +31,9 @@
     line-height: 60px;
     transition: 0.3s;
 
+    &:hover {
+      color: $blue;}
+
     &.is-active {
       color: $blue;
 
@@ -52,4 +55,4 @@
       color: $blue;
     }
   }
-}
+  }
diff --git a/src/styles/blocks/reset.scss b/src/styles/blocks/reset.scss
@@ -18,26 +18,4 @@ body {
   padding: 50px 40px;
 }
 
-@media (max-width: 487px) {
-  .main {
-    grid-template-columns: repeat(1, $column);
-  }
-}
-
-@media (min-width: 488px) and (max-width: 767px) {
-  .main {
-    grid-template-columns: repeat(2, $column);
-  }
-}
 
-@media (min-width: 768px) and (max-width: 1023px) {
-  .main {
-    grid-template-columns: repeat(3, $column);
-  }
-}
-
-@media (min-width: 1024px) {
-  .main {
-    grid-template-columns: repeat(4, $column);
-  }
-}
diff --git a/src/styles/blocks/stars.scss b/src/styles/blocks/stars.scss
@@ -1,10 +1,5 @@
 @use '../utils/variables' as *;
 
-.card__reviews {
-  display: flex;
-  justify-content: space-between;
-  width: 100%;
-  margin-bottom: 24px;
 
   .stars {
     display: flex;
@@ -20,17 +15,14 @@
       margin-right: 4px;
     }
 
-    &__star:nth-child(-n + 4) {
+    &__star:nth-child(-n + 0),
+    &__star:nth-child(-n + 1),
+    &__star:nth-child(-n + 2),
+    &__star:nth-child(-n + 3),
+    &__star:nth-child(-n + 4),
+    &__star:nth-child(-n + 5) {
       background-image: url('../images/star-active.svg');
     }
   }
 
-  .card__reviews-rating {
-    display: flex;
-    align-items: flex-end;
-    font-size: 10px;
-    font-weight: $font-normal;
-    line-height: 14px;
-    color: $dark-blue;
-  }
-}
+
diff --git a/src/styles/main.css b/src/styles/main.css
diff --git a/src/styles/main.css.map b/src/styles/main.css.map
diff --git a/src/styles/main.scss b/src/styles/main.scss
@@ -3,5 +3,30 @@
 @use './blocks/reset.scss';
 @use './blocks/navigation.scss';
 @use './blocks/header.scss';
+@use './utils/variables' as *;
+
+@media (max-width: 487px) {
+  .main {
+    grid-template-columns: repeat(1, $column);
+  }
+}
+
+@media (min-width: 488px) and (max-width: 767px) {
+  .main {
+    grid-template-columns: repeat(2, $column);
+  }
+}
+
+@media (min-width: 768px) and (max-width: 1023px) {
+  .main {
+    grid-template-columns: repeat(3, $column);
+  }
+}
+
+@media (min-width: 1024px) {
+  .main {
+    grid-template-columns: repeat(4, $column);
+  }
+}
 
 /*# sourceMappingURL=index.css.map */