Как применить стили к ионному ионизатору

Question

Я создаю ионное приложение, и я хотел бы применить некоторые стили к элементу ионной сборки. Чтобы помочь мне проиллюстрировать то, что я хочу, вот изображение того, что у меня есть (извините, но содержание изображения на португальском).

Прежде всего мне нужно настроить отображение параметров, чтобы я мог отображать весь текст параметров (возможно, отображаемый в две строки, если это возможно, или уменьшение размера шрифта).

Во-вторых, я хотел бы иметь что-торазделяя два столбца.

Это мой код для выбора средства выбора

async showFilters() {
    const columns = {
      activities: this.activities.map(obj => {
        return {text: obj.name, value: obj.id};
      }),
      districts: this.districts.map(obj => {
        return {text: obj.name, value: obj.name};
      })
    };
    columns.activities.unshift({text: 'Atividades', value: undefined});
    columns.districts.unshift({text: 'Distritos', value: undefined});
    const picker = await this.pickerController.create({
      columns: [
        {
          name: 'activity',
          options: columns.activities,
        },
        {
          name: 'district',
          options: columns.districts,
        },
      ],
      buttons: [
        {
          text: 'Cancelar',
          role: 'cancel'
        },
        {
          text: 'Confirmar',
          handler: (value) => {
            console.log(value);
          }
        }
      ],
      cssClass: 'picker',
    });
    return await picker.present();
  }

И это тест, который я тестировал для разделения двух столбцов

.picker>ion-picker-column {
  margin-left: 1px solid #eeeeee;
}

В любом случае я могу делать то, что хочу? Заранее спасибо.

Answer 1

Попробуйте это:

::ng-deep .picker.ion-picker-column {
   margin-left: 1px solid #eeeeee !important;
}