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

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [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)
+
+
+### Bug Fixes
+
+* Add margin zero to grid and add padding top for modal when img top ([cd5416c](https://github.com/occmundial/occ-atomic/commit/cd5416c2ce4fbf1000afd51938c2a24f56999eee))
+
 # [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)
 
 

package/build/Footer/Footer.js

@@ -136,7 +136,7 @@ Footer.propTypes = {
 
   /** Footer list className.  */
   listClassName: _propTypes["default"].string,
-  isFluid: _propTypes["default"]["boolean"],
+  isFluid: _propTypes["default"].bool,
 
   /** Custom component to render at the top of the footer, commonly used for brand logo */
   topElement: _propTypes["default"].node,
@@ -145,7 +145,7 @@ Footer.propTypes = {
   bottomLinksClassName: _propTypes["default"].string,
 
   /** Flag to display an horizontal line between sections */
-  sectionDivider: _propTypes["default"]["boolean"]
+  sectionDivider: _propTypes["default"].bool
 };
 Footer.defaultProps = {
   bottomLinks: [],

package/build/Footer/__snapshots__/Footer.test.js.snap

@@ -4,79 +4,141 @@ exports[`Footer matches the snapshot 1`] = `ShallowWrapper {}`;
 
 exports[`Footer styles matches the snapshot 1`] = `
 Object {
-  "bottomWrap": Object {
-    "borderTop": "1px solid #dddddd",
-    "paddingTop": 24,
+  "auxContainer": Object {
+    "@media (min-width: 992px)": Object {
+      "flexDirection": "row",
+      "gap": "64px",
+    },
+    "alignItems": "center",
+    "display": "flex",
+    "flexDirection": "column",
+    "gap": "24px",
+    "justifyContent": "center",
   },
-  "buttonMobile": Object {
-    "marginTop": 16,
+  "badgesContainer": Object {
+    "@media (min-width: 576px)": Object {
+      "flexDirection": "row",
+    },
+    "display": "flex",
+    "flexDirection": "column",
+    "gap": "16px",
   },
-  "column": Object {
-    "paddingBottom": 16,
+  "bottomContainer": Object {
+    "@media (min-width: 768px)": Object {
+      "rowGap": "24px",
+    },
+    "display": "flex",
+    "flexDirection": "column",
+    "rowGap": "16px",
   },
-  "footer": Object {
+  "bottomLinksContainer": Object {
+    "@media (min-width: 768px)": Object {
+      "alignItems": "stretch",
+      "flexDirection": "row",
+    },
+    "columnGap": "24px",
+    "display": "flex",
+    "flexDirection": "column",
+    "justifyContent": "center",
+    "rowGap": "16px",
+  },
+  "bottomSection": Object {
+    "display": "flex",
+    "flexDirection": "column",
+    "rowGap": "40px",
+  },
+  "column": Object {
+    "@media (min-width: 576px)": Object {
+      "columnGap": "16px",
+      "flexDirection": "row",
+      "rowGap": "40px",
+    },
     "@media (min-width: 992px)": Object {
-      "padding": Array [
-        32,
-        0,
-        32,
-      ],
+      "columnGap": "24px",
+      "rowGap": 0,
     },
-    "backgroundColor": "#f5f5f8",
+    "display": "flex",
+    "flexDirection": "column",
+    "flexWrap": "wrap",
+  },
+  "copyright": Object {
+    "& > p": Object {
+      "margin": 0,
+    },
+    "color": "#5A5D7B",
+    "font": "300 16px/1.5 'OccText', sans-serif",
+  },
+  "divider": Object {
+    "borderTop": "1px solid #EDEDF1",
+  },
+  "footer": Object {
+    "backgroundColor": "#fff",
+    "borderTop": "1px solid #EDEDF1",
     "padding": Array [
-      24,
+      "40px",
       0,
-      32,
     ],
   },
-  "footerWithoutColumns": Object {
+  "footerContainer": Object {
+    "@media (min-width: 576px)": Object {
+      "rowGap": "40px",
+    },
     "@media (min-width: 992px)": Object {
-      "padding": Array [
-        0,
-        0,
-        32,
-      ],
+      "rowGap": "48px",
     },
-    "backgroundColor": "#f5f5f8",
-    "padding": Array [
-      0,
-      0,
-      32,
-    ],
+    "display": "flex",
+    "flexDirection": "column",
+    "rowGap": "24px",
   },
   "link": Object {
-    "&:hover, &:focus, &:active": Object {
-      "color": "#777777",
+    "&:focus-visible": Object {
+      "borderRadius": "4px",
+      "boxShadow": "0 0 0 8px hsl(234 75.4% 12.7% / 0.1)",
+      "color": "#080D39",
+      "outline": 0,
+    },
+    "&:hover": Object {
+      "color": "#080D39",
     },
-    "color": "#777777",
-    "cursor": "pointer",
+    "color": "#5A5D7B",
+    "font": "300 16px/1.5 'OccText', sans-serif",
     "textDecoration": "none",
+    "transition": "all cubic-bezier(0.25,0.46,0.45,0.94) 0.2s",
   },
-  "list": Object {
-    "&:not(:first-child)": Object {
-      "marginLeft": 16,
+  "linkDivider": Object {
+    "@media (min-width: 768px)": Object {
+      "display": "block",
     },
+    "alignSelf": "stretch",
+    "backgroundColor": "#6C6F89",
+    "display": "none",
+    "margin": Array [
+      "2px",
+      0,
+    ],
+    "width": 1,
   },
-  "listElement": Object {
-    "&:first-child": Object {
-      "paddingLeft": 0,
+  "listContainer": Object {
+    "@media (min-width: 576px)": Object {
+      "flexBasis": "calc(50% - 16px)",
     },
-    "&:not(:last-child)": Object {
-      "&::after": Object {
-        "content": "\\"|\\"",
-        "position": "absolute",
-        "right": -2,
-      },
+    "@media (min-width: 992px)": Object {
+      "flexBasis": "calc(25% - 24px)",
     },
-    "display": "inline-block",
-    "paddingLeft": 16,
-    "paddingRight": 16,
-    "position": "relative",
+    "flexBasis": "100%",
   },
-  "mobileListElement": Object {
+  "listElement": Object {
+    "@media (min-width: 768px)": Object {
+      "display": "inline-block",
+      "position": "relative",
+    },
     "display": "block",
-    "paddingBottom": 8,
-    "paddingLeft": 0,
+    "textAlign": "center",
+  },
+  "socialMediaContainer": Object {
+    "columnGap": "4px",
+    "direction": "row",
+    "display": "flex",
   },
 }
 `;

package/build/Grid/styles.js

@@ -32,7 +32,7 @@ var _default = (_conFluid$con$Media = {
   },
   con: {
     width: _grid["default"].full,
-    margin: 'auto',
+    margin: '0 auto',
     padding: [0, _spacing["default"]['size-3']]
   }
 }, _defineProperty(_conFluid$con$Media, "@media (min-width: ".concat(_grid["default"].xs, "px)"), {

package/build/Modal/Modal.js

@@ -202,7 +202,7 @@ var Modal = /*#__PURE__*/function (_React$Component) {
         className: classes.imgTop
       }), /*#__PURE__*/_react["default"].createElement(_Text["default"], {
         tag: "div",
-        className: "".concat(classes.contentChild).concat(!title && !onClose ? " ".concat(classes.noHeader) : '').concat(!mainBtn ? " ".concat(classes.noFooter) : '')
+        className: "".concat(classes.contentChild).concat(!title && !onClose ? " ".concat(classes.noHeader) : '').concat(!mainBtn ? " ".concat(classes.noFooter) : '').concat(imgTop && imgTop.img ? " ".concat(classes.imgTopPadding) : '')
       }, children)), mainBtn && /*#__PURE__*/_react["default"].createElement("div", {
         className: "".concat(classes.footer).concat(footerBorder ? " ".concat(classes.footerBorder) : '')
       }, secBtn && /*#__PURE__*/_react["default"].createElement(_Button["default"], _extends({

package/build/Modal/__snapshots__/Modal.test.js.snap

@@ -169,6 +169,9 @@ Object {
     "objectFit": "cover",
     "width": "100%",
   },
+  "imgTopPadding": Object {
+    "paddingTop": "24px",
+  },
   "lg": Object {
     "width": 820,
   },

package/build/Modal/styles.js

@@ -258,6 +258,9 @@ var _default = {
   }, "@media screen and (min-width:".concat(_grid["default"].sm, "px)"), {
     top: _spacing["default"].medium,
     right: _spacing["default"].medium
-  })
+  }),
+  imgTopPadding: {
+    paddingTop: _spacing2["default"]['size-5']
+  }
 };
 exports["default"] = _default;

package/build/Tip/__snapshots__/Tip.test.js.snap

@@ -115,10 +115,6 @@ Object {
     "color": "#664a0e",
   },
   "maxWidth": Object {
-    "margin": Array [
-      0,
-      "auto",
-    ],
     "maxWidth": "1200px",
   },
   "noBorderRadius": Object {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@occmundial/occ-atomic",
-  "version": "3.0.0-beta.50",
+  "version": "3.0.0-beta.51",
   "description": "Collection of shareable styled React components for OCC applications.",
   "homepage": "http://occmundial.github.io/occ-atomic",
   "main": "build/index.js",