From 27e46ba59c1c4416f20da13300759f07b280bf35 Mon Sep 17 00:00:00 2001
From: tristan <yangguochun@ddweilai.com>
Date: Fri, 27 Sep 2019 11:17:12 +0800
Subject: [PATCH] fix: scroll top

---
 src/components/Preview.js | 13 +++++++++----
 src/hooks.js              |  6 ++++++
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/components/Preview.js b/src/components/Preview.js
index 498b27a..2762699 100644
--- a/src/components/Preview.js
+++ b/src/components/Preview.js
@@ -35,8 +35,6 @@ const Wrapper = styled.section`
   &.starting {
     animation: none;
     transform: initial;
-    /* html2canvas bug? */
-    /* margin-top: -1rem; */
   }
   &.img {
     .downloadImg {
@@ -77,10 +75,15 @@ const Wrapper = styled.section`
       font-family: inherit;
     }
     > h2 {
-      font-size: 0.7rem;
+      font-size: 0.8rem;
+      word-break: keep-all;
       margin-top: 1rem;
       color: inherit;
       font-family: inherit;
+      .dot {
+        padding: 0 0.4rem;
+        font-weight: bold;
+      }
     }
   }
   .figure {
@@ -115,7 +118,9 @@ const Preview = ({ name, color, figure = 'default.png?width=8rem', closePreview
           );
         })}
         <h2>
-          {author} ·《{title}》
+          {author}
+          <span className="dot">·</span>
+          {title}
         </h2>
       </article>
 
diff --git a/src/hooks.js b/src/hooks.js
index cf9cae6..ece577d 100644
--- a/src/hooks.js
+++ b/src/hooks.js
@@ -109,6 +109,9 @@ const useShareColor = (id = null) => {
     let [setId] = id.split('-');
     tmpSet = Colors.find(set => set.id == setId);
     tmpColor = tmpSet.colors.find(c => c.id == id);
+    // 滑动到顶部
+    document.body.scrollTop = 0; // For Safari
+    document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
   }
   console.log('tmp color', tmpSet, tmpColor);
 
@@ -135,6 +138,9 @@ const useColor = () => {
     document.title = arr.length > 1 ? `${obj.name} - ${arr[1]}` : `${obj.name} - ${arr[0]}`;
     let metaThemeColor = document.querySelector('meta[name=theme-color]');
     metaThemeColor.setAttribute('content', obj.hex);
+    // 滑动到顶部
+    document.body.scrollTop = 0; // For Safari
+    document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
   };
   const reducer = (state, action) => {
     const { type, payload } = action;