安卓H5首页,添加动画效果

This commit is contained in:
hackrobot
2024-07-16 16:27:58 +08:00
parent 138e03fad9
commit f6246b2fc9
4 changed files with 73 additions and 39 deletions

View File

@@ -44,6 +44,7 @@
"@tarojs/runtime": "3.6.20",
"@tarojs/shared": "3.6.20",
"@tarojs/taro": "3.6.20",
"animate.css": "^4.1.1",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"sr-sdk-h5": "^1.3.1",

View File

@@ -11,8 +11,7 @@ import { AtImagePicker } from "taro-ui";
import { AtButton } from "taro-ui";
import { AtSearchBar } from "taro-ui";
import { Picker } from "@tarojs/components";
import { AtList, AtListItem } from "taro-ui";
import { AtNavBar } from "taro-ui";
import { AtList, AtListItem, AtNavBar, AtTag } from "taro-ui";
import {
AtModal,
AtModalHeader,
@@ -24,6 +23,7 @@ import {
import { AtToast } from "taro-ui";
import { AtIcon } from "taro-ui";
import { VIEW } from "@tarojs/runtime";
import 'animate.css'
// export default class Index extends Component {
const Index = () => {
@@ -32,7 +32,6 @@ const Index = () => {
const [open, setopen] = useState(false);
const [referer, setreferer] = useState(window.document.referrer);
const [isOpened, setisOpened] = useState(false);
const [joinMeetup, setjoinMeetup] = useState(false);
@@ -69,7 +68,6 @@ const Index = () => {
};
useEffect(() => {
getOpenid();
}, []);
@@ -83,35 +81,35 @@ const Index = () => {
};
return (
<View className="index">
<View>公众号:异度世界</View>
<View>referer={document.referrer}</View>
<View className="content">
<View>
1.微信机器人
<br />
2.大众点评-探店
<br />
3.云手机
<br />
4.数字游民-工具箱
<br />
5.youtube频道
<br />
6.wordpress博客
<br />
7.如何出版一本书
<br />
8.AI: gpt对话/文生图/srt字幕/配音
<br />
9. electron软件-emoji编辑器
<br />
</View>
{/* 公众号 */}
<View className="index-title" onClick={()=>{
// window.location.href=""
}}>
<AtAvatar
size="small"
circle
image="https://www.hackrobot.cn/wp-content/uploads/2023/05/cropped-cropped-Screenshot-2023-05-22-at-17.26.38.png"
></AtAvatar>
<View>公众号:异度世界</View>
</View>
<View className="payBtn">
{/* 标签 */}
<View className="index-tags animate__animated animate__pulse">
<AtTag className="index-AtTag" type="primary" AtNavBar={true} circle>
独立开发者
</AtTag>
<AtTag className="index-AtTag" type="primary" AtNavBar={true} circle>
跨境电商
</AtTag>
<AtTag className="index-AtTag" type="primary" AtNavBar={true} circle>
树莓派
</AtTag>
</View>
{/* <View className="payBtn">
<AtButton type="primary">立即购买 -- 29.8元</AtButton>
</View>
</View> */}
</View>
);
};

View File

@@ -1,17 +1,22 @@
.index {
// background-color: #002329;
width: 100vw;
height: 100vh;
padding: 40px;
.content {
font-size: 28px;
flex-direction: row;
.index-title {
display: flex;
flex-direction: row;
font-weight: 700;
align-items: center;
justify-content: center;
// color: aliceblue;
}
.index-tags {
margin-top: 20px;
.index-AtTag {
background-color: rgb(99 102 241);
color: white;
}
}
.payBtn {

View File

@@ -2823,6 +2823,11 @@ ajv@^8.0.0, ajv@^8.9.0:
require-from-string "^2.0.2"
uri-js "^4.2.2"
animate.css@^4.1.1:
version "4.1.1"
resolved "https://registry.yarnpkg.com/animate.css/-/animate.css-4.1.1.tgz#614ec5a81131d7e4dc362a58143f7406abd68075"
integrity sha512-+mRmCTv6SbCmtYJCN4faJMNFVNN5EuCTTprDTAo7YzIGji2KADmakjVA3+8mVDkZ2Bf09vayB35lSQIex2+QaQ==
ansi-align@^3.0.0:
version "3.0.1"
resolved "https://registry.npmmirror.com/ansi-align/-/ansi-align-3.0.1.tgz#0cdf12e111ace773a86e9a1fad1225c43cb19a59"
@@ -11291,7 +11296,7 @@ strict-uri-encode@^2.0.0:
resolved "https://registry.npmmirror.com/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz#b9c7330c7042862f6b142dc274bbcc5866ce3546"
integrity sha512-QwiXZgpRcKkhTj2Scnn++4PKtWsH0kpzZ62L2R6c/LUVYv7hVnZqcg2+sMuT6R7Jusu1vviK/MFsu6kNJfWlEQ==
"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.0.0, string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.2:
"string-width-cjs@npm:string-width@^4.2.0":
version "4.2.3"
resolved "https://registry.npmmirror.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
@@ -11308,6 +11313,15 @@ string-width@^2.1.0, string-width@^2.1.1:
is-fullwidth-code-point "^2.0.0"
strip-ansi "^4.0.0"
string-width@^4.0.0, string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.2:
version "4.2.3"
resolved "https://registry.npmmirror.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
dependencies:
emoji-regex "^8.0.0"
is-fullwidth-code-point "^3.0.0"
strip-ansi "^6.0.1"
string-width@^5.0.1, string-width@^5.1.2:
version "5.1.2"
resolved "https://registry.npmmirror.com/string-width/-/string-width-5.1.2.tgz#14f8daec6d81e7221d2a357e668cab73bdbca794"
@@ -11388,7 +11402,7 @@ stringify-entities@^1.0.1:
is-alphanumerical "^1.0.0"
is-hexadecimal "^1.0.0"
"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1:
"strip-ansi-cjs@npm:strip-ansi@^6.0.1":
version "6.0.1"
resolved "https://registry.npmmirror.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
@@ -11409,6 +11423,13 @@ strip-ansi@^4.0.0:
dependencies:
ansi-regex "^3.0.0"
strip-ansi@^6.0.0, strip-ansi@^6.0.1:
version "6.0.1"
resolved "https://registry.npmmirror.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
dependencies:
ansi-regex "^5.0.1"
strip-ansi@^7.0.1:
version "7.1.0"
resolved "https://registry.npmmirror.com/strip-ansi/-/strip-ansi-7.1.0.tgz#d5b6568ca689d8561370b0707685d22434faff45"
@@ -12734,7 +12755,7 @@ widest-line@^3.1.0:
dependencies:
string-width "^4.0.0"
"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0:
"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0":
version "7.0.0"
resolved "https://registry.npmmirror.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
@@ -12752,6 +12773,15 @@ wrap-ansi@^6.0.1:
string-width "^4.1.0"
strip-ansi "^6.0.0"
wrap-ansi@^7.0.0:
version "7.0.0"
resolved "https://registry.npmmirror.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
dependencies:
ansi-styles "^4.0.0"
string-width "^4.1.0"
strip-ansi "^6.0.0"
wrap-ansi@^8.1.0:
version "8.1.0"
resolved "https://registry.npmmirror.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214"