learn more

src/app/pages/learnmore/learnmore.page.html

@@ -1,9 +1,38 @@
-<ion-header>
+<ion-header mode="ios" class="ion-no-border">
   <ion-toolbar>
-    <ion-title>learnmore</ion-title>
+    <ion-buttons slot="start" (click)="onBack()">
+      <ion-button>
+        <ion-icon name="arrow-back-outline"></ion-icon>
+      </ion-button>
+    </ion-buttons>
+    <ion-title>Learn More</ion-title>
   </ion-toolbar>
 </ion-header>
 
+
 <ion-content>
 
+  <ion-accordion-group>
+    <ion-accordion *ngFor="let item of learnMoreData" value="{{item.uid}}">
+      <ion-item class="arcord_head" slot="header" color="secondary">
+        <ion-label><span style="font-weight: bolder; color: #8b198e">{{item.topic}}</span> </ion-label>
+      </ion-item>
+      <div  class="ion-padding acc-item" slot="content" [innerHTML]="item.contents">
+<!--        {{item.contents}}-->
+      </div>
+    </ion-accordion>
+    <!--                    <ion-accordion value="second">-->
+    <!--                        <ion-item slot="header" color="light">-->
+    <!--                            <ion-label>Second Accordion</ion-label>-->
+    <!--                        </ion-item>-->
+    <!--                        <div class="ion-padding" slot="content">Second Content</div>-->
+    <!--                    </ion-accordion>-->
+    <!--                    <ion-accordion value="third">-->
+    <!--                        <ion-item slot="header" color="light">-->
+    <!--                            <ion-label>Third Accordion</ion-label>-->
+    <!--                        </ion-item>-->
+    <!--                        <div class="ion-padding" slot="content">Third Content</div>-->
+    <!--                    </ion-accordion>-->
+  </ion-accordion-group>
+
 </ion-content>