@qlean/york-web - npm Package Compare versions

Comparing version 0.3.6-beta-26 to 0.3.6-beta-27

lib/components/FloatingControls/index.js

@@ -45,3 +45,3 @@ "use strict";
   componentId: "sc-10u4uj2-0"
-})(["z-index:10;position:fixed;right:", "px;bottom:", "px;@media (max-width:420px){right:", "px;left:", "px;}"], (0, _styles.g)(4), (0, _styles.g)(4), (0, _styles.g)(2), (0, _styles.g)(2));
+})(["z-index:10;position:fixed;right:", "px;bottom:", "px;@media (max-width:420px){right:", "px;left:", "px;}", ""], (0, _styles.g)(4), (0, _styles.g)(4), (0, _styles.g)(2), (0, _styles.g)(2), _styles.media.mobile("\n    bottom: ".concat((0, _styles.g)(2), "px;\n  ")));
 
@@ -48,0 +48,0 @@ var StyledButtonWrapper = _styledComponents.default.div.withConfig({

lib/components/Navigation/Header/index.js

@@ -43,3 +43,3 @@ "use strict";
   componentId: "sc-1aeh21j-0"
-})(["z-index:1;padding:0 ", "px;", ";"], (0, _styles.g)(4), function (_ref) {
+})(["z-index:1;padding:0 ", "px;", ";"], (0, _styles.g)(6), function (_ref) {
   var isMenuOpened = _ref.isMenuOpened;
@@ -53,4 +53,4 @@ return "\n    ".concat(_styles.media.mobile("\n      background: ".concat(isMenuOpened ? _yorkCore.colors.white : 'none', ";\n    ")), ";\n  ");
 })(["height:", "px;", ";"], (0, _styles.g)(12), function (_ref2) {
-  var isMenuOpened = _ref2.isMenuOpened;
-  return "\n    ".concat(_styles.media.mobile("\n      border-bottom: 1px solid ".concat(isMenuOpened ? _yorkCore.colors.silver : 'transparent', ";\n    ")), ";\n  ");
+  var withBorder = _ref2.withBorder;
+  return "\n    ".concat(_styles.media.mobile("\n      border-bottom: 1px solid ".concat(withBorder ? _yorkCore.colors.silver : 'transparent', ";\n    ")), ";\n  ");
 });
@@ -66,3 +66,4 @@ var StyledToggler = (0, _styledComponents.default)(_Toggler.default).withConfig({
       preset = _ref3.preset,
-      presetMobile = _ref3.presetMobile;
+      presetMobile = _ref3.presetMobile,
+      withBorder = _ref3.withBorder;
   return _react.default.createElement(StyledHeaderWrapper, {
@@ -73,3 +74,3 @@ isMenuOpened: isMenuOpened
     justifyContentMobile: "space-between",
-    isMenuOpened: isMenuOpened
+    withBorder: withBorder || isMenuOpened
   }, _react.default.createElement(_HeaderLogo.default, {
@@ -87,2 +88,3 @@ color: isMenuOpened ? 'black' : _utils.presets[preset].logo,
   isMenuOpened: _propTypes.default.bool.isRequired,
+  withBorder: _propTypes.default.bool,
   toggleMenu: _propTypes.default.func.isRequired,
@@ -89,0 +91,0 @@ preset: _propTypes.default.oneOf(['lightBackground', 'darkBackground']),

lib/components/Navigation/index.js

@@ -93,3 +93,4 @@ "use strict";
           preset = _this$props.preset,
-          presetMobile = _this$props.presetMobile;
+          presetMobile = _this$props.presetMobile,
+          withBorder = _this$props.withBorder;
       return _react.default.createElement(StyledNavigation, {
@@ -104,3 +105,4 @@ justifyContent: "space-between",
         isMenuOpened: isMenuOpened,
-        toggleMenu: this.toggleMenu
+        toggleMenu: this.toggleMenu,
+        withBorder: withBorder
       }), _react.default.createElement(_Menu.default, {
@@ -120,3 +122,4 @@ preset: preset,
   preset: _propTypes.default.oneOf(Object.keys(_utils.presets)),
-  presetMobile: _propTypes.default.oneOf(Object.keys(_utils.presets))
+  presetMobile: _propTypes.default.oneOf(Object.keys(_utils.presets)),
+  withBorder: _propTypes.default.bool
 });
@@ -123,0 +126,0 @@

package.json

 {
   "name": "@qlean/york-web",
-  "version": "0.3.6-beta-26",
+  "version": "0.3.6-beta-27",
   "description": "",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

src/components/FloatingControls/index.js

@@ -5,3 +5,3 @@ import React, { Fragment } from 'react';
 
-import { transitions, g, shadows } from 'utils/styles';
+import { transitions, g, shadows, media } from 'utils/styles';
 import { messengersShape } from 'utils/propTypes';
@@ -24,2 +24,5 @@
   }
+  ${media.mobile(`
+    bottom: ${g(2)}px;
+  `)}
 `;
@@ -26,0 +29,0 @@

src/components/Navigation/Header/index.js

@@ -15,3 +15,3 @@ import React from 'react';
   z-index: 1;
-  padding: 0 ${g(4)}px;
+  padding: 0 ${g(6)}px;
   ${({ isMenuOpened }) => `
@@ -26,5 +26,5 @@ ${media.mobile(`
   height: ${g(12)}px;
-  ${({ isMenuOpened }) => `
+  ${({ withBorder }) => `
     ${media.mobile(`
-      border-bottom: 1px solid ${isMenuOpened ? colors.silver : 'transparent'};
+      border-bottom: 1px solid ${withBorder ? colors.silver : 'transparent'};
     `)};
@@ -42,3 +42,3 @@ `};
 const Header = ({
-  isMenuOpened, toggleMenu, preset, presetMobile,
+  isMenuOpened, toggleMenu, preset, presetMobile, withBorder,
 }) => (
@@ -49,3 +49,3 @@ <StyledHeaderWrapper isMenuOpened={isMenuOpened}>
       justifyContentMobile="space-between"
-      isMenuOpened={isMenuOpened}
+      withBorder={withBorder || isMenuOpened}
     >
@@ -67,2 +67,3 @@ <HeaderLogo
   isMenuOpened: PropTypes.bool.isRequired,
+  withBorder: PropTypes.bool,
   toggleMenu: PropTypes.func.isRequired,
@@ -69,0 +70,0 @@ preset: PropTypes.oneOf(['lightBackground', 'darkBackground']),

src/components/Navigation/index.js

@@ -26,2 +26,3 @@ import React, { Component } from 'react';
     presetMobile: PropTypes.oneOf(Object.keys(presets)),
+    withBorder: PropTypes.bool,
   }
@@ -37,3 +38,5 @@
     const { isMenuOpened } = this.state;
-    const { menuItems, preset, presetMobile } = this.props;
+    const {
+      menuItems, preset, presetMobile, withBorder,
+    } = this.props;
     return (
@@ -51,2 +54,3 @@ <StyledNavigation
           toggleMenu={this.toggleMenu}
+          withBorder={withBorder}
         />
@@ -53,0 +57,0 @@ <Menu preset={preset} isMenuOpened={isMenuOpened} menuItems={menuItems}/>

No alert changes

Improved metrics

Total package byte prevSize

210104

increased by0.23%

Lines of code

4112

increased by0.32%

No dependency changes