update dialog markup

This commit is contained in:
Mira Weller
2025-05-16 21:01:55 +02:00
parent 34440dcbdd
commit f26c7984dc
5 changed files with 14 additions and 19 deletions

View File

@@ -463,9 +463,9 @@
</div> </div>
</div> </div>
</div> </div>
<div id="ajaxerr"> <div id="ajaxerr" class="modal-wrapper" hidden>
</div> </div>
<div id="loadingmodal"> <div id="loadingmodal" class="modal-wrapper" hidden>
<div class="modal-card"> <div class="modal-card">
<div class="modal-card-icon"> <div class="modal-card-icon">
<i class="fa fa-cog big-rotating-icon"></i> <i class="fa fa-cog big-rotating-icon"></i>

View File

@@ -2,9 +2,9 @@
{% load rich_text %} {% load rich_text %}
{% load safelink %} {% load safelink %}
{% load escapejson %} {% load escapejson %}
<div id="ajaxerr"> <div id="ajaxerr" class="modal-wrapper" hidden>
</div> </div>
<div id="popupmodal" hidden aria-live="polite"> <div id="popupmodal" class="modal-wrapper" hidden aria-live="polite">
<div class="modal-card"> <div class="modal-card">
<div class="modal-card-icon"> <div class="modal-card-icon">
<i class="fa fa-window-restore big-icon" aria-hidden="true"></i> <i class="fa fa-window-restore big-icon" aria-hidden="true"></i>
@@ -30,7 +30,7 @@
</div> </div>
</div> </div>
</div> </div>
<div id="loadingmodal" hidden aria-live="polite"> <div id="loadingmodal" class="modal-wrapper" hidden aria-live="polite">
<div class="modal-card"> <div class="modal-card">
<div class="modal-card-icon"> <div class="modal-card-icon">
<i class="fa fa-cog big-rotating-icon" aria-hidden="true"></i> <i class="fa fa-cog big-rotating-icon" aria-hidden="true"></i>
@@ -50,7 +50,7 @@
{{ cookie_consent_from_widget|json_script:"cookie-consent-from-widget" }} {{ cookie_consent_from_widget|json_script:"cookie-consent-from-widget" }}
{% endif %} {% endif %}
{% if cookie_providers %} {% if cookie_providers %}
<div id="cookie-consent-modal" aria-live="polite"> <div id="cookie-consent-modal" class="modal-wrapper" hidden aria-live="polite">
<div class="modal-card"> <div class="modal-card">
<div class="modal-card-content"> <div class="modal-card-content">
<h3 id="cookie-consent-modal-label"></h3> <h3 id="cookie-consent-modal-label"></h3>

View File

@@ -297,11 +297,11 @@ var waitingDialog = {
$("#loadingmodal .progress").hide(); $("#loadingmodal .progress").hide();
$("#loadingmodal .steps").hide(); $("#loadingmodal .steps").hide();
$("body").addClass("loading"); $("body").addClass("loading");
$("#loadingmodal").removeAttr("hidden"); $("#loadingmodal").removeAttr("hidden has-modal-dialog");
}, },
hide: function () { hide: function () {
"use strict"; "use strict";
$("body").removeClass("loading"); $("body").removeClass("loading has-modal-dialog");
$("#loadingmodal").attr("hidden", true); $("#loadingmodal").attr("hidden", true);
} }
}; };
@@ -312,10 +312,10 @@ var ajaxErrDialog = {
$("#ajaxerr").html(c); $("#ajaxerr").html(c);
$("#ajaxerr .links").html("<a class='btn btn-default ajaxerr-close'>" $("#ajaxerr .links").html("<a class='btn btn-default ajaxerr-close'>"
+ gettext("Close message") + "</a>"); + gettext("Close message") + "</a>");
$("body").addClass("ajaxerr"); $("body").addClass("ajaxerr has-modal-dialog");
}, },
hide: function () { hide: function () {
"use strict"; "use strict";
$("body").removeClass("ajaxerr"); $("body").removeClass("ajaxerr has-modal-dialog");
} }
}; };

View File

@@ -1,4 +1,3 @@
body.has-modal-dialog .container, body.has-modal-dialog #wrapper { body.has-modal-dialog .container, body.has-modal-dialog #wrapper {
-webkit-filter: blur(2px); -webkit-filter: blur(2px);
-moz-filter: blur(2px); -moz-filter: blur(2px);
@@ -14,10 +13,6 @@ body.has-modal-dialog .container, body.has-modal-dialog #wrapper {
color: $brand-primary; color: $brand-primary;
} }
dialog.modal-card::backdrop {
background: rgba(255, 255, 255, .7);
}
.modal-wrapper { .modal-wrapper {
position: fixed; position: fixed;
top: 0; top: 0;

View File

@@ -4,8 +4,6 @@ $(function () {
var popup_window = null var popup_window = null
var popup_check_interval = null var popup_check_interval = null
$("#popupmodal").removeAttr("hidden");
$("a[data-open-in-popup-window]").on("click", function (e) { $("a[data-open-in-popup-window]").on("click", function (e) {
e.preventDefault() e.preventDefault()
@@ -22,11 +20,13 @@ $(function () {
"presale-popup", "presale-popup",
"scrollbars=yes,resizable=yes,status=yes,location=yes,toolbar=no,menubar=no,width=940,height=620,left=50,top=50" "scrollbars=yes,resizable=yes,status=yes,location=yes,toolbar=no,menubar=no,width=940,height=620,left=50,top=50"
) )
$("body").addClass("has-popup") $("body").addClass("has-popup has-modal-dialog")
$("#popupmodal").removeAttr("hidden");
popup_check_interval = window.setInterval(function () { popup_check_interval = window.setInterval(function () {
if (popup_window.closed) { if (popup_window.closed) {
$("body").removeClass("has-popup") $("body").removeClass("has-popup has-modal-dialog")
$("#popupmodal").attr("hidden", true);
window.clearInterval(popup_check_interval) window.clearInterval(popup_check_interval)
} }
}, 250) }, 250)