coditech · moussakaram · Aug 22, 2023 · Aug 23, 2023 · Aug 23, 2023 · Aug 23, 2023
diff --git a/package-lock.json b/package-lock.json
diff --git a/week-1/1-parent-child/index.html b/week-1/1-parent-child/index.html
@@ -27,6 +27,7 @@
           <p class="message__content">
             I can meet on Tuesday and Wednesday after 4.
           </p>
+          <span class="message__time">7:15pm</span>
         </div>
       </div>
     </div>

diff --git a/week-1/2-html-attributes/index.html b/week-1/2-html-attributes/index.html
@@ -23,14 +23,15 @@
         <div class="message">
           <div class="message__author">Luke</div>
           <p class="message__content">
-            Let's meet at the iCafe in Merchant City. https://goo.gl/maps/aza4h9nUBhn
+            Let's meet at the <a href="https://goo.gl/maps/aza4h9nUBhn">iCafe</a> in Merchant City.
           </p>
           <span class="message__time">7:35pm</span>
         </div>
         <div class="message">
           <div class="message__author">Won</div>
           <p class="message__content">
-            Ok! https://media.giphy.com/media/l41K4KlVE8dgozf8I/giphy.gif
+            Ok!<br />
+            <img src="https://media.giphy.com/media/l41K4KlVE8dgozf8I/giphy.gif" />
           </p>
           <span class="message__time">7:38pm</span>
         </div>

diff --git a/week-1/3-semantic-html/index.html b/week-1/3-semantic-html/index.html
@@ -12,30 +12,31 @@
 
   <body>
     <div class="site-wrapper">
-      <div class="site-header">
+      <header role="banner" class="site-header">
         <div class="site-header__title">Messages</div>
-      </div>
-      <div class="messages">
-        <div class="message">
+      </header>
+
+      <main role="main" class="messages">
+        <article class="message">
           <div class="message__author">Won</div>
           <p class="message__content">Where should we meet later?</p>
-          <span class="message__time">Mar 25, 2018 7:25pm</span>
-        </div>
-        <div class="message">
+          <time class="message__time" datetime="2018-03-25 19:25">Mar 25, 2018 7:25pm</time>
+        </article>
+        <article class="message">
           <div class="message__author">Luke</div>
           <p class="message__content">
             Let's meet at the iCafe in Merchant City. https://goo.gl/maps/aza4h9nUBhn
           </p>
-          <span class="message__time">Mar 25, 2018 7:35pm</span>
-        </div>
-        <div class="message">
+          <time class="message__time" datetime="2018-03-25 19:35">Mar 25, 2018 7:35pm</time>
+        </article>
+        <article class="message">
           <div class="message__author">Won</div>
           <p class="message__content">
             Ok! https://media.giphy.com/media/l41K4KlVE8dgozf8I/giphy.gif
           </p>
-          <span class="message__time">Mar 25, 2018 7:38pm</span>
-        </div>
-      </div>
+          <time class="message__time" datetime="2018-03-25 19:38">Mar 25, 2018 7:38pm</time>
+        </article>
+      </main>
       <div id="result" class="result"></div>
     </div>
     <script defer src="/js/3-result.js"></script>

diff --git a/week-1/4-links-scripts/index.html b/week-1/4-links-scripts/index.html
@@ -4,6 +4,7 @@
     <meta charset="utf-8" />
     <title>4. Adding Links and Scripts - HTML, CSS and Git Exercises</title>
     <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="stylesheet" type="text/css" href="css/missing-styles.css" />
   </head>
 
   <body>
@@ -29,9 +30,10 @@
           <p class="message__content">
             No, I prefer the one on Sauchiehall Street. https://goo.gl/maps/wKDoARcHDp42
           </p>
-          <time class="message__time">7:38pm</time>
+          <time class="message__time">7:38pm </time>
         </div>
       </div>
     </div>
+    <script type="text/javascript" src="js/convertUrls.js"></script>
   </body>
 </html>
diff --git a/week-1/5-css-selectors/message-backgrounds.css b/week-1/5-css-selectors/message-backgrounds.css
@@ -1 +1,10 @@
 /* Add your CSS code below */
