Mobile inline styles support

Author: kkartunov

__tests__/shared/components/Contentful/Image/__snapshots__/Image.jsx.snap

@@ -3,6 +3,7 @@
 exports[`Matches shallow shapshot 1`] = `
 <div
   id="image-1"
+  style={Object {}}
 >
   <InlineSVG
     baseURL=""

__tests__/shared/components/Contentful/MemberCard/__snapshots__/MemberCard.jsx.snap

@@ -1,7 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Matches shallow shapshot 1`] = `
-<a>
+<a
+  style={Object {}}
+>
   <div>
     <div
       style={

src/shared/utils/contentful.js

@@ -9,7 +9,13 @@ import { removeTrailingSlash } from 'utils/url';
  * @return {Object}
  */
 export function fixStyle(style) {
-  return style ? _.mapKeys(style, (value, key) => _.camelCase(key)) : undefined;
+  const props = _.omitBy(style, !_.isObject);
+  const mediaQueries = _.pickBy(
+    style,
+    (propVal, mQuery) => _.isObject(propVal) && window.matchMedia(mQuery).matches,
+  );
+  const merged = _.merge(props, ..._.values(mediaQueries));
+  return merged ? _.mapKeys(merged, (value, key) => _.camelCase(key)) : undefined;
 }
 
 // Concatenates a base and segment and handles optional trailing slashes