diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index 46d030b..1995235 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -31,23 +31,23 @@ jobs:
       fail-fast: false
       matrix:
         include:
-          - php: '8.1'
+          - php: '8.3'
             moodle-branch: 'master'
             database: 'pgsql'
-          - php: '8.0'
+          - php: '8.2'
             moodle-branch: 'master'
             database: 'pgsql'
           - php: '8.1'
-            moodle-branch: 'MOODLE_401_STABLE'
+            moodle-branch: 'master'
             database: 'pgsql'
-          - php: '8.0'
-            moodle-branch: 'MOODLE_401_STABLE'
+          - php: '8.3'
+            moodle-branch: 'MOODLE_404_STABLE'
             database: 'pgsql'
-          - php: '8.1'
-            moodle-branch: 'MOODLE_402_STABLE'
+          - php: '8.3'
+            moodle-branch: 'MOODLE_404_STABLE'
             database: 'pgsql'
-          - php: '8.0'
-            moodle-branch: 'MOODLE_402_STABLE'
+          - php: '8.1'
+            moodle-branch: 'MOODLE_401_STABLE'
             database: 'pgsql'
 
     steps:
diff --git a/db/access.php b/db/access.php
index 8106863..179e190 100644
--- a/db/access.php
+++ b/db/access.php
@@ -30,10 +30,10 @@
         'captype' => 'write',
         'contextlevel' => CONTEXT_SYSTEM,
         'archetypes' => array(
-            'user' => CAP_ALLOW
+            'user' => CAP_ALLOW,
         ),
 
-        'clonepermissionsfrom' => 'moodle/my:manageblocks'
+        'clonepermissionsfrom' => 'moodle/my:manageblocks',
     ),
 
     'block/qr:addinstance' => array(
@@ -43,9 +43,9 @@
         'contextlevel' => CONTEXT_BLOCK,
         'archetypes' => array(
             'editingteacher' => CAP_ALLOW,
-            'manager' => CAP_ALLOW
+            'manager' => CAP_ALLOW,
         ),
 
-        'clonepermissionsfrom' => 'moodle/site:manageblocks'
+        'clonepermissionsfrom' => 'moodle/site:manageblocks',
     ),
 );
