Browse Source

[RN] Make the header more compact

master
Bettenbuk Zoltan 6 years ago
parent
commit
ecb44b6ab4
1 changed files with 8 additions and 7 deletions
  1. 8
    7
      react/features/base/react/components/native/styles.js

+ 8
- 7
react/features/base/react/components/native/styles.js View File

7
 const AVATAR_OPACITY = 0.4;
7
 const AVATAR_OPACITY = 0.4;
8
 const HEADER_COLOR = ColorPalette.blue;
8
 const HEADER_COLOR = ColorPalette.blue;
9
 
9
 
10
-// Header height is from Android guidelines. Also, this looks good.
11
-const HEADER_HEIGHT = 56;
10
+const HEADER_HEIGHT = 48;
12
 const OVERLAY_FONT_COLOR = 'rgba(255, 255, 255, 0.6)';
11
 const OVERLAY_FONT_COLOR = 'rgba(255, 255, 255, 0.6)';
13
 const SECONDARY_ACTION_BUTTON_SIZE = 30;
12
 const SECONDARY_ACTION_BUTTON_SIZE = 30;
14
 
13
 
15
 export const AVATAR_SIZE = 65;
14
 export const AVATAR_SIZE = 65;
16
-export const HEADER_PADDING = BoxModel.padding;
15
+export const HEADER_PADDING = BoxModel.padding / 2;
17
 export const STATUSBAR_COLOR = ColorPalette.blueHighlight;
16
 export const STATUSBAR_COLOR = ColorPalette.blueHighlight;
18
 export const SIDEBAR_WIDTH = 250;
17
 export const SIDEBAR_WIDTH = 250;
19
 export const UNDERLAY_COLOR = 'rgba(255, 255, 255, 0.2)';
18
 export const UNDERLAY_COLOR = 'rgba(255, 255, 255, 0.2)';
30
     headerButtonIcon: {
29
     headerButtonIcon: {
31
         alignSelf: 'center',
30
         alignSelf: 'center',
32
         color: ColorPalette.white,
31
         color: ColorPalette.white,
33
-        fontSize: 26,
34
-        paddingRight: 22
32
+        fontSize: 22,
33
+        marginRight: 12,
34
+        padding: 8
35
     },
35
     },
36
 
36
 
37
     headerButtonText: {
37
     headerButtonText: {
51
      */
51
      */
52
     headerText: {
52
     headerText: {
53
         color: ColorPalette.white,
53
         color: ColorPalette.white,
54
-        fontSize: 20
54
+        fontSize: 18
55
     },
55
     },
56
 
56
 
57
     headerTextWrapper: {
57
     headerTextWrapper: {
82
         flexDirection: 'row',
82
         flexDirection: 'row',
83
         height: HEADER_HEIGHT,
83
         height: HEADER_HEIGHT,
84
         justifyContent: 'space-between',
84
         justifyContent: 'space-between',
85
-        padding: HEADER_PADDING
85
+        paddingHorizontal: BoxModel.padding,
86
+        paddingVertical: HEADER_PADDING
86
     }
87
     }
87
 };
88
 };
88
 
89
 

Loading…
Cancel
Save