登录样式

src/pages/login/login.module.scss

@@ -1,5 +1,6 @@
 .container {
   position: relative;
+  padding: 0 30rpx;
 }
 
 .navbar,
@@ -39,8 +40,7 @@
   justify-content: center;
   align-items: center;
   gap: 12px;
-  margin: 0 auto;
+  margin: 20rpx auto;
-  padding: 25px 0;
 
   a {
 

src/pages/login/login.tsx

@@ -1,6 +1,6 @@
 import {FC, useEffect, useRef, useState} from "react";
 import {Profile} from "@/store";
-import {Button, Form, Image, Input, Text, View} from "@tarojs/components";
+import {Form, Image, Input, Text, View} from "@tarojs/components";
 import Taro from "@tarojs/taro";
 import styles from './login.module.scss'
 import Loading from "@/components/loading";
@@ -9,6 +9,7 @@ import {LoginData, userApi} from "@/api";
 import {regexTel} from "@/utils/regu";
 import CustomPageContainer from "@/components/custom-page-container/custom-page-container";
 import {loginApi, LoginParams} from "@/api/login";
+import MyButton from "@/components/button/MyButton";
 
 interface BingProps {
   code: string
@@ -74,24 +75,23 @@ const Bing: FC<BingProps> = ({code, catch_key}: BingProps) => {
           </View>
         </View>
 
-        <Button className={'button ' + styles.submit} style='margin:30px auto' formType='submit'
+        <MyButton className={styles.submit} formType='submit' disabled={loading}>提交</MyButton>
-                disabled={loading}>提交</Button>
       </Form>
     </View>
   )
 }
 
-function getMenuButtonBoundingClientRect() {
+// function getMenuButtonBoundingClientRect() {
-  if (process.env.TARO_ENV === 'h5') {
+//   if (process.env.TARO_ENV === 'h5') {
-    return {top: 0, bottom: 44}
+//     return {top: 0, bottom: 44}
-  }
+//   }
-  return Taro.getMenuButtonBoundingClientRect()
+//   return Taro.getMenuButtonBoundingClientRect()
-}
+// }
 
 const Login: FC = () => {
-  const {statusBarHeight = 0} = Taro.getSystemInfoSync()
+  // const {statusBarHeight = 0} = Taro.getSystemInfoSync()
-  const bbc = getMenuButtonBoundingClientRect();
+  // const bbc = getMenuButtonBoundingClientRect();
-  const navHeight = bbc.bottom + (bbc.top - statusBarHeight) - statusBarHeight
+  // const navHeight = bbc.bottom + (bbc.top - statusBarHeight) - statusBarHeight
 
   const [isLoading, setLoading] = useState(false)
   const [error, setError] = useState<string | null>(null)
@@ -187,9 +187,10 @@ const Login: FC = () => {
       <View className={styles.loginTips}>
         <Text>请完成微信授权以继续使用！</Text>
       </View>
-      <Button className={'button ' + styles.submit} onClick={login} disabled={isLoading}>
+      <MyButton onClick={login} disabled={isLoading}>
+        <View className={styles.submit}>
           {isLoading ? <Loading/> : null}
-        <View className={styles.navbar} style={`height:${navHeight}px;margin-top:${statusBarHeight}px`}>
+          <View className={styles.navbar}>
             <Text>微信授权登录</Text>
             {error ? <View className={styles.errorTips}>
               <View style={{flex: 1}}>{error}</View>
@@ -198,7 +199,8 @@ const Login: FC = () => {
               </View>
             </View> : null}
           </View>
-      </Button>
+        </View>
+      </MyButton>
     </View>
   )
 }