Перезаписать стили для компонента FileUpload в PrimeNG, чтобы он выглядел как обычное поле загрузки файла

Я смотрел в компонент FileUpload PrimeNG. Можем ли мы как-то преобразовать его, чтобы он функционировал как "обычное" поле ввода файла (т.е. кнопка "Выбрать" + только информация о файле; желательно в одну строку)?
Нам не понадобятся функции загрузки и индикатор выполнения, но перетаскивание будет отличным.
Можем ли мы сделать это, используя только CSS для компонента загрузки файлов (скрывая кнопки "Загрузить" и "Отмена", перемещая кнопку "Выбрать" в той же строке, что и информация о файле)? Если да, то как?

1 ответ

Конечно, вы можете, это пример стилизации загрузки файла.

/* FileUpload */
.ui-fileupload-choose.ui-button, .ui-fileupload-choose.ui-button .ui-widget, .ui-fileupload-choose.ui-button .ui-state-default {
      background-color: #0275d8;
      border: 1px solid #0275d8;
      color: #ffffff;
}

.ui-fileupload-choose.ui-button.ui-state-hover, .ui-fileupload-choose.ui-button.ui-state-focus, .ui-fileupload-choose.ui-button.ui-state-active {
      background-color: #025aa5;
      border-color: #01549b;
}

И вы всегда можете посмотреть документацию:

http://primefaces.org/primeng/

Внизу этой страницы есть раздел "Стиль".

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