@latte-macchiat-io/latte-vanilla-components 0.0.432 → 0.0.433

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 (4) hide show
  1. package/package.json +1 -1
  2. package/src/components/Modal/styles.css.ts +8 -0
  3. package/src/components/Modal/theme.ts +2 -0
  4. package/src/theme/contract.css.ts +17 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@latte-macchiat-io/latte-vanilla-components",
3
- "version": "0.0.432",
3
+ "version": "0.0.433",
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/Modal/styles.css.ts CHANGED
@@ -52,6 +52,14 @@ export const modalContentRecipe = recipe(
52
52
  xl: `calc(100% - ${themeContract.global.paddingLeft.xl} - ${themeContract.global.paddingRight.xl})`,
53
53
  '2xl': `calc(100% - ${themeContract.global.paddingLeft['2xl']} - ${themeContract.global.paddingRight['2xl']})`,
54
54
  },
55
+ maxHeight: {
56
+ mobile: `calc(100vh - ${themeContract.modal.marginTop.mobile} - ${themeContract.modal.marginBottom.mobile})`,
57
+ sm: `calc(100vh - ${themeContract.modal.marginTop.sm} - ${themeContract.modal.marginBottom.sm})`,
58
+ md: `calc(100vh - ${themeContract.modal.marginTop.md} - ${themeContract.modal.marginBottom.md})`,
59
+ lg: `calc(100vh - ${themeContract.modal.marginTop.lg} - ${themeContract.modal.marginBottom.lg})`,
60
+ xl: `calc(100vh - ${themeContract.modal.marginTop.xl} - ${themeContract.modal.marginBottom.xl})`,
61
+ '2xl': `calc(100vh - ${themeContract.modal.marginTop['2xl']} - ${themeContract.modal.marginBottom['2xl']})`,
62
+ },
55
63
  paddingTop: themeContract.modal.paddingTop,
56
64
  paddingLeft: themeContract.global.paddingLeft,
57
65
  paddingRight: themeContract.global.paddingRight,
package/src/components/Modal/theme.ts CHANGED
@@ -11,6 +11,8 @@ const themeModalBase = {
11
11
  width: { mobile: '100%', sm: '200px', md: '600px', lg: '600px', xl: '800px', '2xl': '800px' },
12
12
  paddingTop: { mobile: '15px', sm: '15px', md: '30px', lg: '30px', xl: '50px', '2xl': '50px' },
13
13
  paddingBottom: { mobile: '15px', sm: '15px', md: '30px', lg: '30px', xl: '50px', '2xl': '50px' },
14
+ marginTop: { mobile: '15px', sm: '15px', md: '30px', lg: '30px', xl: '50px', '2xl': '50px' },
15
+ marginBottom: { mobile: '15px', sm: '15px', md: '30px', lg: '30px', xl: '50px', '2xl': '50px' },
14
16
  },
15
17
  };
16
18
 
package/src/theme/contract.css.ts CHANGED
@@ -634,7 +634,7 @@ export const themeContract = createGlobalThemeContract({
634
634
  },
635
635
  paddingTop: {
636
636
  mobile: 'latte-modal-paddingTop-mobile',
637
- sm: 'latte-modal-paddingTopap-sm',
637
+ sm: 'latte-modal-paddingTop-sm',
638
638
  md: 'latte-modal-paddingTop-md',
639
639
  lg: 'latte-modal-paddingTop-lg',
640
640
  xl: 'latte-modal-paddingTop-xl',
@@ -648,6 +648,22 @@ export const themeContract = createGlobalThemeContract({
648
648
  xl: 'latte-modal-paddingBottom-xl',
649
649
  '2xl': 'latte-modal-paddingBottom-2xl',
650
650
  },
651
+ marginTop: {
652
+ mobile: 'latte-modal-marginTop-mobile',
653
+ sm: 'latte-modal-marginTop-sm',
654
+ md: 'latte-modal-marginTop-md',
655
+ lg: 'latte-modal-marginTop-lg',
656
+ xl: 'latte-modal-marginTop-xl',
657
+ '2xl': 'latte-modal-marginTop-2xl',
658
+ },
659
+ marginBottom: {
660
+ mobile: 'latte-modal-marginBottom-mobile',
661
+ sm: 'latte-modal-marginBottom-sm',
662
+ md: 'latte-modal-marginBottom-md',
663
+ lg: 'latte-modal-marginBottom-lg',
664
+ xl: 'latte-modal-marginBottom-xl',
665
+ '2xl': 'latte-modal-marginBottom-2xl',
666
+ },
651
667
  },
652
668
 
653
669
  keyNumber: {