'ss'
This commit is contained in:
23
src/images/book.svg
Normal file
23
src/images/book.svg
Normal file
@@ -0,0 +1,23 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
width="800px" height="800px" viewBox="0 0 64 64" enable-background="new 0 0 64 64" xml:space="preserve">
|
||||
<g>
|
||||
<path fill="#F9EBB2" d="M56,62H10c-2.209,0-4-1.791-4-4s1.791-4,4-4h46V62z"/>
|
||||
<g>
|
||||
<path fill="#45AAB8" d="M6,4v49.537C7.062,52.584,8.461,52,10,52h2V2H8C6.896,2,6,2.896,6,4z"/>
|
||||
<path fill="#45AAB8" d="M56,2H14v50h42h2v-2V4C58,2.896,57.104,2,56,2z"/>
|
||||
</g>
|
||||
<g>
|
||||
<path fill="#394240" d="M60,52V4c0-2.211-1.789-4-4-4H8C5.789,0,4,1.789,4,4v54c0,3.313,2.687,6,6,6h49c0.553,0,1-0.447,1-1
|
||||
s-0.447-1-1-1h-1v-8C59.104,54,60,53.104,60,52z M6,4c0-1.104,0.896-2,2-2h4v50h-2c-1.539,0-2.938,0.584-4,1.537V4z M56,62H10
|
||||
c-2.209,0-4-1.791-4-4s1.791-4,4-4h46V62z M56,52H14V2h42c1.104,0,2,0.896,2,2v46v2H56z"/>
|
||||
<path fill="#394240" d="M43,26H23c-0.553,0-1,0.447-1,1s0.447,1,1,1h20c0.553,0,1-0.447,1-1S43.553,26,43,26z"/>
|
||||
<path fill="#394240" d="M49,20H23c-0.553,0-1,0.447-1,1s0.447,1,1,1h26c0.553,0,1-0.447,1-1S49.553,20,49,20z"/>
|
||||
<path fill="#394240" d="M23,16h12c0.553,0,1-0.447,1-1s-0.447-1-1-1H23c-0.553,0-1,0.447-1,1S22.447,16,23,16z"/>
|
||||
</g>
|
||||
<path opacity="0.2" fill="#231F20" d="M6,4v49.537C7.062,52.584,8.461,52,10,52h2V2H8C6.896,2,6,2.896,6,4z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
20
src/images/group.svg
Normal file
20
src/images/group.svg
Normal file
@@ -0,0 +1,20 @@
|
||||
<?xml version="1.0" ?>
|
||||
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg width="800px" height="800px" viewBox="0 0 512 512" id="Layer_1" version="1.1" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
|
||||
<style type="text/css">
|
||||
.st0{fill:#E6E6E6;}
|
||||
.st1{fill:#69C9C9;}
|
||||
.st2{fill:#4D5152;}
|
||||
</style>
|
||||
|
||||
<g>
|
||||
|
||||
<path class="st0" d="M56.3,322.3v-10h-26c3.5-49.6,32.8-94,77.1-116.7c16.2,17.2,39.3,28,64.8,28c2.3,0,4.6-0.1,6.9-0.3 c2,16.9,7.7,32.7,16.4,46.5c-25.3,13.1-47.3,31.1-64.9,52.4L56.3,322.3z"/>
|
||||
|
||||
</g>
|
||||
|
||||
<g>
|
||||
|
||||
<path class="st1" d="M262.1,446.4H102.4c3.6-68.3,43.9-129.7,105.3-160.2c20.8,23,50.9,37.5,84.4,37.5c33.4,0,63.5-14.5,84.4-37.5 c61.4,30.5,101.7,91.9,105.3,160.2H322.1v10h-60V446.4z"/>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
2
src/images/youtube copy.svg
Normal file
2
src/images/youtube copy.svg
Normal file
@@ -0,0 +1,2 @@
|
||||
<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg width="800px" height="800px" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="none"><path fill="red" d="M14.712 4.633a1.754 1.754 0 00-1.234-1.234C12.382 3.11 8 3.11 8 3.11s-4.382 0-5.478.289c-.6.161-1.072.634-1.234 1.234C1 5.728 1 8 1 8s0 2.283.288 3.367c.162.6.635 1.073 1.234 1.234C3.618 12.89 8 12.89 8 12.89s4.382 0 5.478-.289a1.754 1.754 0 001.234-1.234C15 10.272 15 8 15 8s0-2.272-.288-3.367z"/><path fill="#ffffff" d="M6.593 10.11l3.644-2.098-3.644-2.11v4.208z"/></svg>
|
||||
|
After Width: | Height: | Size: 613 B |
@@ -32,7 +32,7 @@ import emoji from "../../images/emoji.png";
|
||||
import phone from "../../images/phone.png";
|
||||
// import robot from "../../images/robot.png";
|
||||
import nomad from "../../images/nomad.png";
|
||||
import book from "../../images/book.png";
|
||||
// import book from "../../images/book.png";
|
||||
import qrcode from "../../images/qrcode.png";
|
||||
|
||||
import meetup from "../../images/meetup.jpg";
|
||||
@@ -52,7 +52,9 @@ import nomadro from "../../images/nomadro.png";
|
||||
import code from "../../images/code.svg";
|
||||
import laptop from "../../images/laptop.svg";
|
||||
import travel from "../../images/travel.svg";
|
||||
|
||||
import group from "../../images/group.svg";
|
||||
import book from "../../images/book.svg";
|
||||
import youtubesvg from "../../images/youtube.svg";
|
||||
// export default class Index extends Component {
|
||||
const Index = () => {
|
||||
const [current, setcurrent] = useState(0);
|
||||
@@ -353,16 +355,54 @@ const Index = () => {
|
||||
<View className="index_book_left">
|
||||
<View className="left_title">《从零开始,成为数字游民》</View>
|
||||
{/* <View className="left_text">手册3</View> */}
|
||||
<View className="left_mobile">
|
||||
{/* <View className="left_mobile">
|
||||
<Text>🚀 边旅行转赚钱</Text>
|
||||
<Text>1️⃣ 杠杆:媒体与代码</Text>
|
||||
<Text>2️⃣ 出海:地理套利</Text>
|
||||
<Text>3️⃣ 即时业务:一夜之间上线网站</Text>
|
||||
<Text>4️⃣ homelab:你的全球总部</Text>
|
||||
<Text>5️⃣ 远程团队:分布式协作</Text>
|
||||
{/* <Text>5️⃣ -----------------</Text> */}
|
||||
<Text>5️⃣ -----------------</Text>
|
||||
|
||||
{/* <Text>🔥 一起实践,交流</Text> */}
|
||||
<Text>🔥 一起实践,交流</Text>
|
||||
</View> */}
|
||||
|
||||
{/* 卡片 */}
|
||||
<View className="card">
|
||||
<View className="cardItem">
|
||||
<View className="cardItem_left">
|
||||
<Image
|
||||
className="cardItem_left_img youtubeSvg"
|
||||
src={travel}
|
||||
></Image>
|
||||
</View>
|
||||
<View className="cardItem_right">
|
||||
<View className="cardItem_rightUp">出海套利</View>
|
||||
<View className="cardItem_rightDown">
|
||||
边旅行边赚钱,无国界
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className="cardItem">
|
||||
<View className="cardItem_left">
|
||||
<Image className="cardItem_left_img" src={laptop}></Image>
|
||||
</View>
|
||||
<View className="cardItem_right">
|
||||
<View className="cardItem_rightUp">远程办公</View>
|
||||
<View className="cardItem_rightDown">自由职业,分布式团队</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className="cardItem">
|
||||
<View className="cardItem_left">
|
||||
<Image className="cardItem_left_img" src={group}></Image>
|
||||
</View>
|
||||
<View className="cardItem_right">
|
||||
<View className="cardItem_rightUp">游民社区</View>
|
||||
<View className="cardItem_rightDown">
|
||||
信息交流,快人一步
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View className="left_btn ">
|
||||
@@ -416,10 +456,9 @@ const Index = () => {
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className="footer">
|
||||
{/* <View>《Youtube运营笔记》</View> */}
|
||||
{/* <View className="footer">
|
||||
<View>Copyright © 2025 </View>
|
||||
</View>
|
||||
</View> */}
|
||||
</View>
|
||||
{/* <View className="footer_div"></View> */}
|
||||
</>
|
||||
|
||||
@@ -45,12 +45,99 @@
|
||||
// justify-content: space-around;
|
||||
// background-color: yellow;
|
||||
}
|
||||
|
||||
.card {
|
||||
margin-top: 40px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.cardItem {
|
||||
padding: 20px;
|
||||
// padding-top: 20px;
|
||||
width: 500px;
|
||||
// height: 300px;
|
||||
|
||||
margin-bottom: 20px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
background-color: rgb(var(--color-gray-50) / var(--tw-bg-opacity, 1));
|
||||
// background-color: yellow;
|
||||
background-color: #f0f5ff;
|
||||
border-radius: 20px;
|
||||
|
||||
// align-items: center;
|
||||
// justify-content: center;
|
||||
.cardItem_left {
|
||||
// width: 100px;
|
||||
// height: 100%;
|
||||
// background-color: #69b1ff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// align-items: center;
|
||||
// justify-content: center;
|
||||
margin-right: 40px;
|
||||
.cardItem_left_img {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
.youtubeSvg {
|
||||
position: relative;
|
||||
top: -5px;
|
||||
}
|
||||
}
|
||||
.cardItem_right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
// background-color: red;
|
||||
.cardItem_rightUp {
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
// background-color: aquamarine;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
font-weight: 700;
|
||||
font-size: 35px;
|
||||
// align-items: center;
|
||||
// justify-content: center;
|
||||
}
|
||||
.cardItem_rightDown {
|
||||
width: 100%;
|
||||
// height: 200px;
|
||||
flex: 1;
|
||||
// background-color: red;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
// align-items: center;
|
||||
// justify-content: center;
|
||||
font-size: 30px;
|
||||
flex-wrap: wrap;
|
||||
color: #262626;
|
||||
}
|
||||
}
|
||||
.left_mobile {
|
||||
margin-top: 20px;
|
||||
// width: 100%;
|
||||
font-size: 30px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// background-color: aqua;
|
||||
// align-items: center;
|
||||
// justify-content: space-around;
|
||||
// background-color: yellow;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.left_btn {
|
||||
margin-top: 40px;
|
||||
// background-color: aqua;
|
||||
// display: none;
|
||||
.startRead {
|
||||
width: 200px;
|
||||
width: 500px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -131,6 +218,9 @@
|
||||
.left_mobile {
|
||||
display: none;
|
||||
}
|
||||
.card {
|
||||
display: none;
|
||||
}
|
||||
.left_btn {
|
||||
display: flex;
|
||||
|
||||
@@ -206,7 +296,6 @@
|
||||
font-size: 14px;
|
||||
// background-color: yellow;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@@ -214,4 +303,3 @@
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user