diff --git a/inc/shaarli.css b/inc/shaarli.css
index 451f048..d6bbdbc 100644
--- a/inc/shaarli.css
+++ b/inc/shaarli.css
@@ -739,25 +739,6 @@ h1 {
background: #ffffff;
}
-div#permalinkQrcode {
- padding: 20px;
- width: 220px;
- height: 220px;
- background-color: #ffffff;
- border: 1px solid black;
- position: absolute;
- top: -100px;
- left: -100px;
- text-align: center;
- font-size: 8pt;
- z-index: 50;
- -webkit-box-shadow: 2px 2px 20px 2px #333333;
- -moz-box-shadow: 2px 2px 20px 2px #333333;
- -o-box-shadow: 2px 2px 20px 2px #333333;
- -ms-box-shadow: 2px 2px 20px 2px #333333;
- box-shadow: 2px 2px 20px 2px #333333;
-}
-
div.daily {
font-family: Georgia, 'DejaVu Serif', Norasi, serif;
background-color: #E6D6BE;
diff --git a/plugins/qrcode/qrcode.css b/plugins/qrcode/qrcode.css
new file mode 100755
index 0000000..0d514a0
--- /dev/null
+++ b/plugins/qrcode/qrcode.css
@@ -0,0 +1,23 @@
+.linkqrcode {
+ display: inline;
+ position: relative;
+}
+
+#permalinkQrcode {
+ position: absolute;
+ z-index: 200;
+ padding: 20px;
+ width: 220px;
+ height: 220px;
+ background-color: #ffffff;
+ border: 1px solid black;
+ top: -110px;
+ left: -110px;
+ text-align: center;
+ font-size: 8pt;
+ box-shadow: 2px 2px 20px 2px #333333;
+}
+
+#permalinkQrcode img {
+ margin-bottom: 5px;
+}
diff --git a/plugins/qrcode/qrcode.html b/plugins/qrcode/qrcode.html
index 58ac500..ffdaf3b 100644
--- a/plugins/qrcode/qrcode.html
+++ b/plugins/qrcode/qrcode.html
@@ -1,3 +1,5 @@
-
-
-
+
diff --git a/plugins/qrcode/qrcode.php b/plugins/qrcode/qrcode.php
index 5f6e76a..a709aba 100644
--- a/plugins/qrcode/qrcode.php
+++ b/plugins/qrcode/qrcode.php
@@ -39,3 +39,19 @@ function hook_qrcode_render_footer($data)
return $data;
}
+
+/**
+ * When linklist is displayed, include qrcode CSS file.
+ *
+ * @param array $data - header data.
+ *
+ * @return mixed - header data with qrcode CSS file added.
+ */
+function hook_qrcode_render_includes($data)
+{
+ if ($data['_PAGE_'] == Router::$PAGE_LINKLIST) {
+ $data['css_files'][] = PluginManager::$PLUGINS_PATH . '/qrcode/qrcode.css';
+ }
+
+ return $data;
+}
diff --git a/plugins/qrcode/shaarli-qrcode.js b/plugins/qrcode/shaarli-qrcode.js
index 0a8de21..615f54c 100644
--- a/plugins/qrcode/shaarli-qrcode.js
+++ b/plugins/qrcode/shaarli-qrcode.js
@@ -19,7 +19,7 @@ function showQrCode(caller,loading)
// Build the div which contains the QR-Code:
var element = document.createElement('div');
- element.id="permalinkQrcode";
+ element.id = 'permalinkQrcode';
// Make QR-Code div commit sepuku when clicked:
if ( element.attachEvent ){
@@ -37,6 +37,12 @@ function showQrCode(caller,loading)
element.appendChild(image);
element.innerHTML += "
Click to close";
caller.parentNode.appendChild(element);
+
+ // Show the QRCode
+ qrcodeImage = document.getElementById('permalinkQrcode');
+ // Workaround to deal with newly created element lag for transition.
+ window.getComputedStyle(qrcodeImage).opacity;
+ qrcodeImage.className = 'show';
}
else
{
@@ -48,7 +54,7 @@ function showQrCode(caller,loading)
// Remove any displayed QR-Code
function removeQrcode()
{
- var elem = document.getElementById("permalinkQrcode");
+ var elem = document.getElementById('permalinkQrcode');
if (elem) {
elem.parentNode.removeChild(elem);
}