title: Image not rendering
body: <p>I have this code that doesn't render the image. </p>
  
  <pre><code>import styled from 'styled-components';
  import ImageDiv from '../../shared/Image-div';
  import { sideimage, signin } from '../../../assets/images';
  import device from '../../../config/device';
  
  const LogoDiv = styled(ImageDiv)`
    background-image: url(${signin});
    @media ${device.mobileS} {
      background-image: url(${sideimage});
    }
  `;
  export default LogoDiv;
  </code></pre>
  
  <p>Rendered code:</p>
  
  <pre><code>import React from 'react';
  import { sideimage } from '../../../assets/images';
  import SignUpButton from './sign-up-button';
  import Input from '../../shared/Input-field';
  import LogoDiv from '../../shared/Image-div';
  import FormDiv from '../../shared/Sign-in-div';
  import { NunitoItalic18, Nunito20 } from '../../shared/nunito/nunito';
  import ImageContainer from '../../shared/image-container';
  import ScreenDiv from '../../shared/screen-div';
  
  type Props = {
    setDisplayScreen: Function,
  };
  
  const marginInputPercentage = '4.3%';
  const marginTopPercentage = '12.3%';
  const buttonMarginPercentage = '6.7%';
  
  const SignIn = ({ setDisplayScreen }: Props) =&gt; (
    &lt;ScreenDiv&gt;
      &lt;ImageContainer&gt;
        &lt;LogoDiv /&gt;
      &lt;/ImageContainer&gt;
  
  );
  
  export default SignIn;
  </code></pre>
  
  <p>This is the code base being used for the assignment.</p>
  
  <p>Code for <code>assets/images</code></p>
  
  <pre><code>import logo from './qiisologo/qiiso.png'; 
  import signup from './signup/signup.png'; 
  import signin from './signin/signin.jpg'; 
  import sideimage from './signin/sideimage.jpg'; 
  
  export { logo, signup, signin, sideimage };
  </code></pre>
  
  <p>Am I using a wrong syntax, because the image doesn't render? Thank you.</p>