chore(i18n,learn): processed translations

curriculum/challenges/swahili/01-responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed.md

@@ -22,49 +22,66 @@ Add the CSS property `display: flex` to all of the following items - note that t
 Your `.follow-btn` should be rendered on the page. Be sure to turn off any extensions such as ad blockers.
 
 ```js
-assert($('.follow-btn').length > 0 && $('.follow-btn').css('display') !== 'none');
+const followButton = document.querySelector('.follow-btn');
+const displayStyle = window.getComputedStyle(followButton)['display'];
+assert.isNotNull(followButton);
+assert.notStrictEqual(displayStyle, 'none');
 ```
 
 Your `header` should have a `display` property set to `flex`.
 
 ```js
-assert($('header').css('display') == 'flex');
+const header = document.querySelector('header');
+const displayStyle = window.getComputedStyle(header)['display'];
+assert.strictEqual(displayStyle, 'flex');
 ```
 
 Your `footer` should have a `display` property set to `flex`.
 
 ```js
-assert($('footer').css('display') == 'flex');
+const footer = document.querySelector('footer');
+const displayStyle = window.getComputedStyle(footer)['display'];
+assert.strictEqual(displayStyle, 'flex');
 ```
 
 Your `h3` should have a `display` property set to `flex`.
 
 ```js
-assert($('h3').css('display') == 'flex');
+const h3Element = document.querySelector('h3');
+const displayStyle = window.getComputedStyle(h3Element)['display'];
+assert.strictEqual(displayStyle, 'flex');
 ```
 
 Your `h4` should have a `display` property set to `flex`.
 
 ```js
-assert($('h4').css('display') == 'flex');
+const h4Element = document.querySelector('h4');
+const displayStyle = window.getComputedStyle(h4Element)['display'];
+assert.strictEqual(displayStyle, 'flex');
 ```
 
 Your `.profile-name` should have a `display` property set to `flex`.
 
 ```js
-assert($('.profile-name').css('display') == 'flex');
+const profileName = document.querySelector('.profile-name');
+const displayStyle = window.getComputedStyle(profileName)['display'];
+assert.strictEqual(displayStyle, 'flex');
 ```
 
 Your `.follow-btn` should have a `display` property set to `flex`.
 
 ```js
-assert($('.follow-btn').css('display') == 'flex');
+const followButton = document.querySelector('.follow-btn');
+const displayStyle = window.getComputedStyle(followButton)['display'];
+assert.strictEqual(displayStyle, 'flex');
 ```
 
 Your `.stats` should have a `display` property set to `flex`.
 
 ```js
-assert($('.stats').css('display') == 'flex');
+const stats = document.querySelector('.stats');
+const displayStyle = window.getComputedStyle(stats)['display'];
+assert.strictEqual(displayStyle, 'flex');
 ```
 
 # --seed--
@@ -142,18 +159,17 @@ assert($('.stats').css('display') == 'flex');
   </div>
 </header>
 <div id="inner">
-  <p>I meet so many people who are in search of that one trick that will help them work smart. Even if you work smart, you still have to work hard.</p>
+  <p>
+    I meet so many people who are in search of that one trick that will help
+    them work smart. Even if you work smart, you still have to work hard.
+  </p>
   <span class="date">1:32 PM - 12 Jan 2018</span>
-  <hr>
+  <hr />
 </div>
 <footer>
   <div class="stats">
-    <div class="Retweets">
-      <strong>107</strong> Retweets
-    </div>
-    <div class="likes">
-      <strong>431</strong> Likes
-    </div>
+    <div class="Retweets"><strong>107</strong> Retweets</div>
+    <div class="likes"><strong>431</strong> Likes</div>
   </div>
   <div class="cta">
     <button class="share-btn">Share</button>
@@ -171,7 +187,7 @@ assert($('.stats').css('display') == 'flex');
     font-family: Arial, sans-serif;
   }
   header {
-   display: flex;
+    display: flex;
   }
   header .profile-thumbnail {
     width: 50px;
@@ -191,7 +207,8 @@ assert($('.stats').css('display') == 'flex');
     border-radius: 3px;
     padding: 5px;
   }
