wip: mediachoice experiment

1 files changed, 13 insertions, 0 deletions

diff --git a/packages/instant/src/style/media.ts b/packages/instant/src/style/media.ts
index fa7571077..5a0cba668 100644
--- a/packages/instant/src/style/media.ts
+++ b/packages/instant/src/style/media.ts
@@ -1,3 +1,5 @@
+import { InterpolationValue } from 'styled-components';
+
 import { css } from './theme';
 
 export enum ScreenWidths {
@@ -17,3 +19,14 @@ export const media = {
     medium: generateMediaWrapper(ScreenWidths.Md),
     large: generateMediaWrapper(ScreenWidths.Lg),
 };
+
+/// media helper
+export interface MediaChoice {
+    sm: string;
+    md?: string;
+    lg?: string;
+}
+// TODO: handle string too
+export const stylesForMedia = (choice: MediaChoice): InterpolationValue[] => {
+    return media.small`width: ${choice.sm}`;
+};