How can I remove a className from a component when entering another component in react

I am building a portfolio in React in which I am using my fixed navigation bar all the time, but I have another component that is another page called projects, in it images appear and when clicking on them a modal appears that gives all the data of said project, but my problem is that the navigation bar is still there and does not disappear, how can I make the navigation bar disappear when I open the modal? Is there a way to remove the class and when I close the modal, the class will appear so that the navigation bar continues?shows how the navigation bar appears when opening the modal

Answer

Since you are using bootstrap there are a few z-index properties we need to take care of if we deviate from bootstrap classes.

$zindex-dropdown:                   1000;
$zindex-sticky:                     1020;
$zindex-fixed:                      1030;
$zindex-modal-backdrop:             1040;
$zindex-offcanvas:                  1050;
$zindex-modal:                      1060;
$zindex-popover:                    1070;
$zindex-tooltip:                    1080;

In your case, you need to apply the zindex-modal-backdrop value 1040 on your overlay so it will show on top of the menu.