fix: 调整样式

packages/nutui-taro-demo-rn/src/app.config.ts

@@ -124,7 +124,7 @@ const subPackages = [
   }
 ];
 
-export default defineAppConfig ({
+export default defineAppConfig({
   pages: ['pages/index/index'],
   subPackages,
   window: {
@@ -133,4 +133,4 @@ export default defineAppConfig ({
     navigationBarTitleText: 'NutUI-React',
     navigationBarTextStyle: 'black'
   }
-})
+})

packages/nutui-taro-demo-rn/src/feedback/pages/pulltorefresh/index.config.ts

@@ -1,3 +1,3 @@
 export default {
-  navigationBarTitleText: 'Pulltorefresh'
+  navigationBarTitleText: 'PullToRefresh',
 }

packages/nutui-taro-demo-rn/src/feedback/pages/toast/index.tsx

@@ -1,2 +1,2 @@
-import Demo from '@/packages/toast/demo.taro'
-export default Demo
+import Demo from '@/packages/toast/demo.taro';
+export default Demo;

packages/nutui-taro-demo-rn/src/nav/pages/backtop/index.config.ts

@@ -1,3 +1,3 @@
 export default {
-  navigationBarTitleText: 'BackTop'
+  navigationBarTitleText: 'BackTop',
 }

src/packages/toast/Notification.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react'
 import classNames from 'classnames'
-import { Check, Loading, Failure, Tips } from '@nutui/icons-react'
+import { Success, Loading, Failure, Tips } from '@nutui/icons-react'
 import { render, unmount } from '@/utils/render'
 import Overlay from '@/packages/overlay/index'
 import { BasicComponent } from '@/utils/typings'
@@ -84,7 +84,7 @@ export default class Notification extends React.PureComponent<
     const { icon } = this.props
     if (typeof icon === 'string') {
       const iconNode = {
-        success: <Check />,
+        success: <Success />,
         fail: <Failure />,
         warn: <Tips />,
         loading: <Loading className="nut-icon-loading" />,

src/packages/toast/demo.taro.tsx

@@ -1,5 +1,4 @@
 import React from 'react'
-import Taro from '@tarojs/taro'
 import { ScrollView, View } from '@tarojs/components'
 import { Toast } from '@nutui/nutui-react-taro'
 import Header from '@/sites/components/header'
@@ -9,7 +8,7 @@ import Demo2 from './demos/taro/demo2'
 import Demo3 from './demos/taro/demo3'
 import Demo4 from './demos/taro/demo4'
 import Demo5 from './demos/taro/demo5'
-import { harmonyAndRn } from '@/utils/platform-taro'
+import { harmonyAndRn, web } from '@/utils/platform-taro'
 
 const ToastDemo = () => {
   const [translated] = useTranslate({
@@ -36,7 +35,7 @@ const ToastDemo = () => {
   return (
     <>
       <Header />
-      <ScrollView className={`demo ${Taro.getEnv() === 'WEB' ? 'web' : ''}`}>
+      <ScrollView className={`demo ${web() ? 'web' : ''}`}>
         <View className="h2">{translated.basic}</View>
         <Demo1 />
         <View className="h2">{translated.toastFunction}</View>

src/packages/toast/toast.harmony.css

@@ -85,27 +85,20 @@
   font-weight: 500;
   text-align: center;
 }
+.nut-toast-icon {
+  width: 24px;
+  height: 24px;
+  color: #ffffff;
+}
 .nut-toast-icon-wrapper {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-bottom: 8px;
+  color: #ffffff;
 }
-.nut-toast-icon-wrapper .nut-icon {
-  width: 24px;
-  height: 24px;
-}
-.nut-toast-loading .nut-toast-inner {
-  display: inline-flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-}
-.nut-toast-loading .nut-toast-icon-wrapper {
-  animation: rotation 2s linear infinite;
-}
-.nut-toast-loading .nut-toast-icon-wrapper .nut-icon {
+.nut-toast-icon-wrapper-icon {
   width: 24px;
   height: 24px;
 }

src/packages/toast/toast.scss

@@ -98,14 +98,21 @@
     text-align: $toast-inner-text-align;
   }
 
+  &-icon {
+    width: 24px;
+    height: 24px;
+    color: #ffffff;
+  }
+
   &-icon-wrapper {
     width: 100%;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 8px;
+    color: #ffffff;
 
-    .nut-icon {
+    &-icon {
       width: 24px;
       height: 24px;
     }

src/packages/toast/toast.taro.tsx

@@ -168,16 +168,22 @@ export const Toast: FunctionComponent<
 
     return !harmonyAndRn()
       ? {
-          success: <Success color="#ffffff" size={iconSize} />,
+          success: (
+            <Success
+              className="nut-toast-icon"
+              color="#ffffff"
+              size={iconSize}
+            />
+          ),
           fail: <Failure color="#ffffff" size={iconSize} />,
           warn: <Tips color="#ffffff" size={iconSize} />,
           loading: <Loading color="#ffffff" size={iconSize} />,
         }[type]
       : {
-          success: <Text>success</Text>,
-          fail: <Text>fail</Text>,
-          warn: <Text>warn</Text>,
-          loading: <Text>loading</Text>,
+          success: <Text className="nut-toast-icon">success</Text>,
+          fail: <Text className="nut-toast-icon">fail</Text>,
+          warn: <Text className="nut-toast-icon">warn</Text>,
+          loading: <Text className="nut-toast-icon">loading</Text>,
         }[type]
   }