@latte-macchiat-io/latte-vanilla-components 0.0.228 → 0.0.230

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/src/components/Video/styles.css.ts +28 -0
  3. package/src/theme/contract.css.ts +6 -6
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@latte-macchiat-io/latte-vanilla-components",
3
- "version": "0.0.228",
3
+ "version": "0.0.230",
4
4
  "description": "Beautiful components for amazing projects, with a touch of Vanilla 🥤",
5
5
  "type": "module",
6
6
  "main": "./src/index.ts",
package/src/components/Video/styles.css.ts CHANGED
@@ -135,6 +135,7 @@ globalStyle(`${playButton} svg`, {
135
135
  '@media': {
136
136
  ...generateResponsiveMedia({
137
137
  width: themeContract.video.playButton.iconSize,
138
+ height: themeContract.video.playButton.iconSize,
138
139
  }),
139
140
  },
140
141
  });
@@ -168,6 +169,15 @@ export const closeButton = style([
168
169
  },
169
170
  ]);
170
171
 
172
+ globalStyle(`${closeButton} svg`, {
173
+ '@media': {
174
+ ...generateResponsiveMedia({
175
+ width: themeContract.video.closeButton.iconSize,
176
+ height: themeContract.video.closeButton.iconSize,
177
+ }),
178
+ },
179
+ });
180
+
171
181
  export const pauseButton = style([
172
182
  controlButton,
173
183
  {
@@ -187,6 +197,15 @@ export const pauseButton = style([
187
197
  },
188
198
  ]);
189
199
 
200
+ globalStyle(`${pauseButton} svg`, {
201
+ '@media': {
202
+ ...generateResponsiveMedia({
203
+ width: themeContract.video.pauseButton.iconSize,
204
+ height: themeContract.video.pauseButton.iconSize,
205
+ }),
206
+ },
207
+ });
208
+
190
209
  export const soundButton = style([
191
210
  controlButton,
192
211
 
@@ -206,3 +225,12 @@ export const soundButton = style([
206
225
  },
207
226
  },
208
227
  ]);
228
+
229
+ globalStyle(`${soundButton} svg`, {
230
+ '@media': {
231
+ ...generateResponsiveMedia({
232
+ width: themeContract.video.soundButton.iconSize,
233
+ height: themeContract.video.soundButton.iconSize,
234
+ }),
235
+ },
236
+ });
package/src/theme/contract.css.ts CHANGED
@@ -671,12 +671,12 @@ export const themeContract = createGlobalThemeContract({
671
671
  '2xl': 'latte-video-playButton-width-2xl',
672
672
  },
673
673
  height: {
674
- mobile: 'latte-video-closeButton-height-mobile',
675
- sm: 'latte-video-closeButton-height-sm',
676
- md: 'latte-video-closeButton-height-md',
677
- lg: 'latte-video-closeButton-height-lg',
678
- xl: 'latte-video-closeButton-height-xl',
679
- '2xl': 'latte-video-closeButton-height-2xl',
674
+ mobile: 'latte-video-playButton-height-mobile',
675
+ sm: 'latte-video-playButton-height-sm',
676
+ md: 'latte-video-playButton-height-md',
677
+ lg: 'latte-video-playButton-height-lg',
678
+ xl: 'latte-video-playButton-height-xl',
679
+ '2xl': 'latte-video-playButton-height-2xl',
680
680
  },
681
681
  iconSize: {
682
682
  mobile: 'latte-video-playButton-iconSize-mobile',