mbj36/vue-burger-menu

Change bm-burger-bars

Opened this issue · 1 comments

How is it possible to change the style of the menu in nuxtjs, especially the class bm-burger-bars, because I want to use this in a website, which is in dark-mode. So it is quit difficult to see a grey bar in a dark grey background, so I want to color it white.

How is it possible to change the style of the menu in nuxtjs, especially the class bm-burger-bars, because I want to use this in a website, which is in dark-mode. So it is quit difficult to see a grey bar in a dark grey background, so I want to color it white.

I used it in Vue 3 but I believe it works the same for Nuxt:
CSS(SCSS particular) just apply desired styles:

.bm-menu {
width: 400px;
}
.bm-burger-button {
z-index: 100;
}
.bm-burger-bars {
background-color: red; // or:
background: #fff;
border-radius: 10px;
height: 5px;
margin: 5px 0;

&:nth-of-type(1) {
width: 50%;
}

&:nth-of-type(2) {
width: 100%;
}

&:nth-of-type(3) {
width: 75%;
}
}