Idea React components TypeEcho _ < TypeEcho text = " Hello, Idea React!" />
Horizontal Marquee idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app
< HorizontalMarquee >
idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app idea2app
</ HorizontalMarquee >
Vertical Marquee < VerticalMarquee
style = { {
height: '10rem'
} }
>
< img src = " https://tech-query.me/medias/featureimages/22.jpg" />
</ VerticalMarquee >
Time 2022 年 11 月 27 日 < lV
dateTime = " 2022-11-27"
format = " YYYY 年 MM 月 DD 日"
/>
Time Distance 35 year(s) before < TimeDistance date = " 1989-06-04" />
Timeline < div
style = { {
background: 'linear-gradient(to right, rgba(235, 187, 167, 1), rgba(207, 199, 248, 1))'
} }
>
< Timeline
events = { [
{
time: [
'2019-12-01'
] ,
title: 'Discover'
} ,
{
time: [
'2020-01-02'
] ,
title: 'Deny'
} ,
{
time: [
'2020-01-23'
] ,
title: 'Lock down'
} ,
{
time: [
'2022-12-01'
] ,
title: 'Open'
}
] }
timeFormat = " YYYY-MM-DD"
/>
</ div>
Icon < Icon
className = " text-danger"
name = " trash"
size = { 2 }
/>
Avatar < Avatar src = " https://github.com/idea2app.png" />
Nameplate idea2app < Nameplate
avatar = " https://github.com/idea2app.png"
name = " idea2app"
/>
Loading... Submit< >
< SpinnerButton
animation = " border"
className = " me-3"
loading
/>
< SpinnerButton
animation = " grow"
loading
type = " submit"
>
Submit
</ SpinnerButton >
</ >
Select < Select
onChange = { function nN ( ) { } }
value = " 0"
>
< Option value = " 0" >
< Icon
className = " me-2"
name = " heart"
/>
idea2app
</ Option >
< Option value = " 1" >
< Icon
className = " me-2"
name = " bootstrap"
/>
freeCodeCamp
</ Option >
</ Select >
Month Calendar < 2024-11>
Sunday Monday Tuesday Wednesday Thursday Friday Saturday 27 28 29 30 31 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 Hello! 22 23 24 25 26 27 28 29 30 1 2 3 4 5 6 7
< MonthCalendar
onChange = { function nN ( ) { } }
onSelect = { function nN ( ) { } }
value = { [
{
content: 'Hello!' ,
date: new Date ( '2024-11-21T17:37:16.412Z' )
}
] }
/>
IdeaDialog 显示弹窗 < >
< Button onClick = { function nN ( ) { } } >
显示弹窗
</ Button >
< DialogComponent />
</ >
Share Box idea2app click to share< >
< ShareBox
text = " Every idea of yours is worth our efforts to realize"
title = " idea2app"
url = " https://idea2app.cn"
>
< Nameplate
avatar = " https://github.com/idea2app.png"
name = " idea2app"
/>
</ ShareBox >
click to share
</ >
Overlay Box 查看 < OverlayBox
detail = { < Image src = " https://github.com/idea2app.png" /> }
title = " view info"
trigger = " click"
>
< Button >
查看
</ Button >
</ OverlayBox >
Loading 显示 < >
< Button
onClick = { function nN ( ) { } }
style = { {
zIndex: '1040'
} }
>
显示
</ Button >
</ >
User Rank < UserRankView
linkOf = { function nN ( ) { } }
rank = { [
{
avatar: 'https://github.com/Five-great.png' ,
id: 1 ,
name: 'Five-great' ,
score: 100 ,
website: 'https://github.com/Five-great'
} ,
{
avatar: 'https://github.com/TechQuery.png' ,
id: 2 ,
name: 'TechQuery' ,
score: 99 ,
website: 'https://github.com/TechQuery'
} ,
{
avatar: 'https://github.com/stevending1st.png' ,
id: 3 ,
name: 'stevending1st' ,
score: 98 ,
website: 'https://github.com/stevending1st'
} ,
{
avatar: 'https://github.com/wangrunlin.png' ,
id: 4 ,
name: 'wangrunlin' ,
score: 97 ,
website: 'https://github.com/wangrunlin'
}
] }
title = " GitHub"
/>