From cc4593683d3ca001253a220a2a100728e57fd0aa Mon Sep 17 00:00:00 2001
From: makame <makame@mail.ru>
Date: Wed, 4 Mar 2020 13:56:53 +0100
Subject: [PATCH] fix image positioning

---
 style.plugins.js | 16 +++++++---------
 1 file changed, 7 insertions(+), 9 deletions(-)

diff --git a/style.plugins.js b/style.plugins.js
index 2a9f583..502922e 100644
--- a/style.plugins.js
+++ b/style.plugins.js
@@ -279,23 +279,21 @@ async function setFrameStyles(state, shared) {
     if (images[node.id] != null && !Object.keys(props).includes('gbg')) {
       const url = `url(${await loadImageFromImagesToDisk(node, shared)})`;
 
-      if (bounds && Math.abs(bounds.angle) > 0) {
-        const left = (parent.absoluteBoundingBox.width - bounds.width) / 2 / bounds.width;
-        const top = (parent.absoluteBoundingBox.height - bounds.height) / 2 / bounds.height;
+      if (bounds && Math.abs(bounds.angle)) {
+        middleStyle.display = 'flex';
+        middleStyle.justifyContent = 'center';
+        middleStyle.alignItems = 'center';
 
         const afterId = genClassName();
         classNames.push(afterId);
         additionalStyles.push(`
           .${afterId}::after {
-            position: absolute;
             pointer-events: none;
-            left: -${left * 100}%;
-            right: -${left * 100}%;
-            top: -${top * 100}%;
-            bottom: -${top * 100}%;
+            width: ${node.absoluteBoundingBox.width / bounds.width * 100}%;
+            height: ${node.absoluteBoundingBox.height / bounds.height * 100}%;
             content: '';
             background: ${url} center center no-repeat;
-            background-size: contain;
+            background-size: cover;
             transform: rotate(${bounds.angle}deg);
             transform-origin: 50% 50%;
           }