Fix scroll

mechakin · Nov 22, 2021 · bb646a4 · bb646a4
1 parent 0411e3b
commit bb646a4
Show file tree

Hide file tree

Showing 4 changed files with 1 addition and 12 deletions.
diff --git a/package.json b/package.json
@@ -58,7 +58,6 @@
     "react-helmet": "^6.1.0",
     "react-transition-group": "^4.3.0",
     "scrollreveal": "^4.0.5",
-    "smooth-scroll": "^16.1.0",
     "styled-components": "^5.3.0"
   },
   "devDependencies": {

diff --git a/src/components/layout.js b/src/components/layout.js
@@ -4,12 +4,6 @@ import styled, { ThemeProvider } from 'styled-components';
 import { Head, Loader, Nav, Social, Email, Footer } from '@components';
 import { GlobalStyle, theme } from '@styles';
 
-// https://medium.com/@chrisfitkin/how-to-smooth-scroll-links-in-gatsby-3dc445299558
-if (typeof window !== 'undefined') {
-  // eslint-disable-next-line global-require
-  require('smooth-scroll')('a[href*="#"]');
-}
-
 const StyledContent = styled.div`
   display: flex;
   flex-direction: column;

diff --git a/src/styles/GlobalStyle.js b/src/styles/GlobalStyle.js
@@ -11,6 +11,7 @@ const GlobalStyle = createGlobalStyle`
   html {
     box-sizing: border-box;
     width: 100%;
+    scroll-behavior: smooth;
   }
 
   *,

diff --git a/yarn.lock b/yarn.lock
@@ -12281,11 +12281,6 @@ slugify@^1.4.4:
   resolved "https://registry.npmjs.org/slugify/-/slugify-1.5.1.tgz#ef268872982a3a3b18f213ddee8cd1a28ac7a130"
   integrity sha512-54gP60qIkxaUCFXORn/u+tNPqdTsqvqonB2nxjQV52wWTCuJJ4kbfU7URkpn8646Lr2T3CSh8ecDzzBK/dD9jA==
 
-smooth-scroll@^16.1.0:
-  version "16.1.3"
-  resolved "https://registry.npmjs.org/smooth-scroll/-/smooth-scroll-16.1.3.tgz#c5b68194b4186173f9f61065103ae4e26ce36885"
-  integrity sha512-ca9U+neJS/cbdScTBuUTCZvUWNF2EuMCk7oAx3ImdeRK5FPm+xRo9XsVHIkeEVkn7MBRx+ufVEhyveM4ZhaTGA==
-
 snapdragon-node@^2.0.1:
   version "2.1.1"
   resolved "https://registry.npmjs.org/snapdragon-node/-/snapdragon-node-2.1.1.tgz#6c175f86ff14bdb0724563e8f3c1b021a286853b"
-Original file line number
+Diff line change
@@ Expand Up / @@ -11,6 +11,7 @@ const GlobalStyle = createGlobalStyle` @@
       html {
         box-sizing: border-box;
         width: 100%;
+        scroll-behavior: smooth;
       }
       *,
@@ Expand Down @@