diff --git a/html_generator.php b/html_generator.php index 4796f2e..36d5635 100644 --- a/html_generator.php +++ b/html_generator.php @@ -154,7 +154,7 @@ $modal_html = "
" . PHP_EOL . "
" . PHP_EOL . - " ×" . PHP_EOL . + " ×" . PHP_EOL . " " . $img_elem . PHP_EOL . "
" . PHP_EOL . "
" . PHP_EOL; diff --git a/output/script.js b/output/script.js index 1b446ab..6cc61b6 100644 --- a/output/script.js +++ b/output/script.js @@ -11,6 +11,12 @@ function displayQRModal(communityID) { modal.style.display = "block"; } +function hideQRModal(communityID) { + var modalID = "modal_" + communityID; + modal = document.getElementById(modalID); + modal.style.display = "none"; +} + function createJoinLinkButtons() { elements = document.getElementsByClassName("td_join_url"); Array.from(elements).forEach((td_element) => { diff --git a/output/styles.css b/output/styles.css index 30d4bc9..5f99f35 100644 --- a/output/styles.css +++ b/output/styles.css @@ -47,15 +47,31 @@ body { background-color: var(--session-classic-da display: none; /* Hidden by default */ position: fixed; /* Stay in place */ z-index: 1; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + padding-top: 100px; /* Location of the box */ + /*overflow: auto;*/ /* Enable scroll if needed */ + /*background-color: rgb(0,0,0);*/ /* Fallback color */ + /*background-color: rgba(0,0,0,0.4);*/ /* Black w/ opacity */ } .qr-code-modal-content { + background-color: #ffffff; + border: 1px solid #000000; + width:80%; + margin: auto; + padding: 20px; } .qr-code-modal-close { float: right; - font-size: 28px; + font-size: 32px; font-weight: bold; + color: #aaaaaa; } .qr-code-modal-close:hover, .qr-code-modal-close:focus { cursor: pointer; + text-decoration: none; + color: #000000; }