#angular #ionic-framework #sass #ionic4
Вопрос:
Я делаю угловой ионный проект. Но я хочу настроить стиль панели поиска ионов. На шаблоне ionic значок панели поиска расположен с левой стороны. Я хочу изменить положение значка, я хочу переместить его в правую сторону. Возможно ли это?
Ответ №1:
В ionic 5 global.css файл
ion-searchbar {
/* overall styles here */
.searchbar-input-container {
/* inner input styles here */
input{
/* input element styles here */
}
}
}
Комментарии:
1. могу ли я просто поместить стили в локальный файл компонента scss?
2. Я когда — либо использовал его только в глобальном масштабе. Компонент scss переименует класс по причинам пространства имен — даже если это не стили, основанные на классах, все равно может возникнуть проблема.. не уверен.
3. к сожалению, он был переопределен, потому что я также использую tailwindcss
4. Ты все равно пробовал это сделать? Он должен работать в вашем локальном файле scss компонента, потому что он не зависит от имен классов
Ответ №2:
Добавьте эти стили в свой глобальный файл.css.
.searchbar-md .searchbar-search-icon{
right: 47px !important; //Adjust right position as your need
left: auto !important;
}
Отрегулируйте заполнение строки поиска также для улучшения выравнивания.
.searchbar-md .searchbar-input{
padding: 6px 9px; !important // Adjust as your need
}