Ионик: Как можно изменить ширину $ionicPopup?

Question

Я пытаюсь изменить ширину $ionicPopup; Я попытался использовать следующий код CSS, чтобы импортировать его на cssClass: my-popup:

.my-popup {
      width: 400;
      }

Но это не сработало.

Я действительно застрял там, и в настоящее время не могу найти решение.

Любая помощь будет высоко ценится. Спасибо.

Answer 1

Поместите следующее в файл src/theme/variables.scss;

$popover-ios-width: 300px;

Answer 2

Это на самом деле довольно просто, см. Следующий пример:

var pinPopup = $ionicPopup.show({
    templateUrl : 'app/user-profile/user-pin.html',
    title: '4-digit Security PIN',
    scope : $scope,
    cssClass: 'my-popup',
    buttons : [
        {
            text : 'Cancel',
        },
        {
            text : '<b>Save</b>',
            type: 'button-positive',
            onTap : function(e) {
                var val = document.getElementById('pin-output').value;
                $scope.userRow.password = val;
            }
        }
    ]
})

Теперь в вашем CSS просто сделайте:

.my-popup .popup {
  width: 400px;
}