Customizing twitter bootstrap popover arrow

Question

I could not find any relevant information on this, but I find it hard to swallow that it\'s not doable.

How can I customise the arrow for the popovers? I already did

Answer 1

Twitter Bootstrap is based on Less.

If you want to change the appearance of its arrows use the bootstrap less variables to do so.

// 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);

If you are using Sass instead do the same with the Sass Variables.

Sadly the TB-Customizer doesn't have all the variables so you might have to compile it on your own.

Edit:

Good news the new Bootstrap 3 customizer now provides these options.