diff --git a/app/components/markdown/markdown_table/__snapshots__/markdown_table.test.js.snap b/app/components/markdown/markdown_table/__snapshots__/markdown_table.test.js.snap
index f47e327e9..cd6d30b2e 100644
--- a/app/components/markdown/markdown_table/__snapshots__/markdown_table.test.js.snap
+++ b/app/components/markdown/markdown_table/__snapshots__/markdown_table.test.js.snap
@@ -41,6 +41,7 @@ exports[`MarkdownTable should match snapshot 1`] = `
"borderColor": "rgba(61,60,64,0.2)",
"borderLeftWidth": 1,
"borderTopWidth": 1,
+ "width": "100%",
},
]
}
@@ -147,31 +148,58 @@ exports[`MarkdownTable should match snapshot 1`] = `
onPress={[Function]}
style={
Object {
- "backgroundColor": "#ffffff",
- "borderColor": "rgba(61,60,64,0.2)",
- "borderRadius": 15,
- "borderWidth": 1,
- "bottom": 20,
- "height": 30,
+ "height": 34,
"left": -20,
- "paddingLeft": 7,
- "paddingTop": 6,
- "width": 30,
+ "width": 34,
}
}
type="native"
>
-
+ >
+
+
+
+
`;
diff --git a/app/components/markdown/markdown_table/markdown_table.js b/app/components/markdown/markdown_table/markdown_table.js
index a6f1cac18..ada8309f5 100644
--- a/app/components/markdown/markdown_table/markdown_table.js
+++ b/app/components/markdown/markdown_table/markdown_table.js
@@ -6,6 +6,7 @@ import React from 'react';
import {intlShape} from 'react-intl';
import {
ScrollView,
+ Platform,
View,
Dimensions,
} from 'react-native';
@@ -179,10 +180,14 @@ export default class MarkdownTable extends React.PureComponent {
onPress={this.handlePress}
style={{...style.expandButton, left: this.state.containerWidth - 20}}
>
-
+
+
+
+
+
);
@@ -219,21 +224,43 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
maxHeight: MAX_HEIGHT,
},
expandButton: {
- height: 30,
- width: 30,
- borderWidth: 1,
- paddingTop: 6,
- paddingLeft: 7,
- borderColor: changeOpacity(theme.centerChannelColor, 0.2),
- borderRadius: 15,
- bottom: 20,
+ height: 34,
+ width: 34,
+ },
+ iconContainer: {
+ maxWidth: '100%',
+ alignItems: 'flex-end',
+ paddingTop: 8,
+ paddingBottom: 4,
+ ...Platform.select({
+ ios: {
+ paddingRight: 14,
+ },
+ }),
+ },
+ iconButton: {
backgroundColor: theme.centerChannelBg,
+ marginTop: -32,
+ marginRight: -6,
+ borderWidth: 1,
+ borderRadius: 50,
+ borderColor: changeOpacity(theme.centerChannelColor, 0.2),
+ width: 34,
+ height: 34,
+ alignItems: 'center',
+ justifyContent: 'center',
},
icon: {
- fontSize: 15,
+ fontSize: 14,
color: theme.linkColor,
+ ...Platform.select({
+ ios: {
+ fontSize: 13,
+ },
+ }),
},
table: {
+ width: '100%',
borderColor: changeOpacity(theme.centerChannelColor, 0.2),
borderLeftWidth: 1,
borderTopWidth: 1,