Merge pull request #4530 from bbc/logo-allignment

Updated svg wrapper max width to be in line with datestamp
BBC-archive · Aug 4, 2021 · a5d3037 · a5d3037
2 parents 416bed9 + 582216f
commit a5d3037
Show file tree

Hide file tree

Showing 5 changed files with 9 additions and 8 deletions.
diff --git a/package.json b/package.json
@@ -66,7 +66,7 @@
     "@bbc/gel-foundations": "6.1.3",
     "@bbc/moment-timezone-include": "1.1.8",
     "@bbc/psammead-assets": "3.1.9",
-    "@bbc/psammead-brand": "7.3.2",
+    "@bbc/psammead-brand": "7.3.3",
     "@bbc/psammead-bulleted-list": "3.1.0",
     "@bbc/psammead-bulletin": "5.0.36",
     "@bbc/psammead-byline": "3.0.19",

diff --git a/packages/components/psammead-brand/CHANGELOG.md b/packages/components/psammead-brand/CHANGELOG.md
@@ -3,6 +3,7 @@
 <!-- prettier-ignore -->
 | Version | Description |
 | ------- | ----------- |
+| 7.3.3 | [PR#4530](https://github.com/bbc/psammead/pull/4530) SVG Wrapper component max-width updated |
 | 7.3.2 | [PR#4497](https://github.com/bbc/psammead/pull/4497) Bump psammead-styles |
 | 7.3.1 | [PR#4486](https://github.com/bbc/psammead/pull/4486) upgrade minor/patch dependencies |
 | 7.3.0 | [PR#4452](https://github.com/bbc/psammead/pull/4452) Add linkId prop |

diff --git a/packages/components/psammead-brand/package.json b/packages/components/psammead-brand/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@bbc/psammead-brand",
-  "version": "7.3.2",
+  "version": "7.3.3",
   "main": "dist/index.js",
   "module": "esm/index.js",
   "sideEffects": false,

diff --git a/packages/components/psammead-brand/src/__snapshots__/index.test.jsx.snap b/packages/components/psammead-brand/src/__snapshots__/index.test.jsx.snap
@@ -32,7 +32,7 @@ exports[`Brand should render correctly with link not provided 1`] = `
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
-  max-width: 80rem;
+  max-width: 78rem;
   margin: 0 auto;
 }
 
@@ -169,7 +169,7 @@ exports[`Brand should render correctly with link provided 1`] = `
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
-  max-width: 80rem;
+  max-width: 78rem;
   margin: 0 auto;
 }
 
@@ -328,7 +328,7 @@ exports[`Brand should render correctly with no service Localised Name 1`] = `
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
-  max-width: 80rem;
+  max-width: 78rem;
   margin: 0 auto;
 }
 
@@ -460,7 +460,7 @@ exports[`Brand should render correctly with transparent borders 1`] = `
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
-  max-width: 80rem;
+  max-width: 78rem;
   margin: 0 auto;
 }
 

diff --git a/packages/components/psammead-brand/src/index.jsx b/packages/components/psammead-brand/src/index.jsx
@@ -6,7 +6,6 @@ import {
   GEL_GROUP_0_SCREEN_WIDTH_MAX,
   GEL_GROUP_2_SCREEN_WIDTH_MIN,
   GEL_GROUP_3_SCREEN_WIDTH_MIN,
-  GEL_GROUP_5_SCREEN_WIDTH_MIN,
 } from '@bbc/gel-foundations/breakpoints';
 import {
   GEL_SPACING_HLF,
@@ -18,6 +17,7 @@ const SVG_TOP_OFFSET_BELOW_400PX = '0.625rem'; // 10px
 const SVG_BOTTOM_OFFSET_BELOW_400PX = '0.375rem'; // 6px
 const SVG_BOTTOM_OFFSET_ABOVE_400PX = '0.75rem'; // 12px
 const SVG_BOTTOM_OFFSET_ABOVE_600PX = '1.25rem'; // 20px
+const SVG_WRAPPER_MAX_WIDTH_ABOVE_1280PX = '78rem';
 const SCRIPT_LINK_OFFSET_BELOW_240PX = 52;
 const PADDING_AROUND_SVG_BELOW_400PX = 16;
 const PADDING_AROUND_SVG_ABOVE_400PX = 28;
@@ -33,7 +33,7 @@ const SvgWrapper = styled.div`
   justify-content: space-between;
   align-items: center;
   flex-wrap: wrap;
-  max-width: ${GEL_GROUP_5_SCREEN_WIDTH_MIN};
+  max-width: ${SVG_WRAPPER_MAX_WIDTH_ABOVE_1280PX};
   margin: 0 auto;
 
   @media (max-width: ${GEL_GROUP_0_SCREEN_WIDTH_MAX}) {