diff options
author | Steve Klebanoff <steve.klebanoff@gmail.com> | 2018-11-07 05:56:29 +0800 |
---|---|---|
committer | Steve Klebanoff <steve.klebanoff@gmail.com> | 2018-11-07 05:56:29 +0800 |
commit | 88c7d907fa97f7918b82df8c1759b43c28c7273b (patch) | |
tree | 069e7a34f22ca084b3ea85011d2bc144cf7c7ea0 /packages/instant/src/style/media.ts | |
parent | e8814ecbe70b97dfa0de0f51b6a3b7e7fcd89ea2 (diff) | |
download | dexon-sol-tools-88c7d907fa97f7918b82df8c1759b43c28c7273b.tar dexon-sol-tools-88c7d907fa97f7918b82df8c1759b43c28c7273b.tar.gz dexon-sol-tools-88c7d907fa97f7918b82df8c1759b43c28c7273b.tar.bz2 dexon-sol-tools-88c7d907fa97f7918b82df8c1759b43c28c7273b.tar.lz dexon-sol-tools-88c7d907fa97f7918b82df8c1759b43c28c7273b.tar.xz dexon-sol-tools-88c7d907fa97f7918b82df8c1759b43c28c7273b.tar.zst dexon-sol-tools-88c7d907fa97f7918b82df8c1759b43c28c7273b.zip |
better function definiton
Diffstat (limited to 'packages/instant/src/style/media.ts')
-rw-r--r-- | packages/instant/src/style/media.ts | 23 |
1 files changed, 9 insertions, 14 deletions
diff --git a/packages/instant/src/style/media.ts b/packages/instant/src/style/media.ts index 84b85a2a8..4bcbd608f 100644 --- a/packages/instant/src/style/media.ts +++ b/packages/instant/src/style/media.ts @@ -28,22 +28,17 @@ export interface ScreenSpecifications { lg?: string; } export type MediaChoice = string | ScreenSpecifications; -// TODO: handle string too -export const stylesForMedia = (choice: MediaChoice): InterpolationValue[] => { - let res: InterpolationValue[]; +export const stylesForMedia = (cssPropertyName: string, choice: MediaChoice): InterpolationValue[] => { if (typeof choice === 'string') { - res = css` - width: ${choice}; - `; - } else { - res = css` - width: ${choice.default}; - ${choice.lg && media.large`width: ${choice.lg}`} - ${choice.md && media.medium`width: ${choice.md}`} - ${choice.sm && media.small`width: ${choice.sm}`} + return css` + ${cssPropertyName}: ${choice}; `; } - console.log(res.toString()); - return res; + return css` + ${cssPropertyName}: ${choice.default}; + ${choice.lg && media.large`${cssPropertyName}: ${choice.lg}`} + ${choice.md && media.medium`${cssPropertyName}: ${choice.md}`} + ${choice.sm && media.small`${cssPropertyName}: ${choice.sm}`} + `; }; |