@occmundial/occ-atomic 3.0.0-beta.50 → 3.0.0-beta.52

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.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,17 @@
1
+ # [3.0.0-beta.52](https://github.com/occmundial/occ-atomic/compare/v3.0.0-beta.51...v3.0.0-beta.52) (2024-09-03)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * Add cursor pointer to bottom links ([93eb978](https://github.com/occmundial/occ-atomic/commit/93eb9787735c7846c35ae797f71a3b515cc0913e))
7
+
8
+ # [3.0.0-beta.51](https://github.com/occmundial/occ-atomic/compare/v3.0.0-beta.50...v3.0.0-beta.51) (2024-09-03)
9
+
10
+
11
+ ### Bug Fixes
12
+
13
+ * Add margin zero to grid and add padding top for modal when img top ([cd5416c](https://github.com/occmundial/occ-atomic/commit/cd5416c2ce4fbf1000afd51938c2a24f56999eee))
14
+
1
15
  # [3.0.0-beta.50](https://github.com/occmundial/occ-atomic/compare/v3.0.0-beta.49...v3.0.0-beta.50) (2024-09-03)
2
16
 
3
17
 
@@ -136,7 +136,7 @@ Footer.propTypes = {
136
136
 
137
137
  /** Footer list className. */
138
138
  listClassName: _propTypes["default"].string,
139
- isFluid: _propTypes["default"]["boolean"],
139
+ isFluid: _propTypes["default"].bool,
140
140
 
141
141
  /** Custom component to render at the top of the footer, commonly used for brand logo */
142
142
  topElement: _propTypes["default"].node,
@@ -145,7 +145,7 @@ Footer.propTypes = {
145
145
  bottomLinksClassName: _propTypes["default"].string,
146
146
 
147
147
  /** Flag to display an horizontal line between sections */
148
- sectionDivider: _propTypes["default"]["boolean"]
148
+ sectionDivider: _propTypes["default"].bool
149
149
  };
150
150
  Footer.defaultProps = {
151
151
  bottomLinks: [],
@@ -4,79 +4,141 @@ exports[`Footer matches the snapshot 1`] = `ShallowWrapper {}`;
4
4
 
5
5
  exports[`Footer styles matches the snapshot 1`] = `
6
6
  Object {
7
- "bottomWrap": Object {
8
- "borderTop": "1px solid #dddddd",
9
- "paddingTop": 24,
7
+ "auxContainer": Object {
8
+ "@media (min-width: 992px)": Object {
9
+ "flexDirection": "row",
10
+ "gap": "64px",
11
+ },
12
+ "alignItems": "center",
13
+ "display": "flex",
14
+ "flexDirection": "column",
15
+ "gap": "24px",
16
+ "justifyContent": "center",
10
17
  },
11
- "buttonMobile": Object {
12
- "marginTop": 16,
18
+ "badgesContainer": Object {
19
+ "@media (min-width: 576px)": Object {
20
+ "flexDirection": "row",
21
+ },
22
+ "display": "flex",
23
+ "flexDirection": "column",
24
+ "gap": "16px",
13
25
  },
14
- "column": Object {
15
- "paddingBottom": 16,
26
+ "bottomContainer": Object {
27
+ "@media (min-width: 768px)": Object {
28
+ "rowGap": "24px",
29
+ },
30
+ "display": "flex",
31
+ "flexDirection": "column",
32
+ "rowGap": "16px",
16
33
  },
17
- "footer": Object {
34
+ "bottomLinksContainer": Object {
35
+ "@media (min-width: 768px)": Object {
36
+ "alignItems": "stretch",
37
+ "flexDirection": "row",
38
+ },
39
+ "columnGap": "24px",
40
+ "display": "flex",
41
+ "flexDirection": "column",
42
+ "justifyContent": "center",
43
+ "rowGap": "16px",
44
+ },
45
+ "bottomSection": Object {
46
+ "display": "flex",
47
+ "flexDirection": "column",
48
+ "rowGap": "40px",
49
+ },
50
+ "column": Object {
51
+ "@media (min-width: 576px)": Object {
52
+ "columnGap": "16px",
53
+ "flexDirection": "row",
54
+ "rowGap": "40px",
55
+ },
18
56
  "@media (min-width: 992px)": Object {
19
- "padding": Array [
20
- 32,
21
- 0,
22
- 32,
23
- ],
57
+ "columnGap": "24px",
58
+ "rowGap": 0,
24
59
  },
25
- "backgroundColor": "#f5f5f8",
60
+ "display": "flex",
61
+ "flexDirection": "column",
62
+ "flexWrap": "wrap",
63
+ },
64
+ "copyright": Object {
65
+ "& > p": Object {
66
+ "margin": 0,
67
+ },
68
+ "color": "#5A5D7B",
69
+ "font": "300 16px/1.5 'OccText', sans-serif",
70
+ },
71
+ "divider": Object {
72
+ "borderTop": "1px solid #EDEDF1",
73
+ },
74
+ "footer": Object {
75
+ "backgroundColor": "#fff",
76
+ "borderTop": "1px solid #EDEDF1",
26
77
  "padding": Array [
27
- 24,
78
+ "40px",
28
79
  0,
29
- 32,
30
80
  ],
31
81
  },
32
- "footerWithoutColumns": Object {
82
+ "footerContainer": Object {
83
+ "@media (min-width: 576px)": Object {
84
+ "rowGap": "40px",
85
+ },
33
86
  "@media (min-width: 992px)": Object {
34
- "padding": Array [
35
- 0,
36
- 0,
37
- 32,
38
- ],
87
+ "rowGap": "48px",
39
88
  },
40
- "backgroundColor": "#f5f5f8",
41
- "padding": Array [
42
- 0,
43
- 0,
44
- 32,
45
- ],
89
+ "display": "flex",
90
+ "flexDirection": "column",
91
+ "rowGap": "24px",
46
92
  },
47
93
  "link": Object {
48
- "&:hover, &:focus, &:active": Object {
49
- "color": "#777777",
94
+ "&:focus-visible": Object {
95
+ "borderRadius": "4px",
96
+ "boxShadow": "0 0 0 8px hsl(234 75.4% 12.7% / 0.1)",
97
+ "color": "#080D39",
98
+ "outline": 0,
99
+ },
100
+ "&:hover": Object {
101
+ "color": "#080D39",
50
102
  },
51
- "color": "#777777",
52
- "cursor": "pointer",
103
+ "color": "#5A5D7B",
104
+ "font": "300 16px/1.5 'OccText', sans-serif",
53
105
  "textDecoration": "none",
106
+ "transition": "all cubic-bezier(0.25,0.46,0.45,0.94) 0.2s",
54
107
  },
55
- "list": Object {
56
- "&:not(:first-child)": Object {
57
- "marginLeft": 16,
108
+ "linkDivider": Object {
109
+ "@media (min-width: 768px)": Object {
110
+ "display": "block",
58
111
  },
112
+ "alignSelf": "stretch",
113
+ "backgroundColor": "#6C6F89",
114
+ "display": "none",
115
+ "margin": Array [
116
+ "2px",
117
+ 0,
118
+ ],
119
+ "width": 1,
59
120
  },
60
- "listElement": Object {
61
- "&:first-child": Object {
62
- "paddingLeft": 0,
121
+ "listContainer": Object {
122
+ "@media (min-width: 576px)": Object {
123
+ "flexBasis": "calc(50% - 16px)",
63
124
  },
64
- "&:not(:last-child)": Object {
65
- "&::after": Object {
66
- "content": "\\"|\\"",
67
- "position": "absolute",
68
- "right": -2,
69
- },
125
+ "@media (min-width: 992px)": Object {
126
+ "flexBasis": "calc(25% - 24px)",
70
127
  },
71
- "display": "inline-block",
72
- "paddingLeft": 16,
73
- "paddingRight": 16,
74
- "position": "relative",
128
+ "flexBasis": "100%",
75
129
  },
76
- "mobileListElement": Object {
130
+ "listElement": Object {
131
+ "@media (min-width: 768px)": Object {
132
+ "display": "inline-block",
133
+ "position": "relative",
134
+ },
77
135
  "display": "block",
78
- "paddingBottom": 8,
79
- "paddingLeft": 0,
136
+ "textAlign": "center",
137
+ },
138
+ "socialMediaContainer": Object {
139
+ "columnGap": "4px",
140
+ "direction": "row",
141
+ "display": "flex",
80
142
  },
81
143
  }
82
144
  `;
@@ -56,6 +56,7 @@ var _default = {
56
56
  font: (0, _styles.parseFontValue)(_fonts["default"]['body-regular']),
57
57
  color: _colors["default"].text.corp.secondary,
58
58
  textDecoration: 'none',
59
+ cursor: 'pointer',
59
60
  transition: 'all cubic-bezier(0.25,0.46,0.45,0.94) 0.2s',
60
61
  '&:hover': {
61
62
  color: _colors["default"].text.corp.primary
@@ -32,7 +32,7 @@ var _default = (_conFluid$con$Media = {
32
32
  },
33
33
  con: {
34
34
  width: _grid["default"].full,
35
- margin: 'auto',
35
+ margin: '0 auto',
36
36
  padding: [0, _spacing["default"]['size-3']]
37
37
  }
38
38
  }, _defineProperty(_conFluid$con$Media, "@media (min-width: ".concat(_grid["default"].xs, "px)"), {
@@ -202,7 +202,7 @@ var Modal = /*#__PURE__*/function (_React$Component) {
202
202
  className: classes.imgTop
203
203
  }), /*#__PURE__*/_react["default"].createElement(_Text["default"], {
204
204
  tag: "div",
205
- className: "".concat(classes.contentChild).concat(!title && !onClose ? " ".concat(classes.noHeader) : '').concat(!mainBtn ? " ".concat(classes.noFooter) : '')
205
+ className: "".concat(classes.contentChild).concat(!title && !onClose ? " ".concat(classes.noHeader) : '').concat(!mainBtn ? " ".concat(classes.noFooter) : '').concat(imgTop && imgTop.img ? " ".concat(classes.imgTopPadding) : '')
206
206
  }, children)), mainBtn && /*#__PURE__*/_react["default"].createElement("div", {
207
207
  className: "".concat(classes.footer).concat(footerBorder ? " ".concat(classes.footerBorder) : '')
208
208
  }, secBtn && /*#__PURE__*/_react["default"].createElement(_Button["default"], _extends({
@@ -169,6 +169,9 @@ Object {
169
169
  "objectFit": "cover",
170
170
  "width": "100%",
171
171
  },
172
+ "imgTopPadding": Object {
173
+ "paddingTop": "24px",
174
+ },
172
175
  "lg": Object {
173
176
  "width": 820,
174
177
  },
@@ -258,6 +258,9 @@ var _default = {
258
258
  }, "@media screen and (min-width:".concat(_grid["default"].sm, "px)"), {
259
259
  top: _spacing["default"].medium,
260
260
  right: _spacing["default"].medium
261
- })
261
+ }),
262
+ imgTopPadding: {
263
+ paddingTop: _spacing2["default"]['size-5']
264
+ }
262
265
  };
263
266
  exports["default"] = _default;
@@ -115,10 +115,6 @@ Object {
115
115
  "color": "#664a0e",
116
116
  },
117
117
  "maxWidth": Object {
118
- "margin": Array [
119
- 0,
120
- "auto",
121
- ],
122
118
  "maxWidth": "1200px",
123
119
  },
124
120
  "noBorderRadius": Object {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@occmundial/occ-atomic",
3
- "version": "3.0.0-beta.50",
3
+ "version": "3.0.0-beta.52",
4
4
  "description": "Collection of shareable styled React components for OCC applications.",
5
5
  "homepage": "http://occmundial.github.io/occ-atomic",
6
6
  "main": "build/index.js",