diff --git a/edit_form.php b/edit_form.php
index d94f7e1..599a9a9 100644
--- a/edit_form.php
+++ b/edit_form.php
@@ -222,7 +222,7 @@ protected function specific_definition($mform) {
         $sizeoptions = [
             QR_SIZE_SMALL => get_string('small', 'block_qr'),
             QR_SIZE_MEDIUM => get_string('medium', 'block_qr'),
-            QR_SIZE_LARGE => get_string('large', 'block_qr')
+            QR_SIZE_LARGE => get_string('large', 'block_qr'),
         ];
         $selectsize = $mform->addElement(
             'select',
diff --git a/lang/de/block_qr.php b/lang/de/block_qr.php
index aadaa0a..c2f4a8f 100644
--- a/lang/de/block_qr.php
+++ b/lang/de/block_qr.php
@@ -45,6 +45,7 @@
 $string['event_start'] = 'Startdatum';
 $string['event_summary'] = 'Titel';
 $string['externalurl'] = 'URL';
+$string['fullscreen'] = 'Im Vollbild anzeigen';
 $string['geo'] = 'Geo';
 $string['geolocation'] = 'Geokoordinaten (Breite/Länge)';
 $string['internalcontent'] = 'Link zu einem Abschnitt oder Aktivität';
diff --git a/lang/en/block_qr.php b/lang/en/block_qr.php
index df8fc9b..e0645e1 100644
--- a/lang/en/block_qr.php
+++ b/lang/en/block_qr.php
@@ -45,6 +45,7 @@
 $string['event_start'] = 'Start date';
 $string['event_summary'] = 'Title';
 $string['externalurl'] = 'URL';
+$string['fullscreen'] = 'Show in full screen';
 $string['geo'] = 'Geo';
 $string['geolocation'] = 'Geolocation (lat/lon)';
 $string['internalcontent'] = 'Link to a section or activity';
diff --git a/templates/qr.mustache b/templates/qr.mustache
index 6902d57..a9d01e4 100644
--- a/templates/qr.mustache
+++ b/templates/qr.mustache
@@ -55,6 +55,11 @@
 {{#qrurl}}
     </a>
 {{/qrurl}}
+    <div class="text-center">
+        <button class="btn btn-secondary" id="qrcodeModalButton{{id}}">{{#str}}
+                fullscreen, block_qr
+            {{/str}}</button>
+    </div>
 <hr>
 {{^calendar}}
     <p class="text-center">{{description}}<br></p>
@@ -90,36 +95,38 @@
 {{#wifissid}}
     <p class="text-left">
         <b>
-        {{#str}}
-            ssid_label, block_qr
-        {{/str}}: </b>{{{wifissid}}}<br><b>
-        {{#str}}
-            config_wifiauthentication, block_qr
-        {{/str}}: </b> {{{wifiauthentication}}}<br><b>
-        {{#str}}
-            passkey_label, block_qr
-        {{/str}}: </b> {{{wifipasskey}}}<br>
+            {{#str}}
+                ssid_label, block_qr
+            {{/str}}: </b>{{{wifissid}}}<br><b>
+            {{#str}}
+                config_wifiauthentication, block_qr
+            {{/str}}: </b> {{{wifiauthentication}}}<br><b>
+            {{#str}}
+                passkey_label, block_qr
+            {{/str}}: </b> {{{wifipasskey}}}<br>
     </p>
 {{/wifissid}}
 
-
 {{#fullview}}
 {{#configshortlink}}
     <p class="text-center">
         <i class="fa fa-location-arrow"></i>
         <a href="{{urlshort}}" target="_blank">
-        {{#str}}
-            urlshortlabel, block_qr
-        {{/str}}
+            {{#str}}
+                urlshortlabel, block_qr
+            {{/str}}
         </a>
     </p>
-{{/configshortlink}}
+    {{/configshortlink}}
 {{/fullview}}
+<div style="width: 100%;text-align: center">
+</div>
 {{#qrcodecontent}}
     <script src="{{javascript}}"></script>
     {{#js}}
         if (typeof QRCode !== 'undefined') {
-        let config{{id}} = {
+            // Configuration for QR Code
+            let config{{id}} = {
             content: "{{{qrcodecontent}}}",
             color: "#000000",
             background: "#ffffff",
@@ -127,10 +134,17 @@
             container: "svg-viewbox", // Responsive use.
             join: true // Crisp rendering and 4-5x reduced file size.
         };
-        // eslint-disable-next-line no-undef
+
         let qrcode{{id}} = new QRCode(config{{id}});
         let svg{{id}} = qrcode{{id}}.svg();
         document.getElementById("container{{id}}").innerHTML = svg{{id}};
+        // Add event listener to button
+        document.getElementById("qrcodeModalButton{{id}}").addEventListener("click", () => {
+        // Creating the modal with the QR code content inside the button click event
+        require(['core/modal'], (MF) => {
+        MF.create({title: '{{{description}}}', body: svg{{id}}}).then((modal) => modal.show());
+        });
+        });
         }
     {{/js}}
 {{/qrcodecontent}}
diff --git a/version.php b/version.php
index fe7cf8e..de0aede 100644
--- a/version.php
+++ b/version.php
@@ -26,7 +26,7 @@
 defined('MOODLE_INTERNAL') || die();
 
 $plugin->release = 'v0.0.1';
-$plugin->version   = 2024012900;         // The current plugin version (Date: YYYYMMDDXX).
+$plugin->version   = 2024071300;         // The current plugin version (Date: YYYYMMDDXX).
 $plugin->requires  = 2022041200;         // Requires this Moodle version.
 $plugin->component = 'block_qr';         // Full name of the plugin (used for diagnostics).
 $plugin->maturity = MATURITY_BETA;      // This is considered as ready for production sites.