zoriya/react-native-web
1
0
Fork 0
mirror of https://github.com/zoriya/react-native-web.git synced 2026-08-15 18:45:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

[fix] handle "monospace" font-family on web

Browse Source 
This hack corrects the inheritance and scaling of font size when the
font-family is "monospace".
This commit is contained in:
Nicolas Gallagher
2018-01-08 12:19:24 -08:00
parent fd6ccbcfb3
commit b6ef1d3a36
3 changed files with 20 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/react-native-web/src/exports/StyleSheet/__tests__/__snapshots__/createReactDOMStyle-test.js.snap
+7 -1
View File
@@ -6,9 +6,15 @@ Object {
}
`;
exports[`apis/StyleSheet/createReactDOMStyle fontFamily fontFamily: "monospace" 1`] = `
Object {
"fontFamily": "monospace, monospace",
}
`;
exports[`apis/StyleSheet/createReactDOMStyle fontFamily general case 1`] = `
Object {
"fontFamily": "Georgia, Times",
"fontFamily": "Georgia, Times, serif",
}
`;
packages/react-native-web/src/exports/StyleSheet/__tests__/createReactDOMStyle-test.js
Vendored
+5 -1
View File
@@ -122,7 +122,11 @@ describe('apis/StyleSheet/createReactDOMStyle', () => {
describe('fontFamily', () => {
test('general case', () => {
expect(createReactDOMStyle({ fontFamily: 'Georgia, Times' })).toMatchSnapshot();
expect(createReactDOMStyle({ fontFamily: 'Georgia, Times, serif' })).toMatchSnapshot();
});
test('fontFamily: "monospace"', () => {
expect(createReactDOMStyle({ fontFamily: 'monospace' })).toMatchSnapshot();
});
test('fontFamily: "System"', () => {
packages/react-native-web/src/exports/StyleSheet/createReactDOMStyle.js
Vendored
+8 -2
View File
@@ -60,6 +60,7 @@ const borderWidthProps = {
borderLeftWidth: true
};
const monospaceFontStack = 'monospace, monospace';
const systemFontStack =
'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif';
@@ -234,8 +235,13 @@ const createReducer = (style, styleProps) => {
}
case 'fontFamily': {
const isSystem = value === 'System';
resolvedStyle.fontFamily = isSystem ? systemFontStack : value;
if (value === 'System') {
resolvedStyle.fontFamily = systemFontStack;
} else if (value === 'monospace') {
resolvedStyle.fontFamily = monospaceFontStack;
} else {
resolvedStyle.fontFamily = value;
}
break;
}