title: React-Native how do you add a border to a single tab of the bottom navigation?
body: <p>I am currently facing a styling issue with my bottom navigation in React-Native.</p>
  
  <p><strong>Current bottom navigation</strong></p>
  
  <p>Currently, I am creating bottom navigation with the following code.</p>
  
  <pre><code>
  const TabNavigator = createBottomTabNavigator({
      Home: {
          screen: Home,
          navigationOptions: {
              tabBarLabel: 'home',
              tabBarIcon: ({tintColor}) =&gt; (
                  &lt;Image
  // Icon with styling here
                  /&gt;
              )
          },
      },
  
      Settings: {
          screen: Settings,
          navigationOptions: {
              tabBarLabel: 'settings',
              tabBarIcon: ({tintColor}) =&gt; (
                  &lt;Image
  // Icon with styling here
                  /&gt;
              )
          },
      },
  }, {
      tabBarOptions: {
  // Styling here
      }
  });
  
  const AppContainer = createAppContainer(TabNavigator);
  
  </code></pre>
  
  <p>This works fine. </p>
  
  <p><strong>Desired end situation</strong></p>
  
  <p>I am trying to implement a small light-blue gap between the tabs.</p>
  
  <p>This would look like this: </p>
  
  <p><a href="https://imgur.com/EZsWpof" rel="nofollow noreferrer">https://imgur.com/EZsWpof</a></p>
  
  <p>Does someone know if this is even possible with React Navigation / has a solution?</p>