Correction of errors encounted when importing components

src/components/BarChart/BarChart.md

@@ -27,7 +27,7 @@ Import the component to `pages/index.js`
     "October",
     "November",
     "December",
-  ]} title="Marks" data={[40, 20, 12, 39, 10, 40, 39, 80, 40, 10, 91, 12, 15, 11]} labelsName: "months" color: "#f87979" />
+  ]} title="Marks" data={[40, 20, 12, 39, 10, 40, 39, 80, 40, 10, 91, 12, 15, 11]} labelsName="months" color= "#f87979" />
 ```
 
 `labels` prop is the labels of x axis of the bar chart

src/components/Breadcrumbs/Breadcrumbs.md

@@ -14,7 +14,7 @@ Import the component to `pages/index.js`
 ## How to handle props to the component
 
 ```
-<BreadcrumbsWrapper elementList=[{ name: "Labs", url: "/" }, { name: "Categories" }] />
+<BreadcrumbsWrapper elementList={ [{ name: "Labs", url: "/" }, { name: "Categories" }] }/>
 ```
 
 `elementList` prop is the list of navigation options. items in the list following this signature

src/components/CardThemeFour/CardThemeFour.md

@@ -14,7 +14,7 @@ Import the component to `pages/index.js`
 ## How to handle props to the component
 
 ```
-<CardThemeFourimage="sample-image" title="sample title="sample-title" description="sample-description" />
+<CardThemeFour image="sample-image" title="sample-title" description="sample-description" />
 ```
 
 `image` prop is used to display the main image of the card

src/components/CardThemeFourGrid/CardThemeFourGrid.md

@@ -15,7 +15,7 @@ Import the component to `pages/index.js`
 
 ```
 <CardThemeFourGrid image="sample-image-path"
-      dataUpperGrid={[{image: "sample", description: "sample", title="sample-title"}]} dataLowerGrid={[{image: "sample", description: "sample", title="sample-title"}]} />
+      dataUpperGrid={[{image: "sample", description: "sample", title:"sample-title"}]} dataLowerGrid={[{image: "sample", description: "sample", title:"sample-title"}]} />
 ```
 
 `image` props is the backgournd image of the section

src/components/CartTile/CartTile.md

@@ -9,12 +9,12 @@ This is a resuasble component for displaying the items in the cart. This Compone
 ## How to use the component
 
 Import the component to `pages/index.js`
-`import {Card} from "../components/CartTile";`
+`import {CartTile} from "../components/CartTile";`
 
 ## How to handle props to the component
 
 ```
-<CartTile image="url of product" name="name of product" price="price of product" qty="Number of items per product" subtractionHandler={function for subtration icon} additionHandler={function for subtration icon} removeHandler={function for delete items}/>
+<CartTile image="url of product" name="name of product" price="price of product" qty="Number of items per product" subtractionHandler={function for subtration icon} additionHandler={function for addition icon} removeHandler={function for delete items}/>
 ```
 
 `image` prop is the url of product

src/components/ClickableInfo/ClickableInfoCard.md

@@ -10,7 +10,7 @@ This is a resuasble component for a generalized card which can be clickable. Thi
 ## How to use the component
 
 Import the component to `pages/index.js`
-`import {ClickableInfoCard} from "../components/ClickableInfoCard";`
+`import {ClickableInfoCard} from "../components/ClickableInfo";`
 
 ## How to handle props to the component
 

src/components/CommunityCards/CommunityCards.md

@@ -9,7 +9,7 @@ This is a resuasble component for displaying community cards. This Component is
 ## How to use the component
 
 Import the component to `pages/index.js`
-`import {ComponentCards} from "../components/ComponentCards";`
+`import {ComponentCards} from "../components/CommunityCards";`
 
 ## How to handle props to the component
 

src/components/DetailCardGrid/DetailCardGrid.md

@@ -14,7 +14,7 @@ Import the component to `pages/index.js`
 ## How to handle props to the component
 
 ```
