Page MenuHomePhorge
Files F32167655

D5048.1765052915.diff
No OneTemporary
Actions

Size
3 KB
Referenced Files
None
Subscribers
None

D5048.1765052915.diff
View Options

diff --git a/native/chat/inner-text-message.react.js b/native/chat/inner-text-message.react.js
--- a/native/chat/inner-text-message.react.js
+++ b/native/chat/inner-text-message.react.js
@@ -105,7 +105,11 @@
style={[styles.message, cornerStyle]}
animatedStyle={messageStyle}
>
- <Markdown style={[styles.text, textStyle]} rules={rules}>
+ <Markdown
+ style={[styles.text, textStyle]}
+ rules={rules}
+ threadColor={item.threadInfo.color}
+ >
{text}
</Markdown>
</GestureTouchableOpacity>
diff --git a/native/markdown/markdown.react.js b/native/markdown/markdown.react.js
--- a/native/markdown/markdown.react.js
+++ b/native/markdown/markdown.react.js
@@ -5,6 +5,7 @@
import { View, Text, StyleSheet } from 'react-native';
import type { TextStyle as FlattenedTextStyle } from 'react-native/Libraries/StyleSheet/StyleSheet';
import * as SimpleMarkdown from 'simple-markdown';
+import tinycolor from 'tinycolor2';
import { onlyEmojiRegex } from 'lib/shared/emojis';
@@ -15,9 +16,10 @@
+style: TextStyle,
+children: string,
+rules: MarkdownRules,
+ +threadColor?: string,
};
function Markdown(props: Props): React.Node {
- const { style, children, rules } = props;
+ const { style, children, rules, threadColor } = props;
const { simpleMarkdownRules, emojiOnlyFactor, container } = rules;
const parser = React.useMemo(
@@ -61,10 +63,10 @@
return { ...flattened, fontSize: fontSize * emojiOnlyFactor };
}, [emojiOnly, style, emojiOnlyFactor]);
- const renderedOutput = React.useMemo(
- () => output(ast, { textStyle, container }),
- [ast, output, textStyle, container],
- );
+ const renderedOutput = React.useMemo(() => {
+ const color = tinycolor(threadColor).darken(20).toString();
+ return output(ast, { textStyle, container, color });
+ }, [ast, output, textStyle, container, threadColor]);
if (container === 'Text') {
return <Text>{renderedOutput}</Text>;
diff --git a/native/markdown/rules.react.js b/native/markdown/rules.react.js
--- a/native/markdown/rules.react.js
+++ b/native/markdown/rules.react.js
@@ -23,6 +23,7 @@
// View, and Views can't be nested inside Texts without explicit height and
// width
+container: 'View' | 'Text',
+ +color?: string,
};
// Entry requires a seamless transition between Markdown and TextInput
@@ -233,11 +234,16 @@
node: SharedMarkdown.SingleASTNode,
output: SharedMarkdown.Output<SharedMarkdown.ReactElement>,
state: SharedMarkdown.State,
- ) => (
- <View key={state.key} style={styles.blockQuote}>
- {output(node.content, state)}
- </View>
- ),
+ ) => {
+ return (
+ <View
+ key={state.key}
+ style={{ ...styles.blockQuote, backgroundColor: state.color }}
+ >
+ {output(node.content, state)}
+ </View>
+ );
+ },
},
codeBlock: {
...SimpleMarkdown.defaultRules.codeBlock,
diff --git a/native/markdown/styles.js b/native/markdown/styles.js
--- a/native/markdown/styles.js
+++ b/native/markdown/styles.js
@@ -60,9 +60,7 @@
fontWeight: 'bold',
},
blockQuote: {
- backgroundColor: 'blockQuoteBackground',
- borderLeftColor: 'blockQuoteBorder',
- borderLeftWidth: 5,
+ borderRadius: 8,
padding: 10,
marginBottom: 6,
marginVertical: 6,

File Metadata

Mime Type
text/plain
Expires
Sat, Dec 6, 8:28 PM (2 h, 24 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5840657
Default Alt Text
D5048.1765052915.diff (3 KB)

Event Timeline