diff --git a/app/containers/MediaCallHeader/MediaCallHeader.tsx b/app/containers/MediaCallHeader/MediaCallHeader.tsx
index a3a0fa3ad14..2e7d508d793 100644
--- a/app/containers/MediaCallHeader/MediaCallHeader.tsx
+++ b/app/containers/MediaCallHeader/MediaCallHeader.tsx
@@ -14,6 +14,7 @@ const styles = StyleSheet.create({
justifyContent: 'space-between',
alignItems: 'center',
paddingHorizontal: 12,
+ paddingBottom: 12,
borderBottomWidth: StyleSheet.hairlineWidth
}
});
@@ -27,8 +28,7 @@ const MediaCallHeader = () => {
const defaultHeaderStyle = {
backgroundColor: colors.surfaceNeutral,
- paddingTop: insets.top + 12,
- paddingBottom: 12
+ paddingTop: insets.top
};
if (!call) {
@@ -36,7 +36,9 @@ const MediaCallHeader = () => {
}
return (
-
+
diff --git a/app/containers/MediaCallHeader/__snapshots__/MediaCallHeader.test.tsx.snap b/app/containers/MediaCallHeader/__snapshots__/MediaCallHeader.test.tsx.snap
index 46805f06c9a..c4641321457 100644
--- a/app/containers/MediaCallHeader/__snapshots__/MediaCallHeader.test.tsx.snap
+++ b/app/containers/MediaCallHeader/__snapshots__/MediaCallHeader.test.tsx.snap
@@ -16,12 +16,12 @@ exports[`Story Snapshots: ActiveCall should match snapshot 1`] = `
"borderBottomWidth": 0.5,
"flexDirection": "row",
"justifyContent": "space-between",
+ "paddingBottom": 12,
"paddingHorizontal": 12,
},
{
"backgroundColor": "#E4E7EA",
"borderBottomColor": "#CBCED1",
- "paddingBottom": 12,
"paddingTop": 12,
},
]
@@ -158,8 +158,8 @@ exports[`Story Snapshots: ActiveCall should match snapshot 1`] = `
style={
{
"alignItems": "flex-start",
- "flex": 1,
"flexDirection": "column",
+ "flexGrow": 1,
"justifyContent": "space-evenly",
}
}
@@ -228,7 +228,7 @@ exports[`Story Snapshots: ActiveCall should match snapshot 1`] = `
Bob Burnquist
-
- 16117:18:53
+ 16140:16:32
@@ -362,12 +362,12 @@ exports[`Story Snapshots: Collapsed should match snapshot 1`] = `
"borderBottomWidth": 0.5,
"flexDirection": "row",
"justifyContent": "space-between",
+ "paddingBottom": 12,
"paddingHorizontal": 12,
},
{
"backgroundColor": "#E4E7EA",
"borderBottomColor": "#CBCED1",
- "paddingBottom": 12,
"paddingTop": 12,
},
]
@@ -504,8 +504,8 @@ exports[`Story Snapshots: Collapsed should match snapshot 1`] = `
style={
{
"alignItems": "flex-start",
- "flex": 1,
"flexDirection": "column",
+ "flexGrow": 1,
"justifyContent": "space-evenly",
}
}
@@ -574,7 +574,7 @@ exports[`Story Snapshots: Collapsed should match snapshot 1`] = `
Bob Burnquist
-
- 16117:18:53
+ 16140:16:32
@@ -708,12 +708,12 @@ exports[`Story Snapshots: ConnectingCall should match snapshot 1`] = `
"borderBottomWidth": 0.5,
"flexDirection": "row",
"justifyContent": "space-between",
+ "paddingBottom": 12,
"paddingHorizontal": 12,
},
{
"backgroundColor": "#E4E7EA",
"borderBottomColor": "#CBCED1",
- "paddingBottom": 12,
"paddingTop": 12,
},
]
@@ -850,8 +850,8 @@ exports[`Story Snapshots: ConnectingCall should match snapshot 1`] = `
style={
{
"alignItems": "flex-start",
- "flex": 1,
"flexDirection": "column",
+ "flexGrow": 1,
"justifyContent": "space-evenly",
}
}
@@ -1050,12 +1050,12 @@ exports[`Story Snapshots: Focused should match snapshot 1`] = `
"borderBottomWidth": 0.5,
"flexDirection": "row",
"justifyContent": "space-between",
+ "paddingBottom": 12,
"paddingHorizontal": 12,
},
{
"backgroundColor": "#E4E7EA",
"borderBottomColor": "#CBCED1",
- "paddingBottom": 12,
"paddingTop": 12,
},
]
@@ -1192,8 +1192,8 @@ exports[`Story Snapshots: Focused should match snapshot 1`] = `
style={
{
"alignItems": "flex-start",
- "flex": 1,
"flexDirection": "column",
+ "flexGrow": 1,
"justifyContent": "space-evenly",
}
}
@@ -1262,7 +1262,7 @@ exports[`Story Snapshots: Focused should match snapshot 1`] = `
Bob Burnquist
-
- 16117:18:53
+ 16140:16:32
@@ -1392,8 +1392,7 @@ exports[`Story Snapshots: NoCall should match snapshot 1`] = `
style={
{
"backgroundColor": "#E4E7EA",
- "paddingBottom": 12,
- "paddingTop": 12,
+ "paddingTop": 0,
}
}
testID="media-call-header-empty"
@@ -1417,12 +1416,12 @@ exports[`Story Snapshots: WithRemoteHeld should match snapshot 1`] = `
"borderBottomWidth": 0.5,
"flexDirection": "row",
"justifyContent": "space-between",
+ "paddingBottom": 12,
"paddingHorizontal": 12,
},
{
"backgroundColor": "#E4E7EA",
"borderBottomColor": "#CBCED1",
- "paddingBottom": 12,
"paddingTop": 12,
},
]
@@ -1559,8 +1558,8 @@ exports[`Story Snapshots: WithRemoteHeld should match snapshot 1`] = `
style={
{
"alignItems": "flex-start",
- "flex": 1,
"flexDirection": "column",
+ "flexGrow": 1,
"justifyContent": "space-evenly",
}
}
@@ -1629,7 +1628,7 @@ exports[`Story Snapshots: WithRemoteHeld should match snapshot 1`] = `
Bob Burnquist
-
- 16117:18:53
+ 16140:16:32
@@ -1763,12 +1762,12 @@ exports[`Story Snapshots: WithRemoteMuted should match snapshot 1`] = `
"borderBottomWidth": 0.5,
"flexDirection": "row",
"justifyContent": "space-between",
+ "paddingBottom": 12,
"paddingHorizontal": 12,
},
{
"backgroundColor": "#E4E7EA",
"borderBottomColor": "#CBCED1",
- "paddingBottom": 12,
"paddingTop": 12,
},
]
@@ -1905,8 +1904,8 @@ exports[`Story Snapshots: WithRemoteMuted should match snapshot 1`] = `
style={
{
"alignItems": "flex-start",
- "flex": 1,
"flexDirection": "column",
+ "flexGrow": 1,
"justifyContent": "space-evenly",
}
}
@@ -1975,7 +1974,7 @@ exports[`Story Snapshots: WithRemoteMuted should match snapshot 1`] = `
Bob Burnquist
-
- 16117:18:53
+ 16140:16:32
diff --git a/app/containers/MediaCallHeader/components/Content.tsx b/app/containers/MediaCallHeader/components/Content.tsx
index 566918a42c2..d6d3c079d7f 100644
--- a/app/containers/MediaCallHeader/components/Content.tsx
+++ b/app/containers/MediaCallHeader/components/Content.tsx
@@ -9,7 +9,7 @@ const styles = StyleSheet.create({
paddingHorizontal: 4
},
container: {
- flex: 1,
+ flexGrow: 1,
flexDirection: 'column',
justifyContent: 'space-evenly',
alignItems: 'flex-start'
diff --git a/app/containers/MediaCallHeader/components/Subtitle.tsx b/app/containers/MediaCallHeader/components/Subtitle.tsx
index 364886e31b6..41c11486d3e 100644
--- a/app/containers/MediaCallHeader/components/Subtitle.tsx
+++ b/app/containers/MediaCallHeader/components/Subtitle.tsx
@@ -6,7 +6,7 @@ import I18n from '../../../i18n';
import sharedStyles from '../../../views/Styles';
const styles = StyleSheet.create({
- headerTitle: {
+ headerSubtitle: {
...sharedStyles.textRegular,
fontSize: 12,
lineHeight: 16
@@ -42,7 +42,10 @@ const Subtitle = () => {
}
return (
-
+
{subtitle}
);