Login screen looking good

website/src/Users/UserFormPlaceholder.js

@@ -1,5 +1,4 @@
 import React from 'react'
-import './UserFormPlaceholder.scss'
 
 export const UserFormPlaceholder = () => (
   <div className='user-form-placeholder'>

website/src/Users/UserFormPlaceholder.scss

@@ -1,7 +0,0 @@
-.user-form-placeholder {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  height: 100%;
-}

website/src/Users/ValidatedEmailIcon.js

@@ -1,7 +1,6 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { Label, Button, Icon } from 'ui'
-import './ValidatedEmailIcon.scss'
+import { Text, Button, Icon } from 'ui'
 
 // This is a validated component with a value that cannot change itself and is specialized
 
@@ -28,15 +27,14 @@ export class ValidatedEmailIcon extends React.Component {
     if (this.state.value) {
       return (
         <div width={this.props.width}>
-          <Label>&nbsp;
-            <Icon name='mail' color='green' size='big' className='mail-validated-icon' />
-          </Label>
+          <Text>&nbsp;</Text>
+          <Icon name='mail' color='green' size='big' className='mail-validated-icon' />
         </div>
       )
     } else {
       return (
         <div width={this.props.width}>
-          <Label>&nbsp;</Label>
+          <Text>&nbsp;</Text>
           <Button fluid icon='mail outline' color='red' labelPosition='left'
             content='Resend Email' onClick={this.props.onClick} disabled={this.state.disabled} />
         </div>

website/src/Users/ValidatedEmailIcon.scss

@@ -1,3 +0,0 @@
-.mail-validated-icon {
-  padding-top: 4px;
-}