Add LessionItem (swipe)

src/components/AnatomyCard.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import { View, Text } from 'react-native';
-//import CategoryItem from './CategoryItem';
 
 const AnatomyCard = ({title, text}) => {
   const { defaultStyle, titleStyle, textStyle } = styles;

src/components/LessonItem.js

@@ -0,0 +1,60 @@
+import React from 'react';
+import { View, Text, Image } from 'react-native';
+import Swiper from 'react-native-deck-swiper';
+
+const renderCard = (card) => {
+  return (
+    <View style={styles.card}>
+      <Image
+        style={{width: 120, height: 120, borderRadius: 60}}
+        source={card.image}
+      />
+      <Text style={styles.text}>{card.text}</Text>
+    </View>
+  )
+}
+
+const LessonItem = ({cards}) => {
+  const {defaultStyle} = styles;
+
+  return (
+    <View style={defaultStyle}>
+      <Swiper
+        backgroundColor='#7270a8'
+        cards={cards}
+        renderCard={renderCard}
+        disableBottomSwipe={true}
+        disableTopSwipe={true}
+        disableRightSwipe={true}
+      >
+      </Swiper>
+    </View>
+  );
+};
+
+const styles = {
+  defaultStyle: {
+    flexDirection: 'column',
+    justifyContent: 'center',
+    backgroundColor: '#7270a8',
+    flex: 1
+  },
+  card: {
+    flex: 1,
+    borderRadius: 10,
+    borderWidth: 2,
+    borderColor: '#E8E8E8',
+    justifyContent: 'center',
+    backgroundColor: 'white',
+    alignItems: 'center'
+  },
+  text: {
+    margin: 20,
+    color: 'black',
+    textAlign: 'justify',
+    fontSize: 14,
+    lineHeight: 18
+  },
+};
+
+export default LessonItem;