Close FeatherLight after opening a new one

Question

I'm currently using FeatherLight however I can't seem to find any documentation on hiding a previously opened box when opening a new one from inside that.

My initial link would look like:

<a href="{{ route('frontend.auth.login_popup') }}" class="btn ajax-featherlight" data-featherlight="ajax">{{ __('navs.frontend.login') }}</a>

However once this modal/popup opens, I then click another featherlight link which says "Register" so I want the login modal to close and the new one to open; but it appears the login one stays open behind the register one.

My Javascript constructor looks like the following:

$(".ajax-featherlight").featherlight({
    targetAttr: 'href'
});

Answer 1

The fact that you can have nested featherlights is by design.

You can get close the current featherlight with $.featherlight.close(). If you don't want to close the current one but the first one opened you can call:

var all = $.featherlight.opened();
var first = all[0];
first.close()