fix: improve styles for items on the left in JS stack (#221)

Author: vonovak

example/src/screens/UsageLeft.tsx

@@ -15,6 +15,7 @@ export function UsageLeft({ navigation, route }: ScreenProps<'UsageLeft'>) {
             iconName={
               route.params && route.params.showIcon ? 'arrow-back' : undefined
             }
+            style={{ backgroundColor: 'pink', marginRight: 10 }}
             onPress={() => alert('Test')}
           />
         </HeaderButtons>

src/ButtonsWrapper.tsx

@@ -56,16 +56,20 @@ const styles = StyleSheet.create({
     }),
   },
   extraEdgeMarginOnLeft: {
+    // not used in native stack
+    // only applies in JS stack or when rendered as a header for a tab navigator
     ...Platform.select({
       android: {
-        marginLeft: 5,
+        marginLeft: 15,
       },
       default: {
-        marginLeft: 4,
+        marginLeft: 14,
       },
     }),
   },
   extraEdgeMarginOnRight: {
+    // not used in native stack
+    // only applies in JS stack or when rendered as a header for a tab navigator
     ...Platform.select({
       android: {
         marginRight: 14,