-<ServicesCardGrid data=[{titleOne="sample-title" , descriptionOne="sample-description}, gridHeading="sample-heading"] />
+<DetailCardGrid data={[{titleOne:"sample-title" , descriptionOne:"sample-description"}]} gridHeading="sample-heading" />
 ```
 `gridHeading` prop is use to add the heading for the cards grid
 `data` prop is use to add the data for the cards 

src/components/DocsBanner/DocsBanner.md

@@ -14,7 +14,7 @@ Import the component to `pages/index.js`
 ## How to handle props to the component
 
 ```
-<DocsBanner header="Frequently Asked Questions" bgColor="color"
+<DocsBanner mainText="sample-heading-text" subText="sample-subtext-para"  header="Frequently Asked Questions" bgColor="color"
      titleColor="color" toggleColor="color"
      data={[{title: "sample-question", content: "sample-answer"}]} />
 ```

src/components/DynamicBanner/DynamicBanner.md

@@ -17,8 +17,8 @@ Import the component to `pages/index.js`
 <DynamicBanner  mainText ="sample-mainText"
   subText = "sample-subText"
   image = "sample-image"
-  description: ="sample-desc"
-  countUpListData = {duration="sample-numneric-value" end="sample-end-value" text="sample-text"}
+  description ="sample-desc"
+  countUpListData = {{duration:"sample-numneric-value" ,end:"sample-end-value" ,text:"sample-text"}
 }/>
 ```
 

src/components/FooterLarge/FooterLarge.md

@@ -21,9 +21,9 @@ Import the component to `pages/index.js`
     headingFour = "sample-headingFour"
     aboutText = "sample-about-text"
     newsletterText = "sample-newsletter-text"
-    linksListData =  {[linkName: "link_name", LinkUrl :"link_Url"],[linkName: "link_name", LinkUrl :"link_Url"]}
-    contactListData ={[Detail:"sample-address", link: "sample-address-link"],[Detail:"sample-phone-number", link: "sample-phone-link"]}
-    socialLinks = {{facebook: "your_link", gitter: "your_link", twitter: "your_link", github: "your_link" linkedin:"your_link", medium:"your_link"}}
+    linksListData =  {[{linkName: "link_name", LinkUrl :"link_Url"},{linkName: "link_name", LinkUrl :"link_Url"}]}
+    contactListData ={[{Detail:"sample-address", link: "sample-address-link"},{Detail:"sample-phone-number", link: "sample-phone-link"}]}
+    socialLinks = {{facebook: "your_link", gitter: "your_link", twitter: "your_link", github: "your_link" , linkedin:"your_link", medium:"your_link"}}
 />
 ```
 

src/components/FooterThemeFive/FooterThemeFive.md

@@ -19,12 +19,12 @@ Import the component to `pages/index.js`
     headingTwo = "sample-headingTwo"
     headingThree = "sample-headingThree"
     aboutText = "sample-aboutText"
-    linksListData =  {[linkName: "link_name", LinkUrl :"link_Url"],[linkName: "link_name", LinkUrl :"link_Url"]}
-    contactListData =  {[ detail: "sample-detail", link: "#"],[detail: "sample-detail",link: "#"]}
-    socialLinks = {{facebook: "your_link", gitter: "your_link", twitter: "your_link", github: "your_link" linkedin:"your_link", medium:"your_link"}}
-    facebookProfile: "facebookaddress",
-    height: "sample-height",
-    width: "sample-width",
+    linksListData =  {[{linkName: "link_name", LinkUrl :"link_Url"},{linkName: "link_name", LinkUrl :"link_Url"}]}
+    contactListData =  {[{ detail: "sample-detail", link: "#"},{detail: "sample-detail",link: "#"}]}
+    socialLinks = {{facebook: "your_link", gitter: "your_link", twitter: "your_link", github: "your_link", linkedin:"your_link", medium:"your_link"}}
+    facebookProfile= "facebookaddress"
+    height= "sample-height"
+    width= "sample-width"
 />
 ```
 

src/components/FooterThemeFour/FooterThemeFour.md

@@ -9,7 +9,7 @@ This is a reusable component for the footer of a website. This Component is high
 ## How to use the component
 
 Import the component to `pages/index.js`
-`import {FooterThemeFour} from "../components/FooterFour";`
+`import {FooterThemeFour} from "../components/FooterThemeFour";`
 
 ## How to handle props to the component
 
@@ -19,8 +19,8 @@ Import the component to `pages/index.js`
     titleTwo = "sample-headingTwo"
     aboutText = "sample-about-text"
     newsletterText = "sample-newsletter-text"
-    usefullListData =  {[linkName: "link_name", LinkUrl :"link_Url"],[linkName: "link_name", LinkUrl :"link_Url"]}
-    socialLinks = {{facebook: "your_link", gitter: "your_link", twitter: "your_link", github: "your_link" linkedin:"your_link", medium:"your_link"}}
+    usefullListData =  {[{linkName: "link_name", LinkUrl :"link_Url"},{linkName: "link_name", LinkUrl :"link_Url"}]}
+    socialLinks = {{facebook: "your_link", gitter: "your_link", twitter: "your_link", github: "your_link", linkedin:"your_link", medium:"your_link"}}
     copywriteText = "sample-subscribe-text"
 />
 ```

src/components/FooterThemeThree/FooterThemeThree.md

@@ -20,11 +20,11 @@ Import the component to `pages/index.js`
     titleThree = "sample-headingThree"
     mainHeading = "sample-mainHeading"
     newsletterText = "sample-newsletter-text"
-    linksListData =  {[linkName: "link_name", LinkUrl :"link_Url"],[linkName: "link_name", LinkUrl :"link_Url"]}
-    secondListData =  {[linkName: "link_name", LinkUrl :"link_Url"],[linkName: "link_name", LinkUrl :"link_Url"]}
-    thirdListData =  {[linkName: "link_name", LinkUrl :"link_Url"],[linkName: "link_name", LinkUrl :"link_Url"]}
-    fourthListData =  {[linkName: "link_name", LinkUrl :"link_Url"],[linkName: "link_name", LinkUrl :"link_Url"]}
-    socialLinks = {{facebook: "your_link", gitter: "your_link", twitter: "your_link", github: "your_link" linkedin:"your_link", medium:"your_link"}}
+    linksListData =  {[{linkName: "link_name", LinkUrl :"link_Url"},{linkName: "link_name", LinkUrl :"link_Url"}]}
+    secondListData =  {[{linkName: "link_name", LinkUrl :"link_Url"},{linkName: "link_name", LinkUrl :"link_Url"}]}
+    thirdListData =  {[{linkName: "link_name", LinkUrl :"link_Url"},{linkName: "link_name", LinkUrl :"link_Url"}]}
+    fourthListData =  {[{linkName: "link_name", LinkUrl :"link_Url"},{linkName: "link_name", LinkUrl :"link_Url"}]}
+    socialLinks = {{facebook: "your_link", gitter: "your_link", twitter: "your_link", github: "your_link", linkedin:"your_link", medium:"your_link"}}
 />
 ```
 

src/components/FooterThemeTwo/FooterThemeTwo.md

@@ -20,10 +20,10 @@ Import the component to `pages/index.js`
     titleThree = "sample-headingThree"
     aboutText = "sample-about-text"
     newsletterText = "sample-newsletter-text"
-    linksListData =  {[linkName: "link_name", LinkUrl :"link_Url"],[linkName: "link_name", LinkUrl :"link_Url"]}
-    contactListData = {[Detail:"sample-address", link: "sample-address-link"],[Detail:"sample-phone-number", link: "sample-phone-link"]}
-    servicesListData = {[serviceName : "sample service name", link: "sample-service-url"],[serviceName : "sample service name", link: "sample-service-url"]}
-    socialLinks = {{facebook: "your_link", gitter: "your_link", twitter: "your_link", github: "your_link" linkedin:"your_link", medium:"your_link"}}
+    linksListData =  {[{linkName: "link_name", LinkUrl :"link_Url"},{linkName: "link_name", LinkUrl :"link_Url"}]}
+    contactListData = {[{ detail: "sample-detail", link: "#"},{detail: "sample-detail",link: "#"}]}
+    servicesListData = {[{serviceName : "sample service name", link: "sample-service-url"},{serviceName : "sample service name", link: "sample-service-url"}]}
+    socialLinks = {{facebook: "your_link", gitter: "your_link", twitter: "your_link", github: "your_link", linkedin:"your_link", medium:"your_link"}}
 />
 ```
 

src/components/GitterRoomsList/GitterRoomList.md

@@ -6,7 +6,7 @@ This is a resuasble component for getting the list of all Gitter Rooms of an org
 
 ## How to use the component
 Import the component to `pages/index.js`
-`import {GiiterRoomList} from "../components/GitterRoomList";`
+`import {GitterRoomsList} from "../components/GitterRoomsList";`
 
 ## How to handle props to the component
 ```

src/components/HeroSection/HeroSection.md

@@ -14,7 +14,7 @@ Import the component to `pages/index.js`
 ## How to handle props to the component
 
 ```
-<HeroSection mainText="sample-heading-text" subText="sample-subtext-para" buttonText="button" buttonLink="/" image="sample-url />
+<HeroSection mainText="sample-heading-text" subText="sample-subtext-para" buttonText="button" buttonLink="/" image="sample-url" />
 ```
 
 `mainText` prop is the heading that you want to display

src/components/HeroSectionThemeThree/HeroSectionThemeThree.md

@@ -14,7 +14,7 @@ Import the component to `pages/index.js`
 ## How to handle props to the component
 
 ```
-<HeroSectionThemeThree mainText="sample-heading-text" subText="sample-subtext-para" buttonText="button" buttonLink="/" contributeLink = "/" contributeText="sample-text" image="sample-url />
+<HeroSectionThemeThree mainText="sample-heading-text" subText="sample-subtext-para" buttonText="button" buttonLink="/" contributeLink = "/" contributeText="sample-text" image="sample-url" />
 ```
 
 `mainText` prop is the heading that you want to display

src/components/HeroSectionThemeTwo/HeroSectionThemeTwo.md

@@ -14,7 +14,7 @@ Import the component to `pages/index.js`
 ## How to handle props to the component
 
 ```
-<HeroSectionThemeTwo mainText="sample-heading-text" subText="sample-subtext-para" buttonText="button" buttonLink="/" image="sample-url />
+<HeroSectionThemeTwo mainText="sample-heading-text" subText="sample-subtext-para" buttonText="button" buttonLink="/" image="sample-url" />
 ```
 
 `mainText` prop is the heading that you want to display

src/components/ImageGrid/ImageGrid.md

@@ -15,7 +15,7 @@ Import the component to `pages/index.js`
 
 ```
 <ImageGrid size={4} images={[{imageUrl: "image_url", imageText: "image_text"}]} header="sample-header" row={false}
-           categories={false} categoryData={[{text: "text", color: "#e52165", route: "/", image: "sample-path"}}]} />
+           categories={false} categoryData={[{text: "text", color: "#e52165", route: "/", image: "sample-path"}]} />
 ```
 
 `size` prop is used to decide how many images should render per row e.g size = 3 means 4 images per row

src/components/IndividualCard/IndividualCard.md

@@ -14,7 +14,7 @@ Import the component to `pages/index.js`
 ## How to handle props to the component
 
 ```
-<IndividualCard image="sample-image" iconImage="sample-icon" title="sample title="sample-title" description="sample-description" buttonText="sample-button-text" buttonLink="sample-button-link" />
+<IndividualCard image="sample-image" iconImage="sample-icon" title="sample-title" description="sample-description" buttonText="sample-button-text" buttonLink="sample-button-link" />
 ```
 
 `image` prop is used to display the main image of the card

src/components/InfoSection/InfoSection.md

@@ -14,7 +14,7 @@ Import the component to `pages/index.js`
 ## How to handle props to the component
 
 ```
-<InfoSection mainText="sample-heading-text" subText="sample-subtext-para"  infoListData={text="sample-text" image="sample-image" description = "sample-descrption"/>
+<InfoSection mainText="sample-heading-text" subText="sample-subtext-para"  infoListData={[{text:"sample-text" , image:"sample-image", description: "sample-descrption"}]}/>
 ```
 
 `mainText` prop is the heading that you want to display

src/components/IntroSection/index.js

@@ -3,7 +3,7 @@ import PropTypes from "prop-types"
 import "./style.sass"
 import { Container, Row, Col } from "react-bootstrap"
 
-export const IntroComponent = ({
+export const IntroSection = ({
   mainText,
   subText,
   image,
@@ -33,7 +33,7 @@ export const IntroComponent = ({
   )
 }
 
-IntroComponent.propTypes = {
+IntroSection.propTypes = {
   mainText: PropTypes.string,
   description: PropTypes.string,
   subText: PropTypes.string,

themes/learning-management-system/package.json

@@ -1,7 +1,13 @@
 {
   "private": true,
-  "workspaces": ["learning-management-theme", "site"],
+  "workspaces": [
+    "learning-management-theme",
+    "site"
+  ],
   "scripts": {
     "develop": "yarn workspace site develop"
+  },
+  "dependencies": {
+    "learning-management-theme": "file:learning-management-theme"
   }
-}
+}