<ion-content class="merms-patient-page">
  <div class="container">
    <ion-grid class="top-container">
      <ion-row>
        <ion-col size="2" class="navigation">
          <ion-back-button text="" (click)="goBack()"></ion-back-button>
        </ion-col>
        <ion-col size="8" class="page-title">{{patient_name}}</ion-col>
      </ion-row>
    </ion-grid>



    <!-- Item Dividers in a List -->
    <ion-list>

      <ion-item>
        <ion-label>Reason:{{reason}}</ion-label>
      </ion-item>
      <ion-item>
        <ion-label>{{appt}} - {{gender}} [{{age}}]</ion-label>
      </ion-item>
      <ion-item>

        <ion-grid>
          <ion-row>
            <ion-col>
              <img src="{{profile_picture}}" />
            </ion-col>
            <ion-col>
              <ion-button color="success" expand="full">Video ??</ion-button>

            </ion-col>

          </ion-row>
        </ion-grid>
      </ion-item>
      <ion-item>
        <ion-grid>
          <ion-row>
            <ion-col>

              <ion-button expand="full">Call ??</ion-button>


            </ion-col>
            <ion-col>
              <ion-button color="success" expand="full">Video ??</ion-button>

            </ion-col>
            <ion-col>
              <ion-button expand="full">Chat ??</ion-button>
            </ion-col>
          </ion-row>
        </ion-grid>
      </ion-item>
      <ion-item>
        <ion-label>Notes</ion-label>
        <ion-textarea rows="6" cols="20" placeholder="Enter any notes here..."></ion-textarea>


      </ion-item>

    </ion-list>
  </div>

</ion-content>


<!-- Footer without a border -->
<ion-footer class="ion-no-border">
  <ion-toolbar>
    <ion-grid style="font-size: 25px; text-align: center;">
      <ion-row>
        <ion-col>
          <div>
            <ion-icon name="home" (click)="goHome()"></ion-icon>
          </div>
        </ion-col>
        <ion-col>
          <div>
            <!-- ion-icon name="calendar" style="color:aquamarine;" ></!-->
          </div>
        </ion-col>
        <ion-col>
          <div>
            <!-- ion-icon name="wallet" style="color:green;" ></!-->
          </div>
        </ion-col>

        <ion-col>
          <div>
            <!-- ion-icon name="settings" style="color:red;" ></!-->
          </div>
        </ion-col>
      </ion-row>
    </ion-grid>

  </ion-toolbar>
</ion-footer>