fix: mobile image generating

src/components/Card.js

@@ -14,6 +14,14 @@ const Wrapper = styled.div`
   /* border: 1px solid #fff; */
   box-shadow: -13px 18px 10px rgba(0, 0, 0, 0.2);
   margin-top: -4rem;
+  &.starting {
+    margin: 0 auto;
+    margin-top: -4rem;
+    box-shadow: none;
+    .title {
+      padding-left: 0.3rem;
+    }
+  }
   &.img {
     width: 80vw;
     padding: 0;
@@ -26,7 +34,6 @@ const Wrapper = styled.div`
     }
   }
   .circle {
-    position: relative;
     width: 18.4rem;
     height: 18.4rem;
     border-radius: 50%;
@@ -56,15 +63,6 @@ const Wrapper = styled.div`
     font-family: 'TChinese', 'SimSun', 'FangSong', 'STSong', 'STZhongsong', 'LiSu', 'KaiTi',
       'Microsoft YaHei';
   }
-  .btn {
-    font-size: 1.4rem;
-
-    position: absolute;
-    bottom: -6rem;
-    left: 50%;
-    transform: translateX(-50%);
-    padding: 0.4rem 0.8rem;
-  }
 `;
 const ua = navigator.userAgent;
 const isiOSwebview = /(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/i.test(ua);
@@ -99,7 +97,7 @@ const Card = ({ color: { hex, name, RGB, figure = 'default.png' }, setName = ''
       <Download
         isWebview={isWebview}
         full={false}
-        name={name}
+        name={`卡片-${name}`}
         query="#SHARE_CARD"
         style={{ bottom: '-5rem' }}
       />

src/components/IconBack.js

@@ -9,6 +9,7 @@ const IconBack = () => {
       <Icon
         icon={
           <svg
+            style={{ width: '2rem', height: '2rem' }}
             t="1569329382185"
             className="icon"
             viewBox="0 0 1024 1024"

src/pages/share.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import styled from 'styled-components';
-import Tip from '../components/Tip';
 
 import { useShareColor } from '../hooks';
 import Card from '../components/Card';
@@ -16,9 +15,6 @@ const Wrapper = styled.section`
     left: 1rem;
   }
 `;
-const ua = navigator.userAgent;
-const isiOSwebview = /(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/i.test(ua);
-const isWebview = ua.toLowerCase().indexOf('micromessenger') > -1 || isiOSwebview;
 
 const Share = ({ match }) => {
   const { id } = match.params;
@@ -30,7 +26,6 @@ const Share = ({ match }) => {
     <Wrapper>
       <IconBack />
       <Card color={color} setName={set.name} />
-      {isWebview && <Tip>APP内打开，图片生成功能可能受限，建议在浏览器内打开</Tip>}
     </Wrapper>
   );
 };