diff --git a/app/components/custom_list/channel_list_row/channel_list_row.js b/app/components/custom_list/channel_list_row/channel_list_row.js
index 7d2ef8848..5375d71e7 100644
--- a/app/components/custom_list/channel_list_row/channel_list_row.js
+++ b/app/components/custom_list/channel_list_row/channel_list_row.js
@@ -43,7 +43,6 @@ export default class ChannelListRow extends React.PureComponent {
         return (
             <CustomListRow
                 id={this.props.id}
-                theme={this.props.theme}
                 onPress={this.props.onPress ? this.onPress : null}
                 enabled={this.props.enabled}
                 selectable={this.props.selectable}
@@ -84,6 +83,7 @@ const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
         container: {
             flex: 1,
             flexDirection: 'column',
+            paddingHorizontal: 15,
         },
         purpose: {
             marginTop: 7,
diff --git a/app/components/custom_list/custom_list_row.js b/app/components/custom_list/custom_list_row.js
index 7650dbf09..7212bbcae 100644
--- a/app/components/custom_list/custom_list_row.js
+++ b/app/components/custom_list/custom_list_row.js
@@ -4,17 +4,16 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 import {
+    StyleSheet,
     View,
 } from 'react-native';
 import Icon from 'react-native-vector-icons/FontAwesome';
 
 import ConditionalTouchable from 'app/components/conditional_touchable';
 import CustomPropTypes from 'app/constants/custom_prop_types';
-import {makeStyleSheetFromTheme} from 'app/utils/theme';
 
 export default class CustomListRow extends React.PureComponent {
     static propTypes = {
-        theme: PropTypes.object.isRequired,
         onPress: PropTypes.func,
         enabled: PropTypes.bool,
         selectable: PropTypes.bool,
@@ -28,12 +27,11 @@ export default class CustomListRow extends React.PureComponent {
     };
 
     render() {
-        const style = getStyleFromTheme(this.props.theme);
-
         return (
             <ConditionalTouchable
                 touchable={Boolean(this.props.enabled && this.props.onPress)}
                 onPress={this.props.onPress}
+                style={style.touchable}
             >
                 <View style={style.container}>
                     {this.props.selectable &&
@@ -58,40 +56,40 @@ export default class CustomListRow extends React.PureComponent {
     }
 }
 
-const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
-    return {
-        container: {
-            flexDirection: 'row',
-            height: 65,
-            paddingHorizontal: 15,
-            alignItems: 'center',
-            backgroundColor: theme.centerChannelBg,
-        },
-        children: {
-            flexDirection: 'row',
-        },
-        selector: {
-            height: 28,
-            width: 28,
-            borderRadius: 14,
-            borderWidth: 1,
-            borderColor: '#888',
-            alignItems: 'center',
-            justifyContent: 'center',
-        },
-        selectorContainer: {
-            flex: 1,
-            height: 50,
-            paddingRight: 15,
-            alignItems: 'center',
-            justifyContent: 'center',
-        },
-        selectorDisabled: {
-            backgroundColor: '#888',
-        },
-        selectorFilled: {
-            backgroundColor: '#378FD2',
-            borderWidth: 0,
-        },
-    };
+const style = StyleSheet.create({
+    touchable: {
+        flex: 1,
+    },
+    container: {
+        flexDirection: 'row',
+        height: 65,
+        flex: 1,
+        alignItems: 'center',
+    },
+    children: {
+        flex: 1,
+        flexDirection: 'row',
+    },
+    selector: {
+        height: 28,
+        width: 28,
+        borderRadius: 14,
+        borderWidth: 1,
+        borderColor: '#888',
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    selectorContainer: {
+        height: 50,
+        paddingRight: 10,
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    selectorDisabled: {
+        backgroundColor: '#888',
+    },
+    selectorFilled: {
+        backgroundColor: '#378FD2',
+        borderWidth: 0,
+    },
 });
diff --git a/app/components/custom_list/option_list_row/option_list_row.js b/app/components/custom_list/option_list_row/option_list_row.js
index 48dfc17fa..8b9cb38bf 100644
--- a/app/components/custom_list/option_list_row/option_list_row.js
+++ b/app/components/custom_list/option_list_row/option_list_row.js
@@ -44,7 +44,6 @@ export default class OptionListRow extends React.PureComponent {
         return (
             <CustomListRow
                 id={value}
-                theme={theme}
                 onPress={this.onPress}
                 enabled={enabled}
                 selectable={selectable}
diff --git a/app/components/custom_list/user_list_row/__snapshots__/user_list_test.test.js.snap b/app/components/custom_list/user_list_row/__snapshots__/user_list_test.test.js.snap
index 2e1519289..9e83da0b4 100644
--- a/app/components/custom_list/user_list_row/__snapshots__/user_list_test.test.js.snap
+++ b/app/components/custom_list/user_list_row/__snapshots__/user_list_test.test.js.snap
@@ -6,7 +6,7 @@ exports[`UserListRow should match snapshot 1`] = `
     Object {
       "flex": 1,
       "flexDirection": "row",
-      "marginLeft": 10,
+      "marginHorizontal": 10,
     }
   }
 >
@@ -14,41 +14,13 @@ exports[`UserListRow should match snapshot 1`] = `
     enabled={true}
     id="21345"
     onPress={[Function]}
-    theme={
-      Object {
-        "awayIndicator": "#ffbc42",
-        "buttonBg": "#166de0",
-        "buttonColor": "#ffffff",
-        "centerChannelBg": "#ffffff",
-        "centerChannelColor": "#3d3c40",
-        "codeTheme": "github",
-        "dndIndicator": "#f74343",
-        "errorTextColor": "#fd5960",
-        "linkColor": "#2389d7",
-        "mentionBj": "#ffffff",
-        "mentionColor": "#145dbf",
-        "mentionHighlightBg": "#ffe577",
-        "mentionHighlightLink": "#166de0",
-        "newMessageSeparator": "#ff8800",
-        "onlineIndicator": "#06d6a0",
-        "sidebarBg": "#145dbf",
-        "sidebarHeaderBg": "#1153ab",
-        "sidebarHeaderTextColor": "#ffffff",
-        "sidebarText": "#ffffff",
-        "sidebarTextActiveBorder": "#579eff",
-        "sidebarTextActiveColor": "#ffffff",
-        "sidebarTextHoverBg": "#4578bf",
-        "sidebarUnreadText": "#ffffff",
-        "type": "Mattermost",
-      }
-    }
   >
     <Component
       style={
         Object {
+          "alignItems": "center",
           "color": "#3d3c40",
           "flexDirection": "row",
-          "marginLeft": 10,
         }
       }
     >
@@ -59,14 +31,12 @@ exports[`UserListRow should match snapshot 1`] = `
     </Component>
     <Component
       style={
-        Array [
-          Object {
-            "marginLeft": 5,
-          },
-          Object {
-            "justifyContent": "center",
-          },
-        ]
+        Object {
+          "flex": 1,
+          "flexDirection": "column",
+          "justifyContent": "center",
+          "marginLeft": 10,
+        }
       }
     >
       <Component>
@@ -84,13 +54,6 @@ exports[`UserListRow should match snapshot 1`] = `
         </Component>
       </Component>
     </Component>
-    <Component
-      style={
-        Object {
-          "width": 25,
-        }
-      }
-    />
   </CustomListRow>
 </Component>
 `;
@@ -101,7 +64,7 @@ exports[`UserListRow should match snapshot for  currentUser with (you) populated
     Object {
       "flex": 1,
       "flexDirection": "row",
-      "marginLeft": 10,
+      "marginHorizontal": 10,
     }
   }
 >
@@ -109,41 +72,13 @@ exports[`UserListRow should match snapshot for  currentUser with (you) populated
     enabled={true}
     id="21345"
     onPress={[Function]}
-    theme={
-      Object {
-        "awayIndicator": "#ffbc42",
-        "buttonBg": "#166de0",
-        "buttonColor": "#ffffff",
-        "centerChannelBg": "#ffffff",
-        "centerChannelColor": "#3d3c40",
-        "codeTheme": "github",
-        "dndIndicator": "#f74343",
-        "errorTextColor": "#fd5960",
-        "linkColor": "#2389d7",
-        "mentionBj": "#ffffff",
-        "mentionColor": "#145dbf",
-        "mentionHighlightBg": "#ffe577",
-        "mentionHighlightLink": "#166de0",
-        "newMessageSeparator": "#ff8800",
-        "onlineIndicator": "#06d6a0",
-        "sidebarBg": "#145dbf",
-        "sidebarHeaderBg": "#1153ab",
-        "sidebarHeaderTextColor": "#ffffff",
-        "sidebarText": "#ffffff",
-        "sidebarTextActiveBorder": "#579eff",
-        "sidebarTextActiveColor": "#ffffff",
-        "sidebarTextHoverBg": "#4578bf",
-        "sidebarUnreadText": "#ffffff",
-        "type": "Mattermost",
-      }
-    }
   >
     <Component
       style={
         Object {
+          "alignItems": "center",
           "color": "#3d3c40",
           "flexDirection": "row",
-          "marginLeft": 10,
         }
       }
     >
@@ -154,14 +89,12 @@ exports[`UserListRow should match snapshot for  currentUser with (you) populated
     </Component>
     <Component
       style={
-        Array [
-          Object {
-            "marginLeft": 5,
-          },
-          Object {
-            "justifyContent": "center",
-          },
-        ]
+        Object {
+          "flex": 1,
+          "flexDirection": "column",
+          "justifyContent": "center",
+          "marginLeft": 10,
+        }
       }
     >
       <Component>
@@ -177,13 +110,6 @@ exports[`UserListRow should match snapshot for  currentUser with (you) populated
         />
       </Component>
     </Component>
-    <Component
-      style={
-        Object {
-          "width": 25,
-        }
-      }
-    />
   </CustomListRow>
 </Component>
 `;
@@ -194,7 +120,7 @@ exports[`UserListRow should match snapshot for deactivated user 1`] = `
     Object {
       "flex": 1,
       "flexDirection": "row",
-      "marginLeft": 10,
+      "marginHorizontal": 10,
     }
   }
 >
@@ -202,41 +128,13 @@ exports[`UserListRow should match snapshot for deactivated user 1`] = `
     enabled={true}
     id="21345"
     onPress={[Function]}
-    theme={
-      Object {
-        "awayIndicator": "#ffbc42",
-        "buttonBg": "#166de0",
-        "buttonColor": "#ffffff",
-        "centerChannelBg": "#ffffff",
-        "centerChannelColor": "#3d3c40",
-        "codeTheme": "github",
-        "dndIndicator": "#f74343",
-        "errorTextColor": "#fd5960",
-        "linkColor": "#2389d7",
-        "mentionBj": "#ffffff",
-        "mentionColor": "#145dbf",
-        "mentionHighlightBg": "#ffe577",
-        "mentionHighlightLink": "#166de0",
-        "newMessageSeparator": "#ff8800",
-        "onlineIndicator": "#06d6a0",
-        "sidebarBg": "#145dbf",
-        "sidebarHeaderBg": "#1153ab",
-        "sidebarHeaderTextColor": "#ffffff",
-        "sidebarText": "#ffffff",
-        "sidebarTextActiveBorder": "#579eff",
-        "sidebarTextActiveColor": "#ffffff",
-        "sidebarTextHoverBg": "#4578bf",
-        "sidebarUnreadText": "#ffffff",
-        "type": "Mattermost",
-      }
-    }
   >
     <Component
       style={
         Object {
+          "alignItems": "center",
           "color": "#3d3c40",
           "flexDirection": "row",
-          "marginLeft": 10,
         }
       }
     >
@@ -247,14 +145,12 @@ exports[`UserListRow should match snapshot for deactivated user 1`] = `
     </Component>
     <Component
       style={
-        Array [
-          Object {
-            "marginLeft": 5,
-          },
-          Object {
-            "justifyContent": "center",
-          },
-        ]
+        Object {
+          "flex": 1,
+          "flexDirection": "column",
+          "justifyContent": "center",
+          "marginLeft": 10,
+        }
       }
     >
       <Component>
@@ -267,16 +163,22 @@ exports[`UserListRow should match snapshot for deactivated user 1`] = `
               "fontSize": 15,
             }
           }
+        >
+          @user
+        </Component>
+      </Component>
+      <Component>
+        <Component
+          style={
+            Object {
+              "color": undefined,
+              "fontSize": 12,
+              "marginTop": 2,
+            }
+          }
         />
       </Component>
     </Component>
-    <Component
-      style={
-        Object {
-          "width": 25,
-        }
-      }
-    />
   </CustomListRow>
 </Component>
 `;
diff --git a/app/components/custom_list/user_list_row/user_list_row.js b/app/components/custom_list/user_list_row/user_list_row.js
index d411c93a3..68f6b08fa 100644
--- a/app/components/custom_list/user_list_row/user_list_row.js
+++ b/app/components/custom_list/user_list_row/user_list_row.js
@@ -58,13 +58,6 @@ export default class UserListRow extends React.PureComponent {
             }, {username});
         }
 
-        if (user.delete_at > 0) {
-            usernameDisplay = formatMessage({
-                id: 'more_direct_channels.directchannel.deactivated',
-                defaultMessage: '{displayname} - Deactivated',
-            }, {displayname: usernameDisplay});
-        }
-
         const teammateDisplay = displayUsername(user, teammateNameDisplay);
         const showTeammateDisplay = teammateDisplay !== username;
 
@@ -72,7 +65,6 @@ export default class UserListRow extends React.PureComponent {
             <View style={style.container}>
                 <CustomListRow
                     id={id}
-                    theme={theme}
                     onPress={this.onPress}
                     enabled={enabled}
                     selectable={selectable}
@@ -84,7 +76,7 @@ export default class UserListRow extends React.PureComponent {
                             size={32}
                         />
                     </View>
-                    <View style={[style.textContainer, (showTeammateDisplay ? style.showTeammateDisplay : style.hideTeammateDisplay)]}>
+                    <View style={style.textContainer}>
                         <View>
                             <Text
                                 style={style.username}
@@ -105,8 +97,16 @@ export default class UserListRow extends React.PureComponent {
                             </Text>
                         </View>
                         }
+                        {user.delete_at > 0 &&
+                        <View>
+                            <Text
+                                style={style.deactivated}
+                            >
+                                {formatMessage({id: 'mobile.user_list.deactivated', defaultMessage: 'Deactivated'})}
+                            </Text>
+                        </View>
+                        }
                     </View>
-                    <View style={style.rightFiller}/>
                 </CustomListRow>
             </View>
         );
@@ -118,23 +118,19 @@ const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
         container: {
             flex: 1,
             flexDirection: 'row',
-            marginLeft: 10,
+            marginHorizontal: 10,
         },
         profileContainer: {
             flexDirection: 'row',
-            marginLeft: 10,
+            alignItems: 'center',
             color: theme.centerChannelColor,
         },
         textContainer: {
-            marginLeft: 5,
-        },
-        showTeammateDisplay: {
+            marginLeft: 10,
+            justifyContent: 'center',
             flexDirection: 'column',
             flex: 1,
         },
-        hideTeammateDisplay: {
-            justifyContent: 'center',
-        },
         displayName: {
             fontSize: 15,
             color: changeOpacity(theme.centerChannelColor, 0.5),
@@ -143,8 +139,10 @@ const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
             fontSize: 15,
             color: theme.centerChannelColor,
         },
-        rightFiller: {
-            width: 25,
+        deactivated: {
+            marginTop: 2,
+            fontSize: 12,
+            color: changeOpacity(theme.centerChannelColor, 0.5),
         },
     };
 });
diff --git a/app/components/custom_section_list.js b/app/components/custom_section_list.js
index d6a21affb..c95a2ffa1 100644
--- a/app/components/custom_section_list.js
+++ b/app/components/custom_section_list.js
@@ -254,8 +254,6 @@ export default class CustomSectionList extends React.PureComponent {
 const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
     return {
         listView: {
-            flex: 1,
-            backgroundColor: theme.centerChannelBg,
             ...Platform.select({
                 android: {
                     marginBottom: 20,
diff --git a/app/screens/more_channels/more_channels.js b/app/screens/more_channels/more_channels.js
index 047eef106..b8210467d 100644
--- a/app/screens/more_channels/more_channels.js
+++ b/app/screens/more_channels/more_channels.js
@@ -7,6 +7,7 @@ import {intlShape} from 'react-intl';
 import {
     Platform,
     InteractionManager,
+    StyleSheet,
     View,
 } from 'react-native';
 
@@ -20,7 +21,7 @@ import Loading from 'app/components/loading';
 import SearchBar from 'app/components/search_bar';
 import StatusBar from 'app/components/status_bar';
 import {alertErrorWithFallback} from 'app/utils/general';
-import {changeOpacity, makeStyleSheetFromTheme, setNavigatorStyles} from 'app/utils/theme';
+import {changeOpacity, setNavigatorStyles} from 'app/utils/theme';
 import {t} from 'app/utils/i18n';
 
 export default class MoreChannels extends PureComponent {
@@ -300,7 +301,6 @@ export default class MoreChannels extends PureComponent {
         const {adding, channels, searching, term} = this.state;
         const {formatMessage} = intl;
         const isLoading = requestStatus.status === RequestStatus.STARTED || requestStatus.status === RequestStatus.NOT_STARTED;
-        const style = getStyleFromTheme(theme);
         const more = searching ? () => true : this.loadMoreChannels;
 
         let content;
@@ -320,7 +320,7 @@ export default class MoreChannels extends PureComponent {
 
             content = (
                 <React.Fragment>
-                    <View style={style.wrapper}>
+                    <View style={style.searchbar}>
                         <SearchBar
                             ref='search_bar'
                             placeholder={formatMessage({id: 'search_bar.search', defaultMessage: 'Search'})}
@@ -365,25 +365,8 @@ export default class MoreChannels extends PureComponent {
     }
 }
 
-const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
-    return {
-        wrapper: {
-            marginVertical: 5,
-        },
-        container: {
-            flex: 1,
-            backgroundColor: theme.centerChannelBg,
-        },
-        navTitle: {
-            ...Platform.select({
-                android: {
-                    fontSize: 18,
-                },
-                ios: {
-                    fontSize: 15,
-                    fontWeight: 'bold',
-                },
-            }),
-        },
-    };
+const style = StyleSheet.create({
+    searchbar: {
+        marginVertical: 5,
+    },
 });
diff --git a/assets/base/i18n/en.json b/assets/base/i18n/en.json
index 76571b2b8..29328d675 100644
--- a/assets/base/i18n/en.json
+++ b/assets/base/i18n/en.json
@@ -416,6 +416,7 @@
   "mobile.timezone_settings.manual": "Change timezone",
   "mobile.timezone_settings.select": "Select Timezone",
   "mobile.user.settings.notifications.email.fifteenMinutes": "Every 15 minutes",
+  "mobile.user_list.deactivated": "Deactivated",
   "mobile.video_playback.failed_description": "An error occurred while trying to play the video.\n",
   "mobile.video_playback.failed_title": "Video playback failed",
   "mobile.video.save_error_message": "To save the video file you need to download it first.",
@@ -428,7 +429,6 @@
   "modal.manual_status.auto_responder.message_offline": "Would you like to switch your status to \"Offline\" and disable Automatic Replies?",
   "modal.manual_status.auto_responder.message_online": "Would you like to switch your status to \"Online\" and disable Automatic Replies?",
   "more_channels.title": "More Channels",
-  "more_direct_channels.directchannel.deactivated": "{displayname} - Deactivated",
   "msg_typing.areTyping": "{users} and {last} are typing...",
   "msg_typing.isTyping": "{user} is typing...",
   "navbar_dropdown.logout": "Logout",