Files
django-admin-interface/admin_interface/templates/admin_interface/css/related-modal.css
T
2019-03-20 17:53:03 +01:00

85 lines
2.8 KiB
CSS

/*
related modal + magnific popup customization
https://github.com/dimsemenov/Magnific-Popup
*/
.admin-interface .related-modal.mfp-bg {
background-color: {{ theme.related_modal_background_color }};
opacity: {{ theme.related_modal_background_opacity }};
}
.admin-interface .related-modal .mfp-content {
height: 100%;
-webkit-box-shadow: 0px 5px 30px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 5px 30px 0px rgba(0,0,0,0.2);
box-shadow: 0px 5px 30px 0px rgba(0,0,0,0.2);
}
.admin-interface .related-modal .mfp-container {
padding: 80px 80px 80px 80px;
}
.admin-interface .related-modal__nested .mfp-container {
padding: 40px 80px 40px 80px;
}
@media (max-width:640px){
.admin-interface .related-modal .mfp-container {
padding: 80px 20px 80px 20px;
}
.admin-interface .related-modal__nested .mfp-container {
padding: 40px 40px 40px 40px;
}
}
@media (max-height:640px){
.admin-interface .related-modal .mfp-container {
padding-top: 20px;
padding-bottom: 20px;
}
.admin-interface .related-modal__nested .mfp-container {
padding: 40px 40px 40px 40px;
}
}
.admin-interface .related-modal .related-modal-iframe-container {
display: block;
width: 100%;
height: 100%;
position: relative;
z-index: 100;
overflow: hidden;
{% if theme.related_modal_rounded_corners %}
border-radius: 4px;
{% endif %}
}
.admin-interface .related-modal #related-modal-iframe {
width: 100%;
height: 100%;
background-color: #FFFFFF;
background-repeat: no-repeat;
background-position: center center;
background-size: 30px 30px;
background-image: url("data:image/svg+xml;utf8,<?xml version='1.0' encoding='utf-8'?><svg width='30px' height='30px' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid' class='uil-ring-alt'><rect x='0' y='0' width='100' height='100' fill='none' class='bk'></rect><circle cx='50' cy='50' r='40' stroke='%23eeeeee' fill='none' stroke-width='6' stroke-linecap='round'></circle><circle cx='50' cy='50' r='40' stroke='%23aaaaaa' fill='none' stroke-width='6' stroke-linecap='round'><animate attributeName='stroke-dashoffset' dur='2s' repeatCount='indefinite' from='0' to='500'></animate><animate attributeName='stroke-dasharray' dur='2s' repeatCount='indefinite' values='150 100;1 250;150 100'></animate></circle></svg>");
border: none;
margin: 0 auto;
padding: 0;
display: block;
}
.admin-interface .related-modal .mfp-close {
width: 40px;
height: 40px;
opacity: 1.0;
color: rgba(0, 0, 0, 0.4);
{% if not theme.related_modal_close_button_visible %}
display: none;
{% endif %}
}
.admin-interface .related-modal .mfp-close:hover,
.admin-interface .related-modal .mfp-close:active {
color: rgba(0, 0, 0, 0.6);
top: 0;
}