@automattic/vip-design-system 2.4.2 → 2.4.3

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.
@@ -15,6 +15,7 @@ export const styles: {
15
15
  py: number;
16
16
  '&:hover, &:focus': {
17
17
  backgroundColor: string;
18
+ textDecoration: string;
18
19
  };
19
20
  '&[data-disabled]': {
20
21
  color: string;
@@ -25,6 +25,7 @@ export const styles = {
25
25
  py: 1,
26
26
  '&:hover, &:focus': {
27
27
  backgroundColor: 'hover',
28
+ textDecoration: 'none',
28
29
  },
29
30
 
30
31
  '&[data-disabled]': {
@@ -34,7 +35,7 @@ export const styles = {
34
35
 
35
36
  '&[data-highlighted]': {
36
37
  backgroundColor: 'hover',
37
- color: 'primary',
38
+ color: 'link',
38
39
  },
39
40
  };
40
41
 
@@ -44,16 +44,17 @@ var MobileMenu = exports.MobileMenu = /*#__PURE__*/(0, _react.forwardRef)(functi
44
44
  children: (0, _jsxRuntime.jsx)(_Logo.Logo, {})
45
45
  }), (0, _jsxRuntime.jsx)("div", {
46
46
  sx: {
47
- overflowX: 'hidden',
48
- overflowY: 'auto',
49
- height: 'calc(100vh - 64px)',
47
+ height: '100vh',
50
48
  display: 'flex',
51
49
  flex: 1
52
50
  },
53
51
  children: (0, _jsxRuntime.jsxs)(_index.Flex, {
54
52
  sx: {
55
53
  width: '100%',
56
- flexDirection: 'column'
54
+ flexDirection: 'column',
55
+ height: 'calc(100vh - 64px)',
56
+ overflowX: 'hidden',
57
+ overflowY: 'auto'
57
58
  },
58
59
  children: [toolbarItems && (0, _jsxRuntime.jsx)(_index.Nav.PrimaryInverse, {
59
60
  label: "Main Links",
@@ -63,7 +64,7 @@ var MobileMenu = exports.MobileMenu = /*#__PURE__*/(0, _react.forwardRef)(functi
63
64
  sx: {
64
65
  alignSelf: 'stretch',
65
66
  backgroundColor: 'layer.1',
66
- minHeight: "calc(100vh - 64px)",
67
+ height: '100%',
67
68
  gap: 4,
68
69
  width: '100%',
69
70
  a: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@automattic/vip-design-system",
3
- "version": "2.4.2",
3
+ "version": "2.4.3",
4
4
  "main": "build/system/index.js",
5
5
  "scripts": {
6
6
  "build-storybook": "storybook build",
@@ -25,6 +25,7 @@ export const styles = {
25
25
  py: 1,
26
26
  '&:hover, &:focus': {
27
27
  backgroundColor: 'hover',
28
+ textDecoration: 'none',
28
29
  },
29
30
 
30
31
  '&[data-disabled]': {
@@ -34,7 +35,7 @@ export const styles = {
34
35
 
35
36
  '&[data-highlighted]': {
36
37
  backgroundColor: 'hover',
37
- color: 'primary',
38
+ color: 'link',
38
39
  },
39
40
  };
40
41
 
@@ -44,14 +44,20 @@ export const MobileMenu = forwardRef< HTMLDivElement, MobileMenuProps >(
44
44
 
45
45
  <div
46
46
  sx={ {
47
- overflowX: 'hidden',
48
- overflowY: 'auto',
49
- height: 'calc(100vh - 64px)',
47
+ height: '100vh',
50
48
  display: 'flex',
51
49
  flex: 1,
52
50
  } }
53
51
  >
54
- <Flex sx={ { width: '100%', flexDirection: 'column' } }>
52
+ <Flex
53
+ sx={ {
54
+ width: '100%',
55
+ flexDirection: 'column',
56
+ height: 'calc(100vh - 64px)',
57
+ overflowX: 'hidden',
58
+ overflowY: 'auto',
59
+ } }
60
+ >
55
61
  { toolbarItems && (
56
62
  <Nav.PrimaryInverse label="Main Links" orientation="vertical">
57
63
  { toolbarItems }
@@ -62,7 +68,7 @@ export const MobileMenu = forwardRef< HTMLDivElement, MobileMenuProps >(
62
68
  sx={ {
63
69
  alignSelf: 'stretch',
64
70
  backgroundColor: 'layer.1',
65
- minHeight: `calc(100vh - 64px)`,
71
+ height: '100%',
66
72
  gap: 4,
67
73
  width: '100%',
68
74
  a: {