Как изменить размер загрузчика popover arrow

Question

Я пытаюсь внедрить всплывающие элементы в элементы на моей странице для использования на учебном уровне. Тем не менее, я не могу понять, как увеличить размер стрелки. Я использую загрузчик 3.4.0.

В настоящее время это выглядит так:

Вот мой текущий CSS :

.popover {
  background-color: rgb(214, 245, 233);
}
 /* Right */
.popover.right .arrow:after {
  border-right-color: rgb(97, 95, 3);
}
.popover.right{
  border: 5px solid rgb(10, 10, 10);
}
/* Left */
.popover.left .arrow:after {
  border-left-color: rgb(10, 10, 10);
}
.popover.left{
  border: 5px solid rgb(10, 10, 10);
}
/* Top */
.popover.top .arrow:after {
  border-top-color: rgb(10, 10, 10);
}
.popover.top{
  border: 5px solid rgb(10, 10, 10);
}
/* Bottom */
.popover.bottom .arrow:after {
  border-bottom-color: rgb(10, 10, 10);
}
.popover.bottom{
  border: 5px solid rgb(10, 10, 10);
}

А вот и HTML :

<div class="blocklyDiv" id="blocklyDiv" data-container="body" data- 
html="true" data-toggle="popover" data-placement="right"></div>

С содержимым, добавляемым через Jquery, используя

$('#blocklyDiv').popover({ content: getPopContent('blocklyDiv') });

Я довольно новичок в этом, так что если вы могли бы предположить, что я не знаю много, я буду благодарен.

Answer 1

Twitter основан на меньше

// Tooltips and popovers
// -------------------------
@tooltipColor:            #fff;
@tooltipBackground:       #000;
@tooltipArrowWidth:       5px;
@tooltipArrowColor:       @tooltipBackground;

@popoverBackground:       #fff;
@popoverArrowWidth:       10px;
@popoverArrowColor:       #fff;
@popoverTitleBackground:  darken(@popoverBackground, 3%);

// Special enhancement for popovers
@popoverArrowOuterWidth:  @popoverArrowWidth + 1;
@popoverArrowOuterColor:  rgba(0,0,0,.25);

Если используется sass, попытайтесь понять это Переменные SASS .

Просьба также упомянуть ваш HTML для уточнения