BorderBox bug

[jasonworkboost]

Describe the bug Whenever I click on a slide (and not drag) a borderbox is drawn around the slides placeholder. When I drag, the borderbox is not shown.

Code Code:

'< template> < v-container ma-0 pa-0 style="backgroundColor: transparent;"> < v-layout align-start justify-start wrap :style="{marginTop: setMargin}"> < hooper class="flicking" :settings="hooverSettings" ref="carousel" @slide="updateCarousel"> < slide v-for="(boost, index) in boosts" :key="index"> hello < /slide> < /hooper> < /v-layout> < /v-container> < /template>

< script> import { mapGetters } from "vuex"; import { Hooper, Slide } from "hooper"; import "hooper/dist/hooper.css";

export default { data() { return { hooverSettings: { itemsToShow: 1.2, centerMode: true, pagination: false } }; }, watch: { carouselData() { this.$refs.carousel.slideTo(this.carouselData); } }, components: { Hooper, Slide }, methods: { updateCarousel(payload) { this.carouselData = payload.currentSlide; } }, computed: { ...mapGetters([ "boosts", "boostHeader" ]), setMargin: function() { let a = this.boostHeader ? 220 : 80; return a + "px"; }, } };

' **Expected behavior** When I click I expect no borderbox to be drawn **Screenshots** If applicable, add screenshots to help explain your problem. **Desktop (please complete the following information):** - OS: Windows 10 - Browser: Only in Chrome, no problems in Edge or Firefox **Additional context** Add any other context about the problem here.

[allanbanis]

need a fix for this, the border box is drawn around hooper-navigation icons too

[allanbanis]

ok so to remove the border box from navigation icons add this to your css
.hooper-next:focus{ outline: none; } .hooper-prev:focus{ outline: none; } and to remove from the border box from the slider .hooper:focus{ outline:none; }

[Keromudo]

This is not a bug. Outline is something that you should have on every element used for interactions. It indicates that you can do something more with an element. If you don't want to have blue (default) styling you should style your own one. But if you will get rid of it completely you are risking that some users will be confused and you will make your website hard to navigate with keyboard only.

Read more: MDN reference

[jasonworkboost]

@allanbanis & @Keromudo Thanks for the clarification, it helped me with my problem.