Как стилистически отреагировать на загрузку карусели следующим js? - PullRequest
0 голосов
/ 03 декабря 2018

Я новичок в next.js и хотел бы убрать градиент вокруг стрелок слева и справа от карусели начальной реакции.Я попробовал встроенный CSS для карусели и использую styled-компоненты для остальных своих компонентов.

1 Ответ

0 голосов
/ 03 декабря 2018

Официальная документация пакета response-bootstrap гласит, что он использует стили Bootstrap v3:

React-Bootstrap в настоящее время нацелен на Bootstrap v3.Чтобы использовать React-Bootstrap, включите CSS для Bootstrap v3 вместо Bootstrap v4.

Если мы просмотрим файл bootstrap.css , мы увидим, что элементы управления карусели имеют .carouselИмена классов -control.left и .carousel-control.right для левой и правой кнопок соответственно.Таким образом, мы можем использовать функцию вложения стилевых компонентов, чтобы указать компонент CarouselWrapper, который будет переопределять стили фона элементов управления по умолчанию (здесь вам определенно следует использовать другие свойства стиля класса из исходного кода начальной загрузки, для ясности я их опустил).

 const CarouselWrapper = styled.div`
   .carousel-control.left,
   .carousel-control.right {
     background: none;
   }
 `;

Это немного «обезьяноподобный» подход, но я не смог найти другой способ передачи пользовательских стилей для фона управления каруселью.

Проверьте полный код проверки концепции здесь: https://codesandbox.io/s/pypkzo5kz0

...