Respoiurces page

src/app/pages/resources/resources.page.html

@@ -1,9 +1,27 @@
-<ion-header>
+
+
+<ion-header mode="ios" class="ion-no-border">
   <ion-toolbar>
-    <ion-title>resources</ion-title>
+    <ion-buttons slot="start" (click)="onBack()">
+      <ion-button>
+        <ion-icon name="arrow-back-outline"></ion-icon>
+      </ion-button>
+    </ion-buttons>
+    <ion-title>Playground</ion-title>
   </ion-toolbar>
 </ion-header>
 
-<ion-content>
 
+<ion-content>
+  <div class="boxed_contents">
+    <ion-accordion-group>
+      <ion-accordion *ngFor="let item of playGroundData" 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">
+        </div>
+      </ion-accordion>
+    </ion-accordion-group>
+  </div>
 </ion-content>

src/app/pages/resources/resources.page.ts

@@ -6,7 +6,7 @@ import { Component, OnInit } from '@angular/core';
   styleUrls: ['./resources.page.scss'],
 })
 export class ResourcesPage implements OnInit {
-
+  playGroundData:any;
   constructor() { }
 
   ngOnInit() {