feat(what-will-learn): add typescript and responsive layout

chornos13 · Feb 9, 2021 · a8266ed · a8266ed
1 parent 8123993
commit a8266ed
Showing 1 changed file with 12 additions and 3 deletions.
diff --git a/src/views/Home/partials/WhatWillLearn.tsx b/src/views/Home/partials/WhatWillLearn.tsx
@@ -28,6 +28,15 @@ const dataLearnItems: LearnItemProps[] = [
       'you need for production: hybrid static & server rendering, TypeScript support, ' +
       'smart bundling, route pre-fetching, and more. No config needed.',
   },
+  {
+    urlTitleIcon:
+      'https://www.typescriptlang.org/favicon-32x32.png?v=8944a05a8b601855de116c8a56d3b3ae',
+    title: 'TypeScript',
+    urlDocumentation: 'https://www.typescriptlang.org/',
+    children:
+      'Typed JavaScript at Any Scale. TypeScript extends JavaScript by adding types. ' +
+      'By understanding JavaScript, TypeScript saves you time catching errors and providing fixes before you run code',
+  },
   {
     urlTitleIcon:
       'https://gw.alipayobjects.com/zos/rmsportal/rlpTLlbMzTNYuZGGCVYM.png',
@@ -160,13 +169,13 @@ function WhatWillLearn() {
         <Title size={30}>What will you learn?</Title>
       </Col>
       <Col xs={24}>
-        <Row gutter={[20, 20]}>
+        <Row gutter={[20, 20]} justify={'center'}>
           <Col xs={24}>
             <Title noMargin>Library</Title>
           </Col>
-          {dataLearnItems.map((learnItem, key) => {
+          {dataLearnItems.map((learnItem, index) => {
             return (
-              <Col xs={12} key={key}>
+              <Col xs={24} md={12} key={index}>
                 <LearnItem {...learnItem} />
               </Col>
             )