You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

616 lines
13 KiB

exports[`test renders ./components/grid/demo/basic.md correctly 1`] = `
<div>
<div
class="ant-row">
<div
class="ant-col-12">
col-12
</div>
<div
class="ant-col-12">
col-12
</div>
</div>
<div
class="ant-row">
<div
class="ant-col-8">
col-8
</div>
<div
class="ant-col-8">
col-8
</div>
<div
class="ant-col-8">
col-8
</div>
</div>
<div
class="ant-row">
<div
class="ant-col-6">
col-6
</div>
<div
class="ant-col-6">
col-6
</div>
<div
class="ant-col-6">
col-6
</div>
<div
class="ant-col-6">
col-6
</div>
</div>
</div>
`;
exports[`test renders ./components/grid/demo/flex.md correctly 1`] = `
<div>
<p>
sub-element align left
</p>
<div
class="ant-row-flex ant-row-flex-start">
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
</div>
<p>
sub-element align center
</p>
<div
class="ant-row-flex ant-row-flex-center">
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
</div>
<p>
sub-element align right
</p>
<div
class="ant-row-flex ant-row-flex-end">
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
</div>
<p>
sub-element monospaced arrangement
</p>
<div
class="ant-row-flex ant-row-flex-space-between">
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
</div>
<p>
sub-element align full
</p>
<div
class="ant-row-flex ant-row-flex-space-around">
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
<div
class="ant-col-4">
col-4
</div>
</div>
</div>
`;
exports[`test renders ./components/grid/demo/flex-align.md correctly 1`] = `
<div>
<p>
Align Top
</p>
<div
class="ant-row-flex ant-row-flex-center ant-row-flex-top">
<div
class="ant-col-4">
<p
class="height-100">
col-4
</p>
</div>
<div
class="ant-col-4">
<p
class="height-50">
col-4
</p>
</div>
<div
class="ant-col-4">
<p
class="height-120">
col-4
</p>
</div>
<div
class="ant-col-4">
<p
class="height-80">
col-4
</p>
</div>
</div>
<p>
Align Center
</p>
<div
class="ant-row-flex ant-row-flex-space-around ant-row-flex-middle">
<div
class="ant-col-4">
<p
class="height-100">
col-4
</p>
</div>
<div
class="ant-col-4">
<p
class="height-50">
col-4
</p>
</div>
<div
class="ant-col-4">
<p
class="height-120">
col-4
</p>
</div>
<div
class="ant-col-4">
<p
class="height-80">
col-4
</p>
</div>
</div>
<p>
Align Bottom
</p>
<div
class="ant-row-flex ant-row-flex-space-between ant-row-flex-bottom">
<div
class="ant-col-4">
<p
class="height-100">
col-4
</p>
</div>
<div
class="ant-col-4">
<p
class="height-50">
col-4
</p>
</div>
<div
class="ant-col-4">
<p
class="height-120">
col-4
</p>
</div>
<div
class="ant-col-4">
<p
class="height-80">
col-4
</p>
</div>
</div>
</div>
`;
exports[`test renders ./components/grid/demo/flex-order.md correctly 1`] = `
<div>
<div
class="ant-row-flex">
<div
class="ant-col-6 ant-col-order-4">
1 col-order-4
</div>
<div
class="ant-col-6 ant-col-order-3">
2 col-order-3
</div>
<div
class="ant-col-6 ant-col-order-2">
3 col-order-2
</div>
<div
class="ant-col-6 ant-col-order-1">
4 col-order-1
</div>
</div>
</div>
`;
exports[`test renders ./components/grid/demo/gutter.md correctly 1`] = `
<div
class="gutter-example">
<div
class="ant-row"
style="margin-left:-8px;margin-right:-8px;">
<div
class="ant-col-6 gutter-row"
style="padding-left:8px;padding-right:8px;">
<div
class="gutter-box">
col-6
</div>
</div>
<div
class="ant-col-6 gutter-row"
style="padding-left:8px;padding-right:8px;">
<div
class="gutter-box">
col-6
</div>
</div>
<div
class="ant-col-6 gutter-row"
style="padding-left:8px;padding-right:8px;">
<div
class="gutter-box">
col-6
</div>
</div>
<div
class="ant-col-6 gutter-row"
style="padding-left:8px;padding-right:8px;">
<div
class="gutter-box">
col-6
</div>
</div>
</div>
</div>
`;
exports[`test renders ./components/grid/demo/offset.md correctly 1`] = `
<div>
<div
class="ant-row">
<div
class="ant-col-8">
col-8
</div>
<div
class="ant-col-8 ant-col-offset-8">
col-8
</div>
</div>
<div
class="ant-row">
<div
class="ant-col-6 ant-col-offset-6">
col-6 col-offset-6
</div>
<div
class="ant-col-6 ant-col-offset-6">
col-6 col-offset-6
</div>
</div>
<div
class="ant-row">
<div
class="ant-col-12 ant-col-offset-6">
col-12 col-offset-6
</div>
</div>
</div>
`;
exports[`test renders ./components/grid/demo/playground.md correctly 1`] = `
<div>
<div
style="margin-bottom:16px;">
<span
style="margin-right:6px;">
Gutter (px):
</span>
<div
style="width:50%;">
<div
class="ant-slider ant-slider-with-marks">
<div
class="ant-slider-rail" />
<div
class="ant-slider-track ant-slider-track-1"
style="visibility:visible;left:0%;width:20%;" />
<div
class="ant-slider-step">
<span
class="ant-slider-dot ant-slider-dot-active"
style="left:0%;" />
<span
class="ant-slider-dot ant-slider-dot-active"
style="left:20%;" />
<span
class="ant-slider-dot"
style="left:40%;" />
<span
class="ant-slider-dot"
style="left:60%;" />
<span
class="ant-slider-dot"
style="left:80%;" />
<span
class="ant-slider-dot"
style="left:100%;" />
</div>
<div
class="ant-slider-handle ant-slider-handle-2 ant-slider-handle-upper"
style="left:20%;" />
<div
class="ant-slider-mark">
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="width:18%;margin-left:-9%;left:0%;">
8
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="width:18%;margin-left:-9%;left:20%;">
16
</span>
<span
class="ant-slider-mark-text"
style="width:18%;margin-left:-9%;left:40%;">
24
</span>
<span
class="ant-slider-mark-text"
style="width:18%;margin-left:-9%;left:60%;">
32
</span>
<span
class="ant-slider-mark-text"
style="width:18%;margin-left:-9%;left:80%;">
40
</span>
<span
class="ant-slider-mark-text"
style="width:18%;margin-left:-9%;left:100%;">
48
</span>
</div>
</div>
</div>
<span
style="margin-right:6px;">
Column Count:
</span>
<div
style="width:50%;">
<div
class="ant-slider ant-slider-with-marks">
<div
class="ant-slider-rail" />
<div
class="ant-slider-track ant-slider-track-1"
style="visibility:visible;left:0%;width:33.33333333333333%;" />
<div
class="ant-slider-step">
<span
class="ant-slider-dot ant-slider-dot-active"
style="left:0%;" />
<span
class="ant-slider-dot ant-slider-dot-active"
style="left:16.666666666666664%;" />
<span
class="ant-slider-dot ant-slider-dot-active"
style="left:33.33333333333333%;" />
<span
class="ant-slider-dot"
style="left:50%;" />
<span
class="ant-slider-dot"
style="left:66.66666666666666%;" />
<span
class="ant-slider-dot"
style="left:83.33333333333334%;" />
<span
class="ant-slider-dot"
style="left:100%;" />
</div>
<div
class="ant-slider-handle ant-slider-handle-2 ant-slider-handle-upper"
style="left:33.33333333333333%;" />
<div
class="ant-slider-mark">
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="width:15.000000000000002%;margin-left:-7.500000000000001%;left:0%;">
2
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="width:15.000000000000002%;margin-left:-7.500000000000001%;left:16.666666666666664%;">
3
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="width:15.000000000000002%;margin-left:-7.500000000000001%;left:33.33333333333333%;">
4
</span>
<span
class="ant-slider-mark-text"
style="width:15.000000000000002%;margin-left:-7.500000000000001%;left:50%;">
6
</span>
<span
class="ant-slider-mark-text"
style="width:15.000000000000002%;margin-left:-7.500000000000001%;left:66.66666666666666%;">
8
</span>
<span
class="ant-slider-mark-text"
style="width:15.000000000000002%;margin-left:-7.500000000000001%;left:83.33333333333334%;">
12
</span>
<span
class="ant-slider-mark-text"
style="width:15.000000000000002%;margin-left:-7.500000000000001%;left:100%;">
24
</span>
</div>
</div>
</div>
</div>
<div
class="ant-row"
style="margin-left:-8px;margin-right:-8px;">
<div
class="ant-col-6"
style="padding-left:8px;padding-right:8px;">
<div>
Column
</div>
</div>
<div
class="ant-col-6"
style="padding-left:8px;padding-right:8px;">
<div>
Column
</div>
</div>
<div
class="ant-col-6"
style="padding-left:8px;padding-right:8px;">
<div>
Column
</div>
</div>
<div
class="ant-col-6"
style="padding-left:8px;padding-right:8px;">
<div>
Column
</div>
</div>
</div>
</div>
`;
exports[`test renders ./components/grid/demo/reponsive.md correctly 1`] = `
<div
class="ant-row">
<div
class="ant-col-xs-2 ant-col-sm-4 ant-col-md-6 ant-col-lg-8">
Col
</div>
<div
class="ant-col-xs-20 ant-col-sm-16 ant-col-md-12 ant-col-lg-8">
Col
</div>
<div
class="ant-col-xs-2 ant-col-sm-4 ant-col-md-6 ant-col-lg-8">
Col
</div>
</div>
`;
exports[`test renders ./components/grid/demo/reponsive-more.md correctly 1`] = `
<div
class="ant-row">
<div
class="ant-col-xs-5 ant-col-xs-offset-1 ant-col-lg-6 ant-col-lg-offset-2">
Col
</div>
<div
class="ant-col-xs-11 ant-col-xs-offset-1 ant-col-lg-6 ant-col-lg-offset-2">
Col
</div>
<div
class="ant-col-xs-5 ant-col-xs-offset-1 ant-col-lg-6 ant-col-lg-offset-2">
Col
</div>
</div>
`;
exports[`test renders ./components/grid/demo/sort.md correctly 1`] = `
<div>
<div
class="ant-row">
<div
class="ant-col-18 ant-col-push-6">
col-18 col-push-6
</div>
<div
class="ant-col-6 ant-col-pull-18">
col-6 col-pull-18
</div>
</div>
</div>
`;