@lls/lls-audio 0.0.62 → 0.0.63

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/package.json +1 -1
  2. package/player/styles/mediaQueries.js +9 -4
  3. package/player/styles/styles.js +18 -16
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lls/lls-audio",
3
- "version": "0.0.62",
3
+ "version": "0.0.63",
4
4
  "main": "index.js",
5
5
  "devDependencies": {
6
6
  "@kadira/storybook": "2.21.0",
package/player/styles/mediaQueries.js CHANGED
@@ -3,7 +3,12 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- var MOBILE = exports.MOBILE = '@media only screen and (max-width: 650px), only screen and (max-device-width: 650px)';
7
- var PHABLET = exports.PHABLET = '@media only screen and (min-width: 651px) and (max-width: 1000px), only screen and (min-device-width: 651px) and (max-device-width:1000px)';
8
- var TABLET = exports.TABLET = '@media only screen and (min-width: 1001px) and (max-width: 1200px), only screen and (min-device-width: 1001px) and (max-device-width:1200px)';
9
- var DESKTOP = exports.DESKTOP = '@media only screen and (min-width: 1201px) and (min-device-width:1201px)';
6
+ var QUERY_MOBILE = exports.QUERY_MOBILE = 'only screen and (max-width: 650px), only screen and (max-device-width: 650px)';
7
+ var QUERY_PHABLET = exports.QUERY_PHABLET = 'only screen and (min-width: 651px) and (max-width: 1000px), only screen and (min-device-width: 651px) and (max-device-width:1000px)';
8
+ var QUERY_TABLET = exports.QUERY_TABLET = 'only screen and (min-width: 1001px) and (max-width: 1200px), only screen and (min-device-width: 1001px) and (max-device-width:1200px)';
9
+ var QUERY_DESKTOP = exports.QUERY_DESKTOP = 'only screen and (min-width: 1201px) and (min-device-width:1201px)';
10
+
11
+ var MOBILE = exports.MOBILE = '@media ' + QUERY_MOBILE;
12
+ var PHABLET = exports.PHABLET = '@media ' + QUERY_PHABLET;
13
+ var TABLET = exports.TABLET = '@media ' + QUERY_TABLET;
14
+ var DESKTOP = exports.DESKTOP = '@media ' + QUERY_DESKTOP;
package/player/styles/styles.js CHANGED
@@ -10,11 +10,13 @@ var _mediaQueries = require('./mediaQueries');
10
10
 
11
11
  function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
12
12
 
13
+ var NOT_DESKTOP = '@media ' + _mediaQueries.QUERY_MOBILE + ', ' + _mediaQueries.QUERY_PHABLET + ', ' + _mediaQueries.QUERY_TABLET;
14
+
13
15
  exports.default = {
14
16
  player: _defineProperty({
15
17
  boxShadow: '0 0 7px rgba(0, 0, 0, 0.32)',
16
18
  backgroundColor: '#fff'
17
- }, _mediaQueries.MOBILE, {
19
+ }, NOT_DESKTOP, {
18
20
  flexFlow: 'row wrap',
19
21
  paddingTop: 10
20
22
  }),
@@ -32,7 +34,7 @@ exports.default = {
32
34
  volume: _defineProperty({
33
35
  width: 100,
34
36
  cursor: 'pointer'
35
- }, _mediaQueries.MOBILE, {
37
+ }, NOT_DESKTOP, {
36
38
  width: 55
37
39
  }),
38
40
  iconAudio: {
@@ -45,21 +47,21 @@ exports.default = {
45
47
  fontSize: 12,
46
48
  alignSelf: 'flex-end',
47
49
  marginBottom: 7
48
- }, _mediaQueries.MOBILE, {
50
+ }, NOT_DESKTOP, {
49
51
  flex: '1 auto',
50
52
  position: 'relative',
51
53
  bottom: 22
52
54
  }),
53
- currentTime: _defineProperty({}, _mediaQueries.MOBILE, {
55
+ currentTime: _defineProperty({}, NOT_DESKTOP, {
54
56
  order: 1
55
57
  }),
56
- totalTime: _defineProperty({}, _mediaQueries.MOBILE, {
58
+ totalTime: _defineProperty({}, NOT_DESKTOP, {
57
59
  order: 3
58
60
  }),
59
61
  waveAndTimes: _defineProperty({
60
62
  width: 'calc(100% - 430px)',
61
63
  display: 'flex'
62
- }, _mediaQueries.MOBILE, {
64
+ }, NOT_DESKTOP, {
63
65
  width: 'calc(100% - 225px)',
64
66
  margin: '0px 28px'
65
67
  }),
@@ -83,10 +85,10 @@ exports.default = {
83
85
  fallback: _defineProperty({
84
86
  marginTop: 5,
85
87
  position: 'relative'
86
- }, _mediaQueries.MOBILE, {
88
+ }, NOT_DESKTOP, {
87
89
  marginTop: 16
88
90
  }),
89
- wavetimeline: _defineProperty({}, _mediaQueries.MOBILE, {
91
+ wavetimeline: _defineProperty({}, NOT_DESKTOP, {
90
92
  display: 'none'
91
93
  }),
92
94
  loader: _defineProperty({
@@ -96,24 +98,24 @@ exports.default = {
96
98
  fontWeight: 'bold',
97
99
  lineHeight: '60px',
98
100
  textAlign: 'center'
99
- }, _mediaQueries.MOBILE, {
101
+ }, NOT_DESKTOP, {
100
102
  lineHeight: 1.5
101
103
  }),
102
104
  loaderText: _defineProperty({
103
105
  textTransform: 'uppercase'
104
- }, _mediaQueries.MOBILE, {
106
+ }, NOT_DESKTOP, {
105
107
  position: 'relative',
106
108
  top: 30
107
109
  }),
108
- loaderOne: _defineProperty({}, _mediaQueries.MOBILE, {
110
+ loaderOne: _defineProperty({}, NOT_DESKTOP, {
109
111
  position: 'relative',
110
112
  top: 30
111
113
  }),
112
- loaderTwo: _defineProperty({}, _mediaQueries.MOBILE, {
114
+ loaderTwo: _defineProperty({}, NOT_DESKTOP, {
113
115
  position: 'relative',
114
116
  top: 30
115
117
  }),
116
- loaderThree: _defineProperty({}, _mediaQueries.MOBILE, {
118
+ loaderThree: _defineProperty({}, NOT_DESKTOP, {
117
119
  position: 'relative',
118
120
  top: 30
119
121
  }),
@@ -123,7 +125,7 @@ exports.default = {
123
125
  position: 'relative',
124
126
  display: 'flex',
125
127
  flexDirection: 'column'
126
- }, _mediaQueries.MOBILE, {
128
+ }, NOT_DESKTOP, {
127
129
  order: 2
128
130
  }),
129
131
  repeat_menu: _defineProperty({
@@ -131,12 +133,12 @@ exports.default = {
131
133
  marginTop: 14,
132
134
  fontSize: 23,
133
135
  cursor: 'pointer'
134
- }, _mediaQueries.MOBILE, {
136
+ }, NOT_DESKTOP, {
135
137
  display: 'none'
136
138
  }),
137
139
  speed_menu: _defineProperty({
138
140
  marginLeft: 10
139
- }, _mediaQueries.MOBILE, {
141
+ }, NOT_DESKTOP, {
140
142
  display: 'none'
141
143
  }),
142
144
  close: {