Ionic 3: изменить цвет границы из ионного заголовка

Я разрабатываю новое приложение с использованием Ionic 3, но я хотел бы изменить цвет границы из заголовка, но я не знаю, как это сделать.

Любая помощь, пожалуйста?

Мой html файл:

<ion-header no-shadow class="nav-content">
  <ion-navbar hideBackButton>
    <ion-title>
      MEDITACIÓN
    </ion-title>
    <ion-buttons end>
      <button ion-button icon-only>
        <ion-icon name="close" color="third"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>

<ion-content class="content">
</ion-content>

Мой файл sass:

page-meditation {
  .scroll-content {
    overflow: hidden;
  }

  .toolbar {
    border-color: red !important;
    // box-shadow: 0px 1px 0px #ff9100!important;
  }

  .content {
    background-color: color($colors, primary, base);
  }
}

Если я поставлю цвет границы, это не сработает. И если поставить тень блока, работает, но линия рисуется под другой границей и толще на 1 пиксель.

Заранее спасибо.

Вы хотите изменить цвет границы заголовка, верно?

Pradnya Sinalkar 10.08.2018 14:50

Да. Спасибо!!!

Jesus Sanchez 11.08.2018 19:39
1
2
1 303
1

Ответы 1

Структура заголовка приложения Ionic выглядит так:

<ion-header>
  <ion-navbar>
    <ion-title>Page1</ion-title>
  </ion-navbar>

  <ion-toolbar>
    <ion-title>Subheader</ion-title>
  </ion-toolbar>
</ion-header> 

css

 .toolbar{
       border-color: red;
    }

Спасибо за ваш ответ. Я отредактировал свой пост, потому что протестировал ваш подход, но он не работает. Я добавил свой код, чтобы узнать подробности.

Jesus Sanchez 11.08.2018 19:40

Другие вопросы по теме