WuKongIM/WuKongIMDocs
1
0
Fork 0
mirror of https://github.com/WuKongIM/WuKongIMDocs synced 2025-06-03 15:48:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'main' of https://github.com/WuKongIM/WuKongIMDocs

Browse Source
This commit is contained in:
tangtaoit 2023-06-18 14:27:23 +08:00
commit 339f1dc80d
2 changed files with 91 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

126
.dumi/pages/index.tsx
View File

@ -1,5 +1,6 @@
import React, { useRef } from 'react';
import './style.scss';
import { usePrefersColor } from 'dumi/dist/client/theme-api/usePrefersColor';
const Home: any = () => {
@ -22,6 +23,63 @@ const Home: any = () => {
};
}, []);
var isPhone = true
if (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
isPhone = true
} else {
isPhone = false
}
var item1 = {
icon: './././imgs/ic_no_dependency.png',
title: '零依赖',
desc: '没有依赖任何第三方组件，部署简单，一条命令即可启动'
}
var item2 = {
icon: './././imgs/ic_self_developed.png',
title: '完全自研',
desc: '自研消息数据库，消息分区永久存储，自研二进制协议，支持自定义协议'
}
var item3 = {
icon: './././imgs/ic_secure.png',
title: '安全',
desc: '消息通道和消息内容全程加密，防中间人攻击和串改消息内容'
}
var item4 = {
icon: './././imgs/ic_function.png',
title: '功能强劲',
desc: 'MAC 笔记本单机测试 16w 多/秒的消息(包含存储)吞吐量，频道支持万人同时订阅'
}
var item5 = {
icon: './././imgs/ic_extend.png',
title: '扩展性强',
desc: '采用频道设计理念，目前支持群组频道，点对点频道，后续可以根据自己业务自定义频道可实现机器人频道，客服频道等等'
}
var item6 = {
icon: './././imgs/ic_compatibility.png',
title: '兼容性强',
desc: '同时无差别支持 tcp，websocket'
}
var list1 = []
var list2 = []
var list3 = []
list1.push(item1)
list1.push(item2)
if (!isPhone) {
list1.push(item3)
list2.push(item4)
list2.push(item5)
list2.push(item6)
} else {
list2.push(item3)
list2.push(item4)
list3.push(item5)
list3.push(item6)
}
return (
<section className="home-page">
@ -43,42 +101,38 @@ const Home: any = () => {
<div className={`card ${color}`}>
<div className='bg'>
<label className="big-font">特性</label>
<div style={{ marginTop: '37px'}}>
<div style={{ display: 'flex' }}>
<div className='card-item'>
<img className="img" src='./././imgs/ic_no_dependency.png' />
<label className="characteristic-title">零依赖</label>
<label className="characteristic-content">没有依赖任何第三方组件，部署简单，一条命令即可启动</label>
</div>
<div className='card-item'>
<img className="img" src="./././imgs/ic_self_developed.png" />
<label className="characteristic-title">完全自研</label>
<label className="characteristic-content">自研消息数据库，消息分区永久存储，自研二进制协议，支持自定义协议</label>
</div>
<div className='card-item'>
<img className="img" src="./././imgs/ic_secure.png" />
<label className="characteristic-title">安全</label>
<label className="characteristic-content">消息通道和消息内容全程加密，防中间人攻击和串改消息内容。</label>
</div>
</div>
<div style={{ display: 'flex', marginTop: '30px', paddingBottom: '30px' }}>
<div className='card-item'>
<img className="img" src="./././imgs/ic_function.png" />
<label className="characteristic-title">功能强劲</label>
<label className="characteristic-content">MAC 笔记本单机测试 16w 多/秒的消息(包含存储)吞吐量，频道支持万人同时订阅。</label>
</div>
<div className='card-item'>
<img className="img" src="./././imgs/ic_extend.png" />
<label className="characteristic-title">扩展性强</label>
<label
className="characteristic-content">采用频道设计理念，目前支持群组频道，点对点频道，后续可以根据自己业务自定义频道可实现机器人频道，客服频道等等。</label>
</div>
<div className='card-item'>
<img className="img" src="./././imgs/ic_compatibility.png" />
<label className="characteristic-title">兼容性强</label>
<label className="characteristic-content">同时无差别支持 tcp，websocket</label>
</div>
</div>
<div style={{ marginTop: '37px', display: 'flex' }}>
{
list1.map((item: any) =>
<div className='card-item' style={{ width: isPhone ? '50%' : '33.3%' }}>
<img className="img" src={item.icon} />
<label className="characteristic-title">{item.title}</label>
<label className="characteristic-content">{item.desc}</label>
</div>
)
}
</div>
<div style={{ display: 'flex' }}>
{
list2.map((item: any) =>
<div className='card-item' style={{ width: isPhone ? '50%' : '33.3%' }}>
<img className="img" src={item.icon} />
<label className="characteristic-title">{item.title}</label>
<label className="characteristic-content">{item.desc}</label>
</div>
)
}
</div>
<div style={{ display: 'flex' }} >
{
list3.map((item: any) =>
<div className='card-item' style={{ width: isPhone ? '50%' : '33.3%' }}>
<img className="img" src={item.icon} />
<label className="characteristic-title">{item.title}</label>
<label className="characteristic-content">{item.desc}</label>
</div>
)
}
</div>
</div>
</div>

1
.dumi/pages/style.scss
View File

@ -151,6 +151,7 @@
text-align: center;
width: 33.33%;
margin-right: 1rem;
margin-bottom: 1rem;
margin-left: 1rem;
}