Modal No Background Frame

Frames are only ever used for other elements. They are never used directly as is. The only exception to that rule are the page frames. Refer to the info Tab to see where they are used. 
<div class="sds-modal -noBg modal fade" tabindex="-1" id="" aria-hidden="true">
    <div class="sds-modal__headerOutside container d-flex justify-content-end">
        <button type="button" class="sds-btn -iconBtn -btnSecondary sds-modal__close" data-dismiss="modal" aria-label="Close">

            <span class="sds-icon sds-icon-close"></span>

        </button>
    </div>
    <div class="sds-modal__dialog modal-dialog modal-dialog-centered">
        <div class="sds-modal__content modal-content bg-transparent">
            <!-- content start -->

            <!-- content end -->
        </div>
    </div>
</div>
 
<div class="{{ namespace }}modal -noBg modal fade" tabindex="-1" id="{{ modalID }}" aria-hidden="true">
	<div class="{{ namespace }}modal__headerOutside container d-flex justify-content-end">
		{% render "@icon-btn-secondary",{
			icon: "icon-close",
			classes: [namespace + "modal__close"],
			attrs: {
				"data-dismiss": "modal",
				"aria-label": "Close"
			}
		},true %}
	</div>
	<div class="{{ namespace }}modal__dialog modal-dialog modal-dialog-centered{% for mod in dialogModifiers %} {{ mod }}{% endfor %}">
		<div class="{{ namespace }}modal__content modal-content bg-transparent">
			<!-- content start -->
			{% block content %}
			{% endblock %}
			<!-- content end -->
		</div>
	</div>
</div>