-  header h3, header h4 {
+  header h3,
+  header h4 {
     display: flex;
     margin: 0;
   }
@@ -226,7 +243,11 @@ assert($('.stats').css('display') == 'flex');
   }
 </style>
 <header>
-  <img src="https://cdn.freecodecamp.org/curriculum/legacy-css-flexbox/quincy-twitter-photo.jpg" alt="Quincy Larson's profile picture" class="profile-thumbnail">
+  <img
+    src="https://cdn.freecodecamp.org/curriculum/legacy-css-flexbox/quincy-twitter-photo.jpg"
+    alt="Quincy Larson's profile picture"
+    class="profile-thumbnail"
+  />
   <div class="profile-name">
     <h3>Quincy Larson</h3>
     <h4>@ossia</h4>
@@ -236,18 +257,17 @@ assert($('.stats').css('display') == 'flex');
   </div>
 </header>
 <div id="inner">
-  <p>I meet so many people who are in search of that one trick that will help them work smart. Even if you work smart, you still have to work hard.</p>
+  <p>
+    I meet so many people who are in search of that one trick that will help
+    them work smart. Even if you work smart, you still have to work hard.
+  </p>
   <span class="date">1:32 PM - 12 Jan 2018</span>
-  <hr>
+  <hr />
 </div>
 <footer>
   <div class="stats">
-    <div class="Retweets">
-      <strong>107</strong> Retweets
-    </div>
-    <div class="likes">
-      <strong>431</strong> Likes
-    </div>
+    <div class="Retweets"><strong>107</strong> Retweets</div>
+    <div class="likes"><strong>431</strong> Likes</div>
   </div>
   <div class="cta">
     <button class="share-btn">Share</button>

curriculum/challenges/swahili/01-responsive-web-design/css-flexbox/align-elements-using-the-align-items-property.md

@@ -31,7 +31,9 @@ Try the other options for the `align-items` property in the code editor to see t
 The `#box-container` element should have an `align-items` property set to a value of `center`.
 
 ```js
-assert($('#box-container').css('align-items') == 'center');
+const boxContainer = document.querySelector('#box-container');
+const alignment = window.getComputedStyle(boxContainer)['align-items'];
+assert.strictEqual(alignment, 'center');
 ```
 
 # --seed--

curriculum/challenges/swahili/01-responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property.md

@@ -31,7 +31,10 @@ Try the other options for the `justify-content` property in the code editor to s
 The `#box-container` element should have a `justify-content` property set to a value of `center`.
 
 ```js
-assert($('#box-container').css('justify-content') == 'center');
+const boxContainer = document.querySelector('#box-container');
+const justifyDirection =
+  window.getComputedStyle(boxContainer)['justify-content'];
+assert.strictEqual(justifyDirection, 'center');
 ```
 
 # --seed--

curriculum/challenges/swahili/01-responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed.md

@@ -20,13 +20,18 @@ Add the CSS property `flex-direction` to the header's `.profile-name` element an
 `.follow-btn` yako inapaswa kutolewa kwenye ukurasa. Hakikisha umezima viendelezi vyovyote kama vile vizuizi vya matangazo.
 
 ```js
-assert($('.follow-btn').length > 0 && $('.follow-btn').css('display') !== 'none');
+const followButton = document.querySelector('.follow-btn');
+const displayStyle = window.getComputedStyle(followButton)['display'];
+assert.isNotNull(followButton);
+assert.notStrictEqual(displayStyle, 'none');
 ```
 
 The `.profile-name` element should have a `flex-direction` property set to `column`.
 
 ```js
-assert($('.profile-name').css('flex-direction') == 'column');
+const profileName = document.querySelector('.profile-name');
+const flexDirection = window.getComputedStyle(profileName)['flex-direction'];
+assert.strictEqual(flexDirection, 'column');
 ```
 
 # --seed--
@@ -38,7 +43,8 @@ assert($('.profile-name').css('flex-direction') == 'column');
   body {
     font-family: Arial, sans-serif;
   }