+#first-message {
+  background-color: red;
+}
+.message__author {
+  background-color: cadetblue;
+}
+.message--latest {
+  background-color: yellow;
+}
diff --git a/week-1/6-css-properties/index.html b/week-1/6-css-properties/index.html
@@ -24,6 +24,8 @@
           <time class="message__time message__time--old">Yesterday, 7:25pm</time>
         </div>
         <div class="message">
+          Make the links in the messagesMake the links in the messages red and bold, and remove the
+          und red and bold, and remove the und
           <div class="message__author">Luke</div>
           <p class="message__content">
             Let's meet at the iCafe in Merchant City.

diff --git a/week-1/6-css-properties/readme.md b/week-1/6-css-properties/readme.md
@@ -3,7 +3,7 @@
 There are many CSS properties you can use to change how your website looks. Add rules to the `styles.css` file to complete the steps below. _Do not edit the `index.html` file._
 
 1. Make the links in the messages red and bold, and remove the underline.
-2. Increase the font size of the message times to `0.9rem`.
+2. Inont sicrease the fze of the message times to `0.9rem`.
 3. Put a blue border on the left side of the last message to show it is unread.
 4. Make yesterday's message partially transparent to show it is old.
 5. Increase the space between each line in a message.

diff --git a/week-1/6-css-properties/styles.css b/week-1/6-css-properties/styles.css
@@ -1 +1,16 @@
 /* Add your CSS code below */
+a {
+  color: red;
+  font-weight: bold;
+  text-decoration: none;
+}
+.message__time {
+  font-size: 0.9rem;
+  border-left-color: blue;
+}
+.message__time--old {
+  opacity: 0.2;
+}
+.message {
+  text-indent: 20px;
+}
diff --git a/week-1/7-css-box/styles.css b/week-1/7-css-box/styles.css
@@ -3,4 +3,13 @@
   border: 1px solid #4491db;
   border-radius: 4px;
   background: #fff;
+  width: 50%;
+  height: 50%;
+  margin: 20 px;
+  padding: 20 px;
+}
+.countries {
+  border: 1px solid red;
+  margin: 5pxpx;
+  padding: 10px;
 }
diff --git a/week-1/8-advanced-selectors/styles.css b/week-1/8-advanced-selectors/styles.css
@@ -1 +1,20 @@
 /* Try different box model properties below */
+.site-header > p {
+  color: white;
+}
+
+.site-header > p {
+  margin-bottom: 0;
+}
+
+.site-header > p {
+  color: white;
+  margin-bottom: 0;
+}
+.site-footer > p {
+  font-size: 12px;
+  text-align: center;
+}
+.messages > .message:last-child {
+  box-shadow: 4px 4px 0 #dba944;
+}
diff --git a/week-2/10-media-queries/columns.css b/week-2/10-media-queries/columns.css
@@ -1 +1,11 @@
 /* Add your own CSS code below */
+@media (min-width: 768px) {
+  .countries {
+    column-count: 2;
+  }
+}
+@media (min-width: 1200px) {
+  .countries {
+    column-count: 3;
+  }
+}
diff --git a/week-2/11-flexbox/flexbox.css b/week-2/11-flexbox/flexbox.css
@@ -1 +1,16 @@
 /* Add your own CSS code below */
+.countries {
+  display: flex;
+  flex-direction: row-reverse;
+}
+.countries--first {
+  flex-direction: row-reverse;
+}
+
+.countries--second {
+  flex-direction: column;
+}
+
+.countries--third {
+  flex-direction: column-reverse;
+}
diff --git a/week-2/12-justify-content/flexbox.css b/week-2/12-justify-content/flexbox.css
@@ -7,3 +7,21 @@
 }
 
 /* Add your own CSS code below */
+.countries--first {
+  flex-direction: row;
+  justify-content: flex-end;
+}
+
+.countries--second {
+  flex-direction: row;
+  justify-content: space-evenly;
+}
+
+.countries--third {
+  flex-direction: column;
+  justify-content: flex-end;
+}
+.countries--fourth {
+  flex-direction: column;
+  justify-content: space-evenly;
+}
diff --git a/week-2/13-align-items/flexbox.css b/week-2/13-align-items/flexbox.css
@@ -2,3 +2,22 @@
   display: flex;
 }
 /* Add your own CSS code below */
