Overlap on a Navbar Dropdown

[lauragift21]

• I confirm that this is an issue rather than a question.

Bug report

When one clicks on several options in the navbar, their drop-down menu options overlap.

Steps to reproduce

If you are reporting a bug that can ONLY be reproduced on your repository, PLEASE provide this repo link. That takes guessing work out of the way and saves us time.

This can be reproduced on any vuepress site with navbar items included.

What is expected?

I should be able to configure the navbar in such a way that this overlap is avoided. It sometimes takes a few secs to get out of this situation when it occurs. Also helpful if there's a way to disable focus on the parent navbar item.

What is actually happening?

When I click on several navbar items with dropdown I get this behavior where all dropdown overlaps.

Other relevant information

• Output of npx vuepress info in my VuePress project:

Environment Info:

  System:
    OS: macOS Mojave 10.14.5
    CPU: (8) x64 Intel(R) Core(TM) i5-8279U CPU @ 2.40GHz
  Binaries:
    Node: 13.9.0 - ~/.nvm/versions/node/v13.9.0/bin/node
    Yarn: 1.22.0 - /usr/local/bin/yarn
    npm: 6.13.7 - ~/.nvm/versions/node/v13.9.0/bin/npm
  Browsers:
    Chrome: 80.0.3987.132
    Firefox: 73.0.1
    Safari: 12.1.1
  npmPackages:
    @vuepress/core:  1.2.0
    @vuepress/theme-default:  1.2.0
    vuepress: ^1.2.0 => 1.2.0
  npmGlobalPackages:
    vuepress: Not Found

[billyyyyy3320]

Thanks for the report. Contribution Welcome.

[ghana04]

@lauragift21 I see you are on version 1.2.0, try updating your vuepress package to version 1.3.0 or 1.4.0 (the current latest version). I believe your issue is fixed by #1952, which was included in the 1.3.0 release.

[lauragift21]

@ghana04 Thank you I'll update and check :)

[billyyyyy3320]

Well I guess it's still a bug. Visit our docs and click on Learn More and Languages.

I'll look into it later.

[ghana04]

@newsbielt703 you are correct, it's still a bug. My assumption was incorrect.

[lauragift21]

Alright thanks @newsbielt703. I'll love to follow up with this if it gets fixed.

[JoeyBling]

@billyyyyy3320 I upgraded to the latest version and there was an error,Is there a problem with local dependence?

Failed to @extend ".dropdown-title"

Error: F:\workSpaces\source-code\ibooks\node_modules@vuepress\theme-default\components\DropdownLink.vue:156:15

[ghost]

https://v3.vuejs.org/guide/introduction.html has the same issue currently.
First mentioned there - vuejs/docs#426

[billyyyyy3320]

I'll take a look later today or yesterday.

[JoeyBling]

I'll take a look later today or yesterday.

The previous version was 1.5.3 So I execute：npm install vuepress@latest -S And then it report the mistakes I posted

If I delete the node_modules folder,Re execution npm i, It won't be a problem. It's strange

[JoeyBling]

@billyyyyy3320 The problem has been found,The stylus version used by the default theme is 0.54.5

vuepress/packages/@vuepress/theme-default/package.json

Line 29 in 8999aba

"stylus": "^0.54.5",

... This version does not support the @extends notation, So I did the upgrade to solve the problem

npm install stylus