Ионный ион-Навбар прозрачный

Question

Мне нужно сделать прозрачным ion-navbar.Я пытался поставить прозрачный, но он не работает.

"devDependencies": {
        "@ionic/app-scripts": "2.1.3",
        "ionic": "3.20.0",
        "typescript": "2.3.4",
        "electron": "^1.6.5"
    },

page.html

<ion-header>
  <ion-navbar>
    <ion-title>
      {{show.title}}
    </ion-title>

    <ion-buttons end>
      <button class="appbarButton" *ngIf="target == 'tv'" ion-button icon-only (click)="selectCurrentEpisode()">
        <ion-icon name="skip-backward"></ion-icon>
      </button>
      <button class="appbarButton" *ngIf="target == 'tv'"  ion-button icon-only (click)="selectNextEpisode()">
        <ion-icon name="skip-forward"></ion-icon>
      </button>
      <button class="appbarButton" *ngIf="detail" ion-button icon-only (click)="changeFavorite()">
        <ion-icon name="{{ (detail.favorite == true) ? 'star' : 'star-outline' }}"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>

Answer 1

Попробуйте добавить пользовательский цвет в файл src/theme/variables.scss, добавив свойство на карту $ colors, а затем назовите его следующим образом.

<ion-navbar color="custom">

Answer 2

Если вы пытаетесь найти правильный класс, попробуйте это:

.toolbar-background.toolbar-background-md{
     background-color: transparent;
}

Answer 3

Вы пытались играть с его непрозрачностью?Попробуйте это:

HTML-файл:

<ion-navbar class="transparent-nav-bar">
   <ion-title>
      {{show.title}}
    </ion-title>
</ion-navbar>

SCSS-файл:

.transparent-nav-bar {
    opacity: 0;
}