:host {
  height: 100%;
  display: block;
  overflow: hidden;
}

.container {
  height: 100%;

  .toolbar {
    .toolbar__side-content {
      flex: 0 0 40px;
      display: flex;
    }

    .toolbar__header {
      flex: 1;
      display: flex;
      justify-content: center;

      .app-name {
        font-family: 'Arima Madurai', cursive;
        font-size: 18px;
      }
    }
  }

  md-sidenav {
    width: 300px;
  }

  main {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: visible;

    router-outlet {
      flex: none;
    }
  }

  ::ng-deep.mat-sidenav-content {
    display: flex;
    flex-direction: column;
  }
}


:host {
  height: 100%;
  display: block;
  overflow: hidden;
}

.container {
  height: 100%;

  .toolbar {
    .toolbar__side-content {
      flex: 0 0 40px;
      display: flex;
    }

    .toolbar__header {
      flex: 1;
      display: flex;
      justify-content: center;

      .app-name {
        font-family: 'Arima Madurai', cursive;
        font-size: 18px;
        padding-top: 3px;
      }
    }
  }

  md-sidenav {
    width: 300px;
  }

  main {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: visible;

    router-outlet {
      flex: none;
    }
  }

  ::ng-deep.mat-sidenav-content {
    display: flex;
    flex-direction: column;
  }
}


Fix misaligned app name in the header
Fix misaligned app name in the header
