Popup windows
There are numerous popup windows used in the template. For the sake of convenience, all of them are listed on a separate page Popup-Windows.html.
We have used standard Bootstrap popups in the template. Stylesheet for all popup windows are taken out into a separate file ..sass/blocks/popup-windows.scss.
Creating a popup and connecting it to a page element
Bootstrap popup windows have a parent element with class 'modal' and unique '#id' for each window. This element serves as a wrapper for the window. The window itself has a parent element with class 'modal-dialog', it is located inside the wrapper with class 'modal'. Example:
<div class="modal fade" id="update-header-photo">
<div class="modal-dialog ui-block window-popup update-header-photo">
.....................................
</div>
</div>
RECOMMENDATION: If you want to add some popup window on your page, it is recommended to paste its code, the example of which is shown above, at the bottom of the page right before JS files links.
In order to open a Bootstrap popup window by click on some page element, you need to add the following attributes to that page element:
<a href="#" data-toggle="modal" data-target="#update-header-photo">
where '#update-header-photo' is an id of the required popup window.