+
+.countries--first {
+  flex-direction: row;
+  align-items: center;
+}
+
+.countries--second {
+  flex-direction: row-reverse;
+  align-items: end;
+}
+
+.countries--third {
+  flex-direction: column;
+  align-items: flex-end;
+}
+.countries--fourth {
+  flex-direction: column-reverse;
+  align-items: center;
+}
diff --git a/week-2/14-order/flexbox.css b/week-2/14-order/flexbox.css
@@ -3,3 +3,28 @@
 }
 
 /* Add your own CSS code below */
+.countries--first .country--brazil {
+  order: 5;
+}
+
+.countries--second .country--brazil {
+  order: 4;
+}
+.countries--second .country--uganda {
+  order: 5;
+}
+.countries--third .country--uganda {
+  order: 1;
+}
+.countries--third .country--laos {
+  order: 2;
+}
+.countries--third .country--croatia {
+  order: 4;
+}
+.countries--third .country--brazil {
+  order: 5;
+}
+.countries--third .country--ethiopia {
+  order: 3;
+}
diff --git a/week-2/15-align-self/flexbox.css b/week-2/15-align-self/flexbox.css
@@ -3,3 +3,31 @@
 }
 
 /* Add your own CSS code below */
+.countries--first .country--ethiopia {
+  align-self: flex-end;
+}
+.countries--second .country {
+  align-items: center;
+  align-self: center;
+}
+.countries--second .country--ethiopia {
+  align-self: flex-end;
+}
+.countries--third .country {
+  align-self: end;
+}
+.countries--third .country--brazil {
+  align-self: flex-start;
+}
+.countries--third .country--uganda {
+  align-self: flex-start;
+}
+
+.countries--fourth {
+  flex-direction: column;
+
+  align-items: start;
+}
+.countries--fourth .country--uganda {
+  align-self: center;
+}
diff --git a/week-2/16-more-flexbox/flexbox.css b/week-2/16-more-flexbox/flexbox.css
@@ -3,3 +3,44 @@
 }
 
 /* Add your own CSS code below */
+
+.countries--first {
+  justify-content: flex-end;
+  align-items: end;
+}
+.countries--second {
+  justify-content: center;
+  align-items: end;
+  flex-direction: row-reverse;
+}
+.countries--third {
+  justify-content: center;
+  align-items: self-start;
+}
+.countries--third .country--brazil {
+  align-self: flex-end;
+}
+
+.countries--fourth {
+  justify-content: center;
+  align-items: flex-end;
+  flex-direction: column;
+}
+.countries--fourth .country--laos,
+.countries--fourth .country--ethiopia {
+  align-self: center;
+}
+.countries--fifth {
+  justify-content: space-around;
+  align-items: flex-end;
+  flex-direction: column-reverse;
+}
+
+.countries--fifth .country--uganda {
+  order: 4;
+  align-self: center;
+}
+
+.countries--fifth .country--laos {
+  order: 5;
+}
diff --git a/week-2/17-nav-menu/styles.css b/week-2/17-nav-menu/styles.css
@@ -1 +1,36 @@
 /* Write your media queries and flexbox CSS below */
+@media (min-width: 480px) {
+  .site-header__nav {
+    display: flex;
+    flex-direction: row;
+  }
+}
+@media (min-width: 700px) {
+  .site-wrapper .site-header__logo,
+  .site-header .site-header__nav,
+  .site-header .site-header__checkout {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+}
+
+@media (min-width: 992px) {
+  .site-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+  .site-header__logo {
+    order: 1;
+  }
+  .site-header__nav {
+    order: 2;
+    flex-grow: 2;
+    display: flex;
+    justify-content: center;
+  }
+  .site-header__checkout {
+    order: 3;
+  }
+}
diff --git a/week-3/19-search/index.html b/week-3/19-search/index.html
@@ -11,7 +11,9 @@
   <body>
     <div class="site-wrapper">
       <main>
-        <p>Delete this line and add your form.</p>
+        <form method="GET" action="https://www.google.com/search">
+          <input type="text" name="q" />
+        </form>
       </main>
     </div>
   </body>
-Original file line number
+Diff line change
@@ Expand Up / @@ -27,6 +27,7 @@ @@
               <p class="message__content">
                 I can meet on Tuesday and Wednesday after 4.
               </p>
+              <span class="message__time">7:15pm</span>
             </div>
           </div>
         </div>
@@ Expand Down @@