Prevent desktop only themes from being activated

src/screens/SideMenu/MainSideMenu.js

@@ -80,6 +80,16 @@ export default class MainSideMenu extends AbstractSideMenu {
   }
 
   onThemeSelect = (theme) => {
+    // Prevent themes that aren't meant for mobile from being activated
+    if(theme.content.package_info && theme.content.package_info.no_mobile) {
+      AlertManager.get().alert({
+        title: "Not Available",
+        text: "This theme is not available on mobile."
+      })
+
+      return;
+    }
+
     StyleKit.get().activateTheme(theme);
     this.forceUpdate();
   }
@@ -126,7 +136,7 @@ export default class MainSideMenu extends AbstractSideMenu {
         text: theme.name,
         key: theme.uuid || theme.name,
         iconDesc: this.iconDescriptorForTheme(theme),
-        dimmed: theme.getNotAvailOnMobile(),
+        dimmed: theme.getNotAvailOnMobile() || theme.package_info.no_mobile,
         selected: StyleKit.get().isThemeActive(theme),
         onSelect: () => {this.onThemeSelect(theme)},
         onLongPress: () => {this.onThemeLongPress(theme)}

src/screens/SideMenu/SideMenuCell.js

@@ -70,6 +70,7 @@ export default class SideMenuCell extends ThemedComponent {
 
   colorForTextClass = (textClass) => {
     if(!textClass) {return null;}
+
     return {
       "info" : StyleKit.variables.stylekitInfoColor,
       "danger" : StyleKit.variables.stylekitDangerColor,
@@ -81,6 +82,12 @@ export default class SideMenuCell extends ThemedComponent {
     let hasIcon = this.props.iconDesc;
     let iconSide = (hasIcon && this.props.iconDesc.side) ? this.props.iconDesc.side : (hasIcon ? "left" : null);
     let textColor = this.colorForTextClass(this.props.textClass);
+
+    // if this is a dimmed cell, override text color with Neutral color
+    if(this.props.dimmed) {
+      textColor = StyleKit.variable("stylekitNeutralColor");
+    }
+
     return (
       <TouchableOpacity style={this.styles.cell} onPress={this.onPress} onLongPress={this.onLongPress}>
         <View style={this.styles.cellContent}>