mirror of
https://gitee.com/ant-design-blazor/ant-design-blazor.git
synced 2024-12-13 16:35:55 +08:00
128 lines
4.8 KiB
C#
128 lines
4.8 KiB
C#
|
@inherits AntDesignTestBase
|
|||
|
@code {
|
|||
|
[Fact]
|
|||
|
public void Renders_basic_timeline()
|
|||
|
{
|
|||
|
var cut = Context.Render(
|
|||
|
@<Timeline>
|
|||
|
<TimelineItem>Create a services site 2015-09-01</TimelineItem>
|
|||
|
<TimelineItem Color="red" >Solve initial network problems 2015-09-01</TimelineItem>
|
|||
|
</Timeline>);
|
|||
|
cut.MarkupMatches(
|
|||
|
@<ul class="ant-timeline" id:ignore >
|
|||
|
<li class="ant-timeline-item" id:ignore >
|
|||
|
<div class="ant-timeline-item-tail"></div>
|
|||
|
<div class="ant-timeline-item-head ant-timeline-item-head-blue" style="">
|
|||
|
</div>
|
|||
|
<div class="ant-timeline-item-content">
|
|||
|
Create a services site 2015-09-01
|
|||
|
</div>
|
|||
|
</li>
|
|||
|
<li class="ant-timeline-item ant-timeline-item-last" id:ignore >
|
|||
|
<div class="ant-timeline-item-tail"></div>
|
|||
|
<div class="ant-timeline-item-head ant-timeline-item-head-red" style="">
|
|||
|
</div>
|
|||
|
<div class="ant-timeline-item-content">
|
|||
|
Solve initial network problems 2015-09-01
|
|||
|
</div>
|
|||
|
</li>
|
|||
|
</ul>);
|
|||
|
}
|
|||
|
|
|||
|
[Fact]
|
|||
|
public void Renders_timeline_with_right_mode()
|
|||
|
{
|
|||
|
var cut = Context.Render(
|
|||
|
@<Timeline Mode="@TimelineMode.Right">
|
|||
|
<TimelineItem>Create a services site 2015-09-01</TimelineItem>
|
|||
|
<TimelineItem Color="red" >Solve initial network problems 2015-09-01</TimelineItem>
|
|||
|
</Timeline>);
|
|||
|
cut.MarkupMatches(
|
|||
|
@<ul class="ant-timeline ant-timeline-right" id:ignore >
|
|||
|
<li class="ant-timeline-item ant-timeline-item-right" id:ignore >
|
|||
|
<div class="ant-timeline-item-tail"></div>
|
|||
|
<div class="ant-timeline-item-head ant-timeline-item-head-blue" style="">
|
|||
|
</div>
|
|||
|
<div class="ant-timeline-item-content">
|
|||
|
Create a services site 2015-09-01
|
|||
|
</div>
|
|||
|
</li>
|
|||
|
<li class="ant-timeline-item ant-timeline-item-right ant-timeline-item-last" id:ignore >
|
|||
|
<div class="ant-timeline-item-tail"></div>
|
|||
|
<div class="ant-timeline-item-head ant-timeline-item-head-red" style="">
|
|||
|
</div>
|
|||
|
<div class="ant-timeline-item-content">
|
|||
|
Solve initial network problems 2015-09-01
|
|||
|
</div>
|
|||
|
</li>
|
|||
|
</ul>);
|
|||
|
}
|
|||
|
|
|||
|
|
|||
|
[Theory]
|
|||
|
[InlineData(TimelineMode.Left,"","left","left")]
|
|||
|
[InlineData(TimelineMode.Right,"ant-timeline-right","right","right")]
|
|||
|
[InlineData(TimelineMode.Alternate,"ant-timeline-alternate","left","right")]
|
|||
|
public void Renders_timeline_with_alternate_mode(TimelineMode mode, string timelineModeClass, string firstItemMode,string secondItemMode)
|
|||
|
{
|
|||
|
var cut = Context.Render(
|
|||
|
@<Timeline Mode="@mode">
|
|||
|
<TimelineItem>Create a services site 2015-09-01</TimelineItem>
|
|||
|
<TimelineItem>Solve initial network problems 2015-09-01</TimelineItem>
|
|||
|
</Timeline>);
|
|||
|
cut.MarkupMatches(
|
|||
|
@<ul class="ant-timeline @timelineModeClass" id:ignore >
|
|||
|
<li class="ant-timeline-item ant-timeline-item-@firstItemMode" id:ignore >
|
|||
|
<div class="ant-timeline-item-tail"></div>
|
|||
|
<div class="ant-timeline-item-head ant-timeline-item-head-blue" style="">
|
|||
|
</div>
|
|||
|
<div class="ant-timeline-item-content">
|
|||
|
Create a services site 2015-09-01
|
|||
|
</div>
|
|||
|
</li>
|
|||
|
<li class="ant-timeline-item ant-timeline-item-@secondItemMode ant-timeline-item-last" id:ignore >
|
|||
|
<div class="ant-timeline-item-tail"></div>
|
|||
|
<div class="ant-timeline-item-head ant-timeline-item-head-blue" style="">
|
|||
|
</div>
|
|||
|
<div class="ant-timeline-item-content">
|
|||
|
Solve initial network problems 2015-09-01
|
|||
|
</div>
|
|||
|
</li>
|
|||
|
</ul>);
|
|||
|
}
|
|||
|
|
|||
|
[Theory]
|
|||
|
[InlineData(TimelineMode.Left,"left","left")]
|
|||
|
[InlineData(TimelineMode.Right,"right","right")]
|
|||
|
[InlineData(TimelineMode.Alternate,"left","right")]
|
|||
|
public void Renders_timeline_with_label(TimelineMode mode,string firstItemMode,string secondItemMode)
|
|||
|
{
|
|||
|
var cut = Context.Render(
|
|||
|
@<Timeline Mode="@mode">
|
|||
|
<TimelineItem Label="2015-09-01">Create a services site</TimelineItem>
|
|||
|
<TimelineItem Label="2015-09-02" Color="red" >Solve initial network problems</TimelineItem>
|
|||
|
</Timeline>);
|
|||
|
|
|||
|
cut.MarkupMatches(
|
|||
|
@<ul class="ant-timeline ant-timeline-label" id:ignore >
|
|||
|
<li class="ant-timeline-item ant-timeline-item-@firstItemMode" id:ignore >
|
|||
|
<div class="ant-timeline-item-label">2015-09-01</div>
|
|||
|
<div class="ant-timeline-item-tail"></div>
|
|||
|
<div class="ant-timeline-item-head ant-timeline-item-head-blue" style="">
|
|||
|
</div>
|
|||
|
<div class="ant-timeline-item-content">
|
|||
|
Create a services site
|
|||
|
</div>
|
|||
|
</li>
|
|||
|
<li class="ant-timeline-item ant-timeline-item-@secondItemMode ant-timeline-item-last" id:ignore >
|
|||
|
<div class="ant-timeline-item-label">2015-09-02</div>
|
|||
|
<div class="ant-timeline-item-tail"></div>
|
|||
|
<div class="ant-timeline-item-head ant-timeline-item-head-red" style="">
|
|||
|
</div>
|
|||
|
<div class="ant-timeline-item-content">
|
|||
|
Solve initial network problems
|
|||
|
</div>
|
|||
|
</li>
|
|||
|
</ul> );
|
|||
|
}
|
|||
|
}
|