-  header, footer {
+  header,
+  footer {
     display: flex;
     flex-direction: row;
   }
@@ -61,7 +67,8 @@ assert($('.profile-name').css('flex-direction') == 'column');
     border-radius: 3px;
     padding: 5px;
   }
-  header h3, header h4 {
+  header h3,
+  header h4 {
     display: flex;
     margin: 0;
   }
@@ -93,7 +100,11 @@ assert($('.profile-name').css('flex-direction') == 'column');
   }
 </style>
 <header>
-  <img src="https://cdn.freecodecamp.org/curriculum/legacy-css-flexbox/quincy-twitter-photo.jpg" alt="Quincy Larson's profile picture" class="profile-thumbnail">
+  <img
+    src="https://cdn.freecodecamp.org/curriculum/legacy-css-flexbox/quincy-twitter-photo.jpg"
+    alt="Quincy Larson's profile picture"
+    class="profile-thumbnail"
+  />
   <div class="profile-name">
     <h3>Quincy Larson</h3>
     <h4>@ossia</h4>
@@ -103,18 +114,17 @@ assert($('.profile-name').css('flex-direction') == 'column');
   </div>
 </header>
 <div id="inner">
-  <p>I meet so many people who are in search of that one trick that will help them work smart. Even if you work smart, you still have to work hard.</p>
+  <p>
+    I meet so many people who are in search of that one trick that will help
+    them work smart. Even if you work smart, you still have to work hard.
+  </p>
   <span class="date">1:32 PM - 12 Jan 2018</span>
-  <hr>
+  <hr />
 </div>
 <footer>
   <div class="stats">
-    <div class="Retweets">
-      <strong>107</strong> Retweets
-    </div>
-    <div class="likes">
-      <strong>431</strong> Likes
-    </div>
+    <div class="Retweets"><strong>107</strong> Retweets</div>
+    <div class="likes"><strong>431</strong> Likes</div>
   </div>
   <div class="cta">
     <button class="share-btn">Share</button>
@@ -131,7 +141,8 @@ assert($('.profile-name').css('flex-direction') == 'column');
   body {
     font-family: Arial, sans-serif;
   }
-  header, footer {
+  header,
+  footer {
     display: flex;
     flex-direction: row;
   }
@@ -154,7 +165,8 @@ assert($('.profile-name').css('flex-direction') == 'column');
     border-radius: 3px;
     padding: 5px;
   }
-  header h3, header h4 {
+  header h3,
+  header h4 {
     display: flex;
     margin: 0;
   }
@@ -186,7 +198,11 @@ assert($('.profile-name').css('flex-direction') == 'column');
   }
 </style>
 <header>
-  <img src="https://cdn.freecodecamp.org/curriculum/legacy-css-flexbox/quincy-twitter-photo.jpg" alt="Quincy Larson's profile picture" class="profile-thumbnail">
+  <img
+    src="https://cdn.freecodecamp.org/curriculum/legacy-css-flexbox/quincy-twitter-photo.jpg"
+    alt="Quincy Larson's profile picture"
+    class="profile-thumbnail"
+  />
   <div class="profile-name">
     <h3>Quincy Larson</h3>
     <h4>@ossia</h4>
@@ -196,18 +212,17 @@ assert($('.profile-name').css('flex-direction') == 'column');
   </div>
 </header>
 <div id="inner">
-  <p>I meet so many people who are in search of that one trick that will help them work smart. Even if you work smart, you still have to work hard.</p>
+  <p>
+    I meet so many people who are in search of that one trick that will help
+    them work smart. Even if you work smart, you still have to work hard.
+  </p>
   <span class="date">1:32 PM - 12 Jan 2018</span>
-  <hr>
+  <hr />
 </div>
 <footer>
   <div class="stats">
-    <div class="Retweets">
-      <strong>107</strong> Retweets
-    </div>
-    <div class="likes">
-      <strong>431</strong> Likes
-    </div>
+    <div class="Retweets"><strong>107</strong> Retweets</div>
+    <div class="likes"><strong>431</strong> Likes</div>
   </div>
   <div class="cta">
     <button class="share-btn">Share</button>