Removed Semantic UI React

website/src/Users/Users.js

@@ -1,10 +1,10 @@
 import React from 'react'
-import { Container, Grid } from 'semantic-ui-react'
 import { autoBind } from 'auto-bind2'
 import { UserList } from './UserList'
 import { UserForm } from './UserForm'
 import { UserFormPlaceholder } from './UserFormPlaceholder'
 import { api } from '../helpers'
+import { RowLayout } from '../ui'
 import { YesNoMessageDialog, MessageDialog, ChangeEmailDialog, WaitDialog } from '../Dialog'
 
 export class Users extends React.Component {
@@ -237,19 +237,19 @@ export class Users extends React.Component {
 
   render() {
     return (
-      <Container>
+      <div>
         <div>Users</div>
 
-        <Grid stackable>
+        <RowLayout>
           {/* User List - Displayed on left hand side. */}
-          <Grid.Column width={5}>
+          <RowLayout.Item width={5}>
             <UserList users={this.state.users} selectedUser={this.state.selectedUser}
               selectionModified={this.state.modified} onUserListClick={this.handleUserListClick}
               onAddNewUser={this.handleAddNewUser} />
-          </Grid.Column>
+          </RowLayout.Item>
 
           {/* User Info - Displayed on right hand side. */}
-          <Grid.Column width={11}>
+          <RowLayout.Item>
             {
               this.state.selectedUser
               ? <UserForm user={this.state.selectedUser} onSave={this.handleSave}
@@ -257,8 +257,8 @@ export class Users extends React.Component {
                 onChangeEmail={this.handleChangeEmail} onResendEmail={this.handleResendEmail} />
               : <UserFormPlaceholder />
             }
-          </Grid.Column>
-        </Grid>
+          </RowLayout.Item>
+        </RowLayout>
 
         <ChangeEmailDialog open={!!this.state.changeEmailDialog} onDismiss={this.handleChangeEmailDismiss} />
 
@@ -275,7 +275,7 @@ export class Users extends React.Component {
           onDismiss={this.handleMessageDialogDismiss} />
 
         <WaitDialog active={!!this.state.waitDialog} message={this.state.waitDialog ? this.state.waitDialog.message : ''} />
-      </Container>
+      </div>
     )
   }
 }