Prototype out glitchy elephant friend. #294.

Glitched elephant friends kindly provided by @ncls7615.

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

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 {