Arhn - архитектура программирования

как переопределить Scss для конкретной страницы для конкретной кнопки в ionic 3

Я не могу переопределить scss для конкретной кнопки на странице.

https://stackblitz.com/edit/ionic-esc8ua?file=pages%2Fhome%2Fhome.html

   button {
       &.optgroup {
          &.input-wrapper {
            padding-left:10px !important;
          }
       }
     }
<button ion-item class="optgroup">Hello i want to apply css to this button</button>

   <button ion-item>i dont want to modify this button</button>

я хочу применить padding-left:10px к внутренней части текста первой кнопки

Решено:

.optgroup {
        & > div.item-inner {
          padding-left:6px !important;
        }
}
17.05.2019

Ответы:


1

Рассмотрите возможность создания файла scss в домашнем каталоге и ссылки на него из домашнего компонента следующим образом:

home.ts

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
  styleUrls: [ 'home.scss' ]
})

и в home.scss:

.optgroup ::content {
  padding-left:100px;
}
17.05.2019
  • Это добавит padding-left:100px к обеим кнопкам, я хочу добавить padding-left к первой кнопке .item-inner 17.05.2019
  • просто измените селектор button на .optgroup. я отредактировал свой пост. проверить это. 17.05.2019
  • Это переместит все это, включая строку. 17.05.2019
  • Новые материалы

    Коллекции публикаций по глубокому обучению
    Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..

    Представляем: Pepita
    Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..

    Советы по коду Laravel #2
    1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..

    Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
    Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..

    3 способа решить квадратное уравнение (3-й мой любимый) -
    1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..

    Создание VR-миров с A-Frame
    Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..

    Демистификация рекурсии
    КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..