<ion-header>

  
  <ion-toolbar color="primary">

      <ion-back-button></ion-back-button>
  </ion-toolbar>
</ion-header>
<ion-content>
  <div class="title-section ion-text-center">
      <h1>{{lesson.headerTitle}}</h1>
  </div>
  
  <div class="content">
      <section  *ngFor="let item of segments">
          <!-- <h4 class="ion-padding-start" style="margin-bottom:0" >{{item.subtitlu}}</h4> -->
           <p class="ion-margin" style="text-align: justify">{{item.paragraph}}</p>
           <figure style="margin-left:0; margin-right:0;">
             <img src="{{item.img}} " style="width:100vw">
             <figcaption style="text-align: center">{{item.imgCaption}}</figcaption>
           </figure>
         </section>
    <!-- <app-lesson-section></app-lesson-section> -->
  </div>

  <div class="social">
      <ion-toolbar *ngIf="mode=='lesson'" (click)="completeLesson(lesson.categoryId)"  routerLink="/main-tabs"  id="toolbar-complete">
          <ion-buttons slot="secondary">
              <ion-button>
                <ion-icon slot="icon-only" name="heart" style="color:white"></ion-icon>
              </ion-button>
            </ion-buttons>
        Termina lectia!</ion-toolbar>

    <ion-toolbar  (click)="shareLesson(lesson)" id="toolbar-share" >
        <ion-buttons slot="secondary">
            <ion-button >
              <ion-icon slot="icon-only" name="share" style="color:white"></ion-icon>
            </ion-button>
          </ion-buttons>
      Trimite prietenilor tai
    </ion-toolbar>
    <ion-toolbar  *ngIf="mode=='lesson'" (click)="setBookmark(lesson)" id="toolbar-bookmark">
        <ion-buttons slot="secondary">
            <ion-button>
              <ion-icon slot="icon-only" name="bookmark" style="color:white"></ion-icon>
            </ion-button>
          </ion-buttons>
      Adauga lectia la favorite</ion-toolbar>
   
  </div>

</ion-content>
