bam32bittheme - npm Package Compare versions

Comparing version 2.1.54 to 2.1.55

dist/layout/HeaderActions.js

@@ -35,2 +35,3 @@ "use strict";
     sidebarCollapsed,
+    collapseHeader,
     prodURL = window.location.origin,
@@ -86,4 +87,5 @@ wssURL = 'wss://' + window.location.host + '/portal/bamoe-notification'
       justifyContent: 'flex-end',
-      transition: 'all 0.2s ease',
-      alignItems: isMobile ? 'center' : 'end'
+      transition: 'all 1s ease',
+      alignItems: isMobile ? 'center' : 'end',
+      opacity: collapseHeader ? 0 : 1
     }
@@ -90,0 +92,0 @@ }, /*#__PURE__*/_react.default.createElement(_material.Tooltip, {

dist/layout/Layout.js

@@ -16,7 +16,5 @@ "use strict";
 var _react = _interopRequireWildcard(require("react"));
-var _reactIntl = require("react-intl");
 var _LoadingScreen = _interopRequireDefault(require("../components/LoadingScreen"));
 var _RouteHeader = _interopRequireDefault(require("./RouteHeader"));
 var _Sidebar = _interopRequireDefault(require("./Sidebar"));
-var _PopUpOkey = _interopRequireDefault(require("../components/PopUpOkey"));
 const _excluded = ["children"];
@@ -45,9 +43,6 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
   const [isScroll, setIsScroll] = (0, _react.useState)(false);
-  const [info, setInfo] = (0, _react.useState)(false);
   const theme = (0, _material.useTheme)();
-  const {
-    $t: t
-  } = (0, _reactIntl.useIntl)();
   const isMobile = (0, _material.useMediaQuery)(theme.breakpoints.down('md'));
   const initialSidebarCollapsed = localStorage.getItem('sidebarCollapsed') === 'true';
+  const initialHeaderCollapsedCollapsed = localStorage.getItem('headerCollapsed') === 'true';
   const isHeaderVisible = localStorage.getItem('headerVisible') !== 'false';
@@ -57,3 +52,7 @@ const saveSidebarCollapsedToLocalStorage = value => {
   };
+  const saveHeaderCollapsedToLocalStorage = value => {
+    localStorage.setItem('headerCollapsed', value.toString());
+  };
   const [sidebarCollapsed, setSidebarCollapsed] = (0, _react.useState)(initialSidebarCollapsed);
+  const [collapseHeader, setCollapseHeader] = (0, _react.useState)(initialHeaderCollapsedCollapsed);
   const [showMobileMenu, setShowMobileMenu] = (0, _react.useState)(false);
@@ -77,2 +76,5 @@ const Main = (0, _react.useCallback)(_ref2 => {
   (0, _react.useEffect)(() => {
+    setCollapseHeader(isMobile ? false : initialHeaderCollapsedCollapsed);
+  }, [initialHeaderCollapsedCollapsed, isMobile]);
+  (0, _react.useEffect)(() => {
     const handleScroll = () => {
@@ -132,3 +134,3 @@ const scrollPosition = window.scrollY;
       },
-      mt: isHeaderVisible !== false ? +theme.spacing(6.25).replace('px', '') + (isMobile ? 80 : 150) + 'px' : 0,
+      mt: isHeaderVisible !== false ? collapseHeader ? 0 : +theme.spacing(6.25).replace('px', '') + (isMobile ? 80 : 150) + 'px' : 0,
       minHeight: isHeaderVisible !== false ? "calc(100vh - ".concat(+theme.spacing(6.25).replace('px', '') + 150, "px)") : '',
@@ -145,2 +147,3 @@ display: 'flex',
     disableSidebar: disableSidebar,
+    showMobileMenu: showMobileMenu,
     sidebarCollapsed: sidebarCollapsed,
@@ -150,2 +153,5 @@ setShowMobileMenu: setShowMobileMenu,
     title: pageTitle,
+    saveHeaderCollapsedToLocalStorage: saveHeaderCollapsedToLocalStorage,
+    setCollapseHeader: setCollapseHeader,
+    collapseHeader: collapseHeader,
     suffix: pageTitleSuffix,
@@ -152,0 +158,0 @@ onLogout: onLogout,

dist/layout/RouteHeader.js

@@ -17,2 +17,3 @@ "use strict";
 var _HeaderActions = _interopRequireDefault(require("./HeaderActions"));
+var _ExpandLess = _interopRequireDefault(require("@mui/icons-material/ExpandLess"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -44,3 +45,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
     wssURL,
-    bodyPadding
+    bodyPadding,
+    setCollapseHeader,
+    collapseHeader,
+    saveHeaderCollapsedToLocalStorage,
+    showMobileMenu
   } = _ref;
@@ -58,4 +63,40 @@ const theme = (0, _material.useTheme)();
   }, [title, suffix]);
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Box, {
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !isMobile && /*#__PURE__*/_react.default.createElement(_material.Box, {
+    sx: {
+      cursor: 'pointer',
+      position: 'fixed',
+      left: disableSidebar || container || isMobile ? {
+        xs: theme.spacing(4),
+        md: theme.spacing(8),
+        lg: theme.spacing(12)
+      } : {
+        xs: calcSidebarLeft(theme, sidebarCollapsed, 6),
+        md: calcSidebarLeft(theme, sidebarCollapsed, 8),
+        lg: calcSidebarLeft(theme, sidebarCollapsed, 12)
+      },
+      top: isMobile ? collapseHeader ? 0 : 90 : isScroll ? collapseHeader ? 0 : 90 : 0,
+      background: theme.palette.primary.main,
+      display: 'flex',
+      transition: isMobile ? showMobileMenu ? 'all 0.3s 0.3s ease' : 'all 0.3s ease' : sidebarCollapsed ? 'all 0.35s 0.32s cubic-bezier(.47,1.64,.41,.8), left 0.35s 0.32s ease' : 'all 0.35s ease, left 0.35s ease',
+      justifyContent: 'center',
+      alignItems: 'center',
+      color: theme.palette.background.default,
+      borderRadius: '0 0 8px 8px',
+      width: isMobile ? 28 : 24,
+      height: isMobile ? 28 : 18,
+      zIndex: 2
+    },
+    onClick: () => {
+      const newHeaderCollapse = !collapseHeader;
+      setCollapseHeader(newHeaderCollapse);
+      saveHeaderCollapsedToLocalStorage(newHeaderCollapse);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_ExpandLess.default, {
     sx: _objectSpread({
+      transition: 'all 0.2s 0.30s cubic-bezier(.47,1.64,.41,.8)'
+    }, collapseHeader && {
+      transform: 'rotate(180deg)'
+    })
+  })), /*#__PURE__*/_react.default.createElement(_material.Box, {
+    sx: _objectSpread({
       position: 'fixed',
@@ -88,8 +129,11 @@ overflow: 'hidden',
       borderRadius: 5,
+      transform: collapseHeader ? 'scaleY(0)' : 'none',
       height: 150,
-      p: 3.75,
+      p: collapseHeader ? 1 : 3.75,
+      py: collapseHeader ? 0 : 3.75,
       transition: 'all 0.2s ease' + (sidebarCollapsed ? ', left 0.35s 0.32s ease, right 0.35s 0.32s ease' : ', left 0.35s ease, right 0.35s ease') + ', padding-left 0.35s 0.35s ease, padding-right 0.35s 0.35s ease, margin-right 0s ease',
+      transformOrigin: 'top',
       background: "linear-gradient(90deg, ".concat(theme.palette.primary.main, " 0%, ").concat(theme.palette.primary.dark, " 100%)"),
       boxShadow: 3
-    }, (isScroll || isMobile) && {
+    }, (isScroll || isMobile) && !collapseHeader && {
       top: 0,
@@ -111,2 +155,4 @@ px: {
       flex: 1,
+      opacity: collapseHeader ? 0 : 1,
+      transition: 'all 1s ease',
       flexDirection: 'column',
@@ -179,2 +225,3 @@ justifyContent: 'space-between'
   }, newPageTitle))), hasUser && /*#__PURE__*/_react.default.createElement(_HeaderActions.default, {
+    collapseHeader: collapseHeader,
     onTaskListChange: onTaskListChange,
@@ -181,0 +228,0 @@ sidebarCollapsed: sidebarCollapsed,

package.json

 {
   "name": "bam32bittheme",
-  "version": "2.1.54",
+  "version": "2.1.55",
   "private": false,
@@ -5,0 +5,0 @@ "description": "32bit Theme for Material UI v5.x",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1556132

increased by0.16%

Lines of code

4990

increased by1.11%

No dependency changes