feat: add style in challenge#2

ferikand · ferikand · commit 400dee5751bb · 2022-07-16T00:11:07.000+03:00
diff --git a/starter/02-HTML-Fundamentals/challange#2.html b/starter/02-HTML-Fundamentals/challange#2.html
@@ -5,30 +5,31 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Challenge #2</title>
+    <link rel="stylesheet" href="style.css" />
   </head>
   <body>
     <article>
-      <h2>Converse Chuck Taylor All Star Low Top</h2>
+      <h2 class="product-title">Converse Chuck Taylor All Star Low Top</h2>
       <img
         src="https://i.ibb.co/Jr7Wh1d/challenges.jpg"
         alt="Chuck Taylor All Star Shoe"
         height="250"
         width="250"
       />
-      <p><strong>$65.00</strong></p>
-      <p>Free shipping</p>
+      <p class="price"><strong>$65.00</strong></p>
+      <p class="shipping">Free shipping</p>
       <p>
         Ready to dress up or down, these classic canvas Chucksare an everyday
         wardrobe staple
       </p>
-      <a href="#">More information &rarr;</a>
-      <h3>Product details</h3>
-      <ul>
+      <a class="more-info" href="#">More information &rarr;</a>
+      <h3 class="product-details">Product details</h3>
+      <ul class="details-list">
         <li>Lightweight, durable canvas sneaker</li>
         <li>Lightly padded footbed for added comfort</li>
         <li>Iconic Chuck Tailor ankle patch</li>
       </ul>
-      <button>Add to cart</button>
+      <button class="add-cart">Add to cart</button>
     </article>
   </body>
 </html>
diff --git a/starter/02-HTML-Fundamentals/style.css b/starter/02-HTML-Fundamentals/style.css
@@ -0,0 +1,50 @@
+body {
+  border: 5px solid black;
+  font-family: sans-serif;
+}
+
+.product-title {
+  text-align: center;
+  font-size: 22px;
+  text-transform: uppercase;
+  background-color: #f7f7f7;
+}
+
+.price {
+  font-size: 24px;
+}
+
+.shipping {
+  font-size: 12px;
+  text-transform: uppercase;
+  font-weight: bold;
+  color: #777;
+}
+
+.more-info:link,
+.more-info:visited {
+  color: black;
+}
+
+.product-details {
+  text-transform: uppercase;
+  font-size: 16px;
+}
+
+.details-list li {
+  list-style: square;
+}
+
+.add-cart {
+  background-color: #000;
+  border: none;
+  color: #fff;
+  font-size: 20px;
+  text-transform: uppercase;
+  cursor: pointer;
+}
+
+.add-cart:hover {
+  color: #000;
+  background-color: #fff;
+}
diff --git a/starter/03-CSS-Fundamentals/style.css b/starter/03-CSS-Fundamentals/style.css
@@ -98,7 +98,7 @@ li:last-child {
 }
 
 li:nth-child(2) {
-  /* color: red; */
+  color: red;
 }
 
 a:link {

Original file line number	Diff line number	Diff line change
`@@ -98,7 +98,7 @@ li:last-child {`
`98`	`98`	`}`
`99`	`99`
`100`	`100`	`li:nth-child(2) {`
`101`		`- /* color: red; */`
	`101`	`+ color: red;`
`102`	`102`	`}`
`103`	`103`
`104`	`104`	`a:link {`