@occmundial/occ-atomic 3.0.0-beta.55 → 3.0.0-beta.57

package/CHANGELOG.md

@@ -1,3 +1,18 @@
+# [3.0.0-beta.57](https://github.com/occmundial/occ-atomic/compare/v3.0.0-beta.56...v3.0.0-beta.57) (2024-09-04)
+
+
+### Bug Fixes
+
+* Set only padding vertical for footer container ([5a593ab](https://github.com/occmundial/occ-atomic/commit/5a593ab8f785ef3f5c04c5718d925227d17df39d))
+
+# [3.0.0-beta.56](https://github.com/occmundial/occ-atomic/compare/v3.0.0-beta.55...v3.0.0-beta.56) (2024-09-04)
+
+
+### Bug Fixes
+
+* Add default value for new props ([2841eae](https://github.com/occmundial/occ-atomic/commit/2841eaec4e570934f6b02f21f9e262892f3a33fd))
+* Add new props to set bg transparent and borders ([dd0a333](https://github.com/occmundial/occ-atomic/commit/dd0a3334ebc1b4edfa75d9a0d2520b2cccd14309))
+
 # [3.0.0-beta.55](https://github.com/occmundial/occ-atomic/compare/v3.0.0-beta.54...v3.0.0-beta.55) (2024-09-04)
 
 

package/build/Footer/Footer.js

@@ -39,12 +39,15 @@ var Footer = function Footer(_ref) {
       topElement = _ref.topElement,
       bottomLinksClassName = _ref.bottomLinksClassName,
       sectionDivider = _ref.sectionDivider,
-      classes = _ref.classes;
+      classes = _ref.classes,
+      footerDivider = _ref.footerDivider,
+      containerDivider = _ref.containerDivider,
+      transparent = _ref.transparent;
   return /*#__PURE__*/_react["default"].createElement("footer", {
-    className: classes.footer
+    className: "".concat(transparent ? classes.footerTransparent : classes.footer).concat(footerDivider ? " ".concat(classes.borderTop) : '')
   }, /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
     fluid: isFluid,
-    className: classes.footerContainer
+    className: "".concat(classes.footerContainer).concat(containerDivider ? " ".concat(classes.borderTop) : '')
   }, /*#__PURE__*/(0, _react.isValidElement)(topElement) ? topElement : '', columns.length ? /*#__PURE__*/_react["default"].createElement("section", {
     className: classes.column
   }, columns.map(function (column, index) {
@@ -145,11 +148,23 @@ Footer.propTypes = {
   bottomLinksClassName: _propTypes["default"].string,
 
   /** Flag to display an horizontal line between sections */
-  sectionDivider: _propTypes["default"].bool
+  sectionDivider: _propTypes["default"].bool,
+
+  /** Flag to display a border top in footer element */
+  footerDivider: _propTypes["default"].bool,
+
+  /** Flag to display a border top in footer container child */
+  containerDivider: _propTypes["default"].bool,
+
+  /** Flag to set transparent background color to footer element */
+  transparent: _propTypes["default"].bool
 };
 Footer.defaultProps = {
   bottomLinks: [],
-  columns: []
+  columns: [],
+  footerDivider: false,
+  containerDivider: false,
+  transparent: false
 };
 var _default = Footer;
 exports["default"] = _default;

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

@@ -23,6 +23,9 @@ Object {
     "flexDirection": "column",
     "gap": "16px",
   },
+  "borderTop": Object {
+    "borderTop": "1px solid #EDEDF1",
+  },
   "bottomContainer": Object {
     "@media (min-width: 768px)": Object {
       "rowGap": "24px",
@@ -50,34 +53,28 @@ Object {
   "column": Object {
     "@media (min-width: 576px)": Object {
       "columnGap": "16px",
-      "flexDirection": "row",
+      "gridTemplateColumns": "repeat(2, minmax(0, 1fr))",
       "rowGap": "40px",
     },
     "@media (min-width: 992px)": Object {
       "columnGap": "24px",
+      "gridTemplateColumns": "repeat(4, minmax(0, 1fr))",
       "rowGap": 0,
     },
-    "display": "flex",
-    "flexDirection": "column",
-    "flexWrap": "wrap",
+    "display": "grid",
   },
   "copyright": Object {
     "& > p": Object {
       "margin": 0,
     },
     "color": "#5A5D7B",
-    "font": "300 16px/1.5 'OccText', sans-serif",
+    "font": "300 14px/1.5 'OccText', sans-serif",
   },
   "divider": Object {
     "borderTop": "1px solid #EDEDF1",
   },
   "footer": Object {
     "backgroundColor": "#fff",
-    "borderTop": "1px solid #EDEDF1",
-    "padding": Array [
-      "40px",
-      0,
-    ],
   },
   "footerContainer": Object {
     "@media (min-width: 576px)": Object {
@@ -88,8 +85,15 @@ Object {
     },
     "display": "flex",
     "flexDirection": "column",
+    "padding": Array [
+      "40px",
+      0,
+    ],
     "rowGap": "24px",
   },
+  "footerTransparent": Object {
+    "backgroundColor": "transparent",
+  },
   "link": Object {
     "&:focus-visible": Object {
       "borderRadius": "4px",
@@ -101,7 +105,8 @@ Object {
       "color": "#080D39",
     },
     "color": "#5A5D7B",
-    "font": "300 16px/1.5 'OccText', sans-serif",
+    "cursor": "pointer",
+    "font": "300 14px/1.5 'OccText', sans-serif",
     "textDecoration": "none",
     "transition": "all cubic-bezier(0.25,0.46,0.45,0.94) 0.2s",
   },
@@ -118,15 +123,6 @@ Object {
     ],
     "width": 1,
   },
-  "listContainer": Object {
-    "@media (min-width: 576px)": Object {
-      "flexBasis": "calc(50% - 16px)",
-    },
-    "@media (min-width: 992px)": Object {
-      "flexBasis": "calc(25% - 24px)",
-    },
-    "flexBasis": "100%",
-  },
   "listElement": Object {
     "@media (min-width: 768px)": Object {
       "display": "inline-block",

package/build/Footer/styles.js

@@ -27,13 +27,19 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 var _default = {
   footer: {
-    backgroundColor: _colors["default"].bg.surface["default"],
-    borderTop: "1px solid ".concat(_colors["default"].border["default"].subtle),
-    padding: [_spacing["default"]['size-7'], 0]
+    backgroundColor: _colors["default"].bg.surface["default"]
+  },
+  footerTransparent: {
+    backgroundColor: 'transparent'
+  },
+  borderTop: {
+    borderTop: "1px solid ".concat(_colors["default"].border["default"].subtle)
   },
   footerContainer: (_footerContainer = {
     display: 'flex',
     flexDirection: 'column',
+    paddingTop: _spacing["default"]['size-7'],
+    paddingBottom: _spacing["default"]['size-7'],
     rowGap: _spacing["default"]['size-5']
   }, _defineProperty(_footerContainer, "@media (min-width: ".concat(_grid["default"].xs, "px)"), {
     rowGap: _spacing["default"]['size-7']

package/package.json

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