about summary refs log tree commit diff
path: root/app/javascript/flavours/glitch/features/drawer/search/popout/index.js
diff options
context:
space:
mode:
Diffstat (limited to 'app/javascript/flavours/glitch/features/drawer/search/popout/index.js')
-rw-r--r--app/javascript/flavours/glitch/features/drawer/search/popout/index.js99
1 files changed, 52 insertions, 47 deletions
diff --git a/app/javascript/flavours/glitch/features/drawer/search/popout/index.js b/app/javascript/flavours/glitch/features/drawer/search/popout/index.js
index b5ea86ff1..6219f46ca 100644
--- a/app/javascript/flavours/glitch/features/drawer/search/popout/index.js
+++ b/app/javascript/flavours/glitch/features/drawer/search/popout/index.js
@@ -42,56 +42,61 @@ export default function DrawerSearchPopout ({ style }) {
 
   //  The result.
   return (
-    <Motion
-      defaultStyle={{
-        opacity: 0,
-        scaleX: 0.85,
-        scaleY: 0.75,
-      }}
+    <div
+      className='drawer--search--popout'
       style={{
-        opacity: motionSpring,
-        scaleX: motionSpring,
-        scaleY: motionSpring,
+        ...style,
+        position: 'absolute',
+        width: 285,
       }}
     >
-      {({ opacity, scaleX, scaleY }) => (
-        <div
-          className='drawer--search--popout'
-          style={{
-            ...style,
-            position: 'absolute',
-            width: 285,
-            opacity: opacity,
-            transform: `scale(${scaleX}, ${scaleY})`,
-          }}
-        >
-          <h4><FormattedMessage {...messages.format} /></h4>
-          <ul>
-            <li>
-              <em>#example</em>
-              {' '}
-              <FormattedMessage {...messages.hashtag} />
-            </li>
-            <li>
-              <em>@username@domain</em>
-              {' '}
-              <FormattedMessage {...messages.user} />
-            </li>
-            <li>
-              <em>URL</em>
-              {' '}
-              <FormattedMessage {...messages.user} />
-            </li>
-            <li>
-              <em>URL</em>
-              {' '}
-              <FormattedMessage {...messages.status} />
-            </li>
-          </ul>
-          <FormattedMessage {...messages.text} />
-        </div>
-      )}
-    </Motion>
+      <Motion
+        defaultStyle={{
+          opacity: 0,
+          scaleX: 0.85,
+          scaleY: 0.75,
+        }}
+        style={{
+          opacity: motionSpring,
+          scaleX: motionSpring,
+          scaleY: motionSpring,
+        }}
+      >
+        {({ opacity, scaleX, scaleY }) => (
+          <div
+            style={{
+              opacity: opacity,
+              transform: `scale(${scaleX}, ${scaleY})`,
+            }}
+          >
+            <h4><FormattedMessage {...messages.format} /></h4>
+            <ul>
+              <li>
+                <em>#example</em>
+                {' '}
+                <FormattedMessage {...messages.hashtag} />
+              </li>
+              <li>
+                <em>@username@domain</em>
+                {' '}
+                <FormattedMessage {...messages.user} />
+              </li>
+              <li>
+                <em>URL</em>
+                {' '}
+                <FormattedMessage {...messages.user} />
+              </li>
+              <li>
+                <em>URL</em>
+                {' '}
+                <FormattedMessage {...messages.status} />
+              </li>
+            </ul>
+            <FormattedMessage {...messages.text} />
+          </div>
+        )}
+      </Motion>
+    </div>
   );
 }