add task solution #3951

ogchy · 2024-01-06T20:16:29Z

SanyaBratashchuk

check font-sizes, colors, intends through the project

SanyaBratashchuk · 2024-01-07T09:00:27Z

src/index.html

+      <div class="card__description">
+        <h2>APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h2>
+      </div>
+
+      <div class="card__product">
+        <h3>Product code: 195434</h3>
+      </div>


Suggested change

<div class="card__description">

<h2>APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h2>

</div>

<div class="card__product">

<h3>Product code: 195434</h3>

</div>

<h3 "card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3>

<p class="card__product">Product code: 195434</p>

SanyaBratashchuk · 2024-01-07T09:01:43Z

src/index.html

+
+      <div class="stars">
+        <div class="stars__raiting">
+          <img src=".//images/stars.png" alt="stars">


SanyaBratashchuk · 2024-01-07T09:02:34Z

src/index.html

+        <div class="stars__reviews">
+          <h4>Reviews: 5</h4>
+        </div>


Suggested change

<div class="stars__reviews">

<h4>Reviews: 5</h4>

</div>

<p class="card__reviews">Reviews: 5</p>

SanyaBratashchuk · 2024-01-07T09:03:02Z

src/styles/style.css

+.card {
+  background-color: #fff;
+  width: 200px;
+  height: 408px;
+}


add paddings, border for card

SanyaBratashchuk · 2024-01-10T19:55:03Z

src/styles/style.css

+.card {
+  background-color: #fff;
+  width: 200px;
+  height: 408px;


Suggested change

height: 408px;

SanyaBratashchuk · 2024-01-10T19:58:40Z

src/styles/style.css

+  width: 200px;
+  height: 408px;
+  padding: 20px;
+}


Suggested change

}

border-radius: 5px;

border: 1px solid #F3F3F3;

}

SanyaBratashchuk · 2024-01-10T19:59:17Z

src/styles/style.css

+  background-color: #fff;
+  width: 200px;
+  height: 408px;
+  padding: 20px;


Suggested change

padding: 20px;

padding: 32px 19px 16px;

SanyaBratashchuk · 2024-01-10T19:59:36Z

src/styles/style.css

+.card__image {
+  width: 160px;
+  height: 134px;
+  margin: 32px 20px 40px;


Suggested change

margin: 32px 20px 40px;

margin-left: 3px;

SanyaBratashchuk · 2024-01-10T19:59:57Z

src/styles/style.css

+  color: #616070;
+}
+
+.stars {


each BEM block should be in separate file

SanyaBratashchuk · 2024-01-10T20:00:21Z

src/styles/style.css

+.stars--4 .stars__star:nth-child(-n+4) {
+  background-image: url('/src/images/star-active.svg');
+}


reuse styles from previous task with stars

SanyaBratashchuk · 2024-01-10T20:00:52Z

src/styles/style.css

+  margin-left: auto;
+}
+
+.button {


there should be just 2 BEM blocks card and stars so button should be an element of card BEM block

l4st1m0za

Use nesting in the SCSS files
As was told before, check all the fonts, font-sizes and coloures of the borders. Everything should be as in the Figma.

l4st1m0za

These are differences from the first test

And these are from the second test

You need to pay attention to the: font, font-weight, font-size, border-color, width

ogchy · 2024-01-11T20:10:39Z

These are differences from the first test

And these are from the second test

You need to pay attention to the: font, font-weight, font-size, border-color, width

ogchy · 2024-01-11T20:11:12Z

These are differences from the first test

And these are from the second test

You need to pay attention to the: font, font-weight, font-size, border-color, width

ill do it but without button

ogchy · 2024-01-12T19:45:14Z

These are differences from the first test

And these are from the second test

You need to pay attention to the: font, font-weight, font-size, border-color, width

can you check

These are differences from the first test

And these are from the second test

You need to pay attention to the: font, font-weight, font-size, border-color, width

https://ogchy.github.io/layout_product-cards/ can u check this? something wrong with npm test

volodymyr-soltys97

Still not fixed from the previous review, you need to fix the failed test

Also this part of the task is incomplete

volodymyr-soltys97 · 2024-01-12T19:46:43Z

src/index.html

+      <div>
+        <img
+          src=".//images/imac.jpeg"
+          alt="imac"
+          class="card__image"
+        >
+      </div>


This div is redundant

Suggested change

<div>

<img

src=".//images/imac.jpeg"

alt="imac"

class="card__image"

>

</div>

<img

src=".//images/imac.jpeg"

alt="imac"

class="card__image"

>

volodymyr-soltys97 · 2024-01-12T19:47:13Z

src/index.html

+        <button class="card__button">
+          BUY
+        </button>


button is redundant here

Suggested change

<button class="card__button">

BUY

</button>

BUY

volodymyr-soltys97 · 2024-01-12T19:48:00Z

src/index.html

+        <div class="stars stars--4">
+          <div class="stars__star"></div>
+
+          <div class="stars__star"></div>
+
+          <div class="stars__star"></div>
+
+          <div class="stars__star"></div>
+
+          <div class="stars__star"></div>


Suggested change

<div class="stars stars--4">

<div class="stars__star"></div>

<div class="stars__star"></div>

<div class="stars__star"></div>

<div class="stars__star"></div>

<div class="stars__star"></div>

<div class="stars stars--4">

<div class="stars__star"></div>

<div class="stars__star"></div>

<div class="stars__star"></div>

<div class="stars__star"></div>

<div class="stars__star"></div>

volodymyr-soltys97 · 2024-01-12T19:48:10Z

src/index.html

+      <p class="card__product">Product code: 195434</p>
+
+
+      <div class="card__reviews">


Suggested change

<p class="card__product">Product code: 195434</p>

<div class="card__reviews">

<p class="card__product">Product code: 195434</p>

<div class="card__reviews">

volodymyr-soltys97 · 2024-01-12T19:48:36Z

src/styles/card.scss

+    font-style: normal;
+    font-weight: 400;


Default value, so you can just remove it everywhere

Suggested change

font-style: normal;

font-weight: 400;

volodymyr-soltys97 · 2024-01-12T19:48:49Z

src/styles/card.scss

+  }
+
+  &__button:hover {
+    color: #00ACDC;


Create a variable for repeated color

SanyaBratashchuk suggested changes Jan 7, 2024

View reviewed changes

ogchy requested a review from SanyaBratashchuk January 10, 2024 19:41

SanyaBratashchuk suggested changes Jan 10, 2024

View reviewed changes

ogchy requested a review from SanyaBratashchuk January 11, 2024 19:03

l4st1m0za suggested changes Jan 11, 2024

View reviewed changes

ogchy requested a review from l4st1m0za January 11, 2024 19:41

l4st1m0za suggested changes Jan 11, 2024

View reviewed changes

ogchy requested a review from l4st1m0za January 12, 2024 19:44

volodymyr-soltys97 suggested changes Jan 12, 2024

View reviewed changes

ogchy closed this Jan 25, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

add task solution #3951

add task solution #3951

ogchy commented Jan 6, 2024

SanyaBratashchuk left a comment

SanyaBratashchuk Jan 7, 2024

SanyaBratashchuk Jan 7, 2024

SanyaBratashchuk Jan 7, 2024

SanyaBratashchuk Jan 7, 2024

SanyaBratashchuk Jan 10, 2024

SanyaBratashchuk Jan 10, 2024

SanyaBratashchuk Jan 10, 2024

SanyaBratashchuk Jan 10, 2024

SanyaBratashchuk Jan 10, 2024

SanyaBratashchuk Jan 10, 2024

SanyaBratashchuk Jan 10, 2024

l4st1m0za left a comment

l4st1m0za left a comment

ogchy commented Jan 11, 2024

ogchy commented Jan 11, 2024

ogchy commented Jan 12, 2024

volodymyr-soltys97 left a comment

volodymyr-soltys97 Jan 12, 2024

volodymyr-soltys97 Jan 12, 2024

volodymyr-soltys97 Jan 12, 2024

volodymyr-soltys97 Jan 12, 2024

volodymyr-soltys97 Jan 12, 2024

volodymyr-soltys97 Jan 12, 2024

-}
+  border-radius: 5px;
+  border: 1px solid #F3F3F3;
+}

		<p class="card__product">Product code: 195434</p>


		<div class="card__reviews">

add task solution #3951

add task solution #3951

Conversation

ogchy commented Jan 6, 2024

SanyaBratashchuk left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

l4st1m0za left a comment

Choose a reason for hiding this comment

l4st1m0za left a comment

Choose a reason for hiding this comment

ogchy commented Jan 11, 2024

ogchy commented Jan 11, 2024

ogchy commented Jan 12, 2024

volodymyr-soltys97 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment