Prototype out glitchy elephant friend. #294.

Glitched elephant friends kindly provided by @ncls7615.

5 files changed, 14 insertions, 1 deletions

diff --git a/app/javascript/flavours/glitch/features/drawer/index.js b/app/javascript/flavours/glitch/features/drawer/index.js
index 9ade1f87a..c8eabb4f3 100644
--- a/app/javascript/flavours/glitch/features/drawer/index.js
+++ b/app/javascript/flavours/glitch/features/drawer/index.js
@@ -2,6 +2,7 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 import ImmutablePropTypes from 'react-immutable-proptypes';
+import classNames from 'classnames';
 
 //  Actions.
 import { openModal } from 'flavours/glitch/actions/modal';
@@ -68,6 +69,12 @@ class Drawer extends React.Component {
       submitted,
     } = this.props;
 
+    let choices = ['mbstobon-bg-1', 'mbstobon-bg-2', 'mbstobon-bg-3'];
+    let glitchyFriendDecision = choices[Math.floor(Math.random() * choices.length)];
+    let drawerAttrs = {
+      className: classNames('contents', glitchyFriendDecision)
+    };
+
     //  The result.
     return (
       <div className='drawer'>
@@ -87,7 +94,7 @@ class Drawer extends React.Component {
           submitted={submitted}
           value={searchValue}
         />
-        <div className='contents'>
+        <div {...drawerAttrs}>
           <DrawerAccount account={account} />
           <Composer />
           <DrawerResults
diff --git a/app/javascript/flavours/glitch/images/mbstobon-ui-1.png b/app/javascript/flavours/glitch/images/mbstobon-ui-1.png
new file mode 100644
index 000000000..25e1707c9
--- /dev/null
+++ b/app/javascript/flavours/glitch/images/mbstobon-ui-1.png
Binary files differdiff --git a/app/javascript/flavours/glitch/images/mbstobon-ui-2.png b/app/javascript/flavours/glitch/images/mbstobon-ui-2.png
new file mode 100644
index 000000000..64cf3cbf3
--- /dev/null
+++ b/app/javascript/flavours/glitch/images/mbstobon-ui-2.png
Binary files differdiff --git a/app/javascript/flavours/glitch/images/mbstobon-ui-3.png b/app/javascript/flavours/glitch/images/mbstobon-ui-3.png
new file mode 100644
index 000000000..b767a9122
--- /dev/null
+++ b/app/javascript/flavours/glitch/images/mbstobon-ui-3.png
Binary files differdiff --git a/app/javascript/flavours/glitch/styles/components/drawer.scss b/app/javascript/flavours/glitch/styles/components/drawer.scss
index 865ab4343..423141aec 100644
--- a/app/javascript/flavours/glitch/styles/components/drawer.scss
+++ b/app/javascript/flavours/glitch/styles/components/drawer.scss
@@ -49,6 +49,12 @@
     overflow-y: auto;
     contain: strict;
   }
+
+  @for $i from 1 through 3 {
+    .mbstobon-bg-#{$i} {
+      background: url("~flavours/glitch/images/mbstobon-ui-#{$i}.png") no-repeat left bottom / contain;
+    }
+  }
 }
 
 .drawer--header {