@titelmedia/bricks-age-gate - npm Package Compare versions

Comparing version 0.3.20 to 0.3.22

CHANGELOG.md

@@ -6,2 +6,13 @@ # Change Log
 
+## [0.3.22](https://github.com/titel-media/bricks-lerna/compare/v0.3.21...v0.3.22) (2022-01-25)
+
+
+### Bug Fixes
+
+* Change some style and fix the id for the main place ([c54f9a4](https://github.com/titel-media/bricks-lerna/commit/c54f9a4406dc4e27ea92ef159d635f6afb5be208))
+
+
+
+
+
 ## [0.3.20](https://github.com/titel-media/bricks-lerna/compare/v0.3.19...v0.3.20) (2022-01-25)
@@ -8,0 +19,0 @@

dist/index.js

@@ -35,3 +35,3 @@ "use strict";
   const titleRef = (0, _react.useRef)(null);
-  const rootRef = document.getElementById('root');
+  const rootRef = (0, _react.useRef)(document.getElementById('__gatsby') || document.getElementById('root'));
   (0, _react.useEffect)(() => {
@@ -52,3 +52,3 @@ buildTimeline();
   const buildTimeline = () => {
-    tlRef.current = _all.gsap.timeline().to(rootRef, {
+    tlRef.current = _all.gsap.timeline().to(rootRef.current, {
       duration: 0.4,
@@ -63,3 +63,3 @@ filter: 'blur(5px)'
   function closeAgeGate() {
-    tlRef.current = _all.gsap.timeline().to(rootRef, {
+    tlRef.current = _all.gsap.timeline().to(rootRef.current, {
       duration: 0.4,
@@ -69,2 +69,3 @@ filter: 'blur(0)'
       opacity: 0,
+      display: 'none',
       duration: 0.4
@@ -80,5 +81,5 @@ }, "<");
   const fluid = (logo === null || logo === void 0 ? void 0 : logo.fluid) || logo;
-  return _reactDom.default.createPortal(_react.default.createElement(_styles.Container, null, _react.default.createElement(_bricksTheme.default, null), _react.default.createElement(_styles.Content, {
+  return _reactDom.default.createPortal(_react.default.createElement(_styles.Container, {
     ref: containerRef
-  }, _react.default.createElement(_styles.Image, {
+  }, _react.default.createElement(_bricksTheme.default, null), _react.default.createElement(_styles.Content, null, _react.default.createElement(_styles.Image, {
     srcSet: fluid.srcSet,
@@ -85,0 +86,0 @@ src: fluid.src

dist/styles.js

@@ -18,2 +18,4 @@ "use strict";
   position: fixed;
+  top: 0;
+  left: 0;
   height: 100vh;
@@ -56,2 +58,3 @@ width: 100%;
 })}
+  margin: 32px 0;
 `;
@@ -58,0 +61,0 @@ exports.Title = Title;

lib/index.js

@@ -1,2 +0,2 @@
-import React, { useEffect, useRef } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import ReactDOM from 'react-dom';
@@ -18,4 +18,5 @@
   const titleRef = useRef(null);
-  const rootRef = document.getElementById('root');
 
+  const rootRef = useRef(document.getElementById('__gatsby') || document.getElementById('root'));
+
   useEffect(() => {
@@ -38,3 +39,3 @@ buildTimeline();
       .timeline()
-      .to(rootRef, { 
+      .to(rootRef.current, { 
         duration: 0.4,
@@ -48,6 +49,6 @@ filter: 'blur(5px)'})
       .timeline()
-      .to(rootRef, { 
+      .to(rootRef.current, { 
         duration: 0.4,
         filter: 'blur(0)'})
-      .to(containerRef.current, { opacity: 0, duration: 0.4}, "<");
+      .to(containerRef.current, { opacity: 0, display: 'none', duration: 0.4}, "<");
       enableBodyScroll(rootRef);
@@ -62,5 +63,5 @@ }
   return ReactDOM.createPortal(
-    <Container>
+    <Container ref={containerRef}>
       <GlobalFonts />
-      <Content ref={containerRef}>
+      <Content>
         <Image srcSet={fluid.srcSet} src={fluid.src} />
@@ -67,0 +68,0 @@ <Title ref={titleRef}>{title}</Title>

lib/styles.js

@@ -9,2 +9,4 @@ import styled from 'styled-components';
   position: fixed;
+  top: 0;
+  left: 0;
   height: 100vh;
@@ -44,2 +46,3 @@ width: 100%;
   })}
+  margin: 32px 0;
 `;
@@ -46,0 +49,0 @@

package.json

 {
   "name": "@titelmedia/bricks-age-gate",
-  "version": "0.3.20",
+  "version": "0.3.22",
   "description": "Now I’m the model of a modern major general / The venerated Virginian veteran whose men are all / Lining up, to put me up on a pedestal / Writin’ letters to relatives / Embellishin’ my elegance and eloquence / But the elephant is in the room / The truth is in ya face when ya hear the British cannons go / BOOM",
@@ -33,3 +33,3 @@ "keywords": [],
   "homepage": "https://github.com/titel-media/bricks-lerna#readme",
-  "gitHead": "b9c2d655313264ac33cae34251049a9af7f632fd"
+  "gitHead": "7b2b7879f2dd70b9c84f4daf945201cb114fbae4"
 }

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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

20074

increased by4.18%

Lines of code

315

increased by2.27%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes