Added AbpCardImageTagHelper

pull/272/head
Halil İbrahim Kalkan 8 years ago
parent 1c8be872aa
commit 97de158056

@ -0,0 +1,9 @@
namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Card
{
public enum AbpCardImagePosition
{
None,
Top,
Bottom
}
}

@ -0,0 +1,20 @@
namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Card
{
public static class AbpCardImagePositionExtensions
{
public static string ToClassName(this AbpCardImagePosition position)
{
switch (position)
{
case AbpCardImagePosition.None:
return "card-img";
case AbpCardImagePosition.Top:
return "card-img-top";
case AbpCardImagePosition.Bottom:
return "card-img-bottom";
default:
throw new AbpException("Unknown AbpCardImagePosition: " + position);
}
}
}
}

@ -0,0 +1,17 @@
using Microsoft.AspNetCore.Razor.TagHelpers;
namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Card
{
[HtmlTargetElement("img", Attributes = "abp-card-image", TagStructure = TagStructure.WithoutEndTag)]
public class AbpCardImageTagHelper : AbpTagHelper<AbpCardImageTagHelper, AbpCardImageTagHelperService>
{
[HtmlAttributeName("abp-card-image")]
public AbpCardImagePosition Position { get; set; } = AbpCardImagePosition.Top;
public AbpCardImageTagHelper(AbpCardImageTagHelperService tagHelperService)
: base(tagHelperService)
{
}
}
}

@ -0,0 +1,14 @@
using Microsoft.AspNetCore.Razor.TagHelpers;
using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Microsoft.AspNetCore.Razor.TagHelpers;
namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Card
{
public class AbpCardImageTagHelperService : AbpTagHelperService<AbpCardImageTagHelper>
{
public override void Process(TagHelperContext context, TagHelperOutput output)
{
output.Attributes.AddClass(TagHelper.Position.ToClassName());
output.Attributes.RemoveAll("abp-card-image");
}
}
}

@ -2,13 +2,13 @@
namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Card
{
[HtmlTargetElement(Attributes = "abp-card-link")]
[HtmlTargetElement("a", Attributes = "abp-card-link")]
public class AbpCardLinkTagHelper : AbpTagHelper<AbpCardLinkTagHelper, AbpCardLinkTagHelperService>
{
public AbpCardLinkTagHelper(AbpCardLinkTagHelperService tagHelperService)
: base(tagHelperService)
{
}
}
}

@ -42,7 +42,7 @@
<abp-card style="width: 18rem;">
<abp-card-body title="Card title" subtitle="Card subtitle">
<abp-card-text>Some quick example text to build on the card title and make up the bulk of the card's content.</abp-card-text>
<a abp-card-link href="#">Card link</a>
<a abp-card-link>Card link</a>
<a abp-card-link href="#">Another link</a>
</abp-card-body>
</abp-card>
@ -50,9 +50,7 @@
<div class="code-area">
<pre>
&lt;abp-card style="width: 18rem;"&gt;
&lt;abp-card-body&gt;
&lt;abp-card-title&gt;Card title&lt;/abp-card-title&gt;
&lt;abp-card-subtitle class="mb-2 text-muted"&gt;Card subtitle&lt;/abp-card-subtitle&gt;
&lt;abp-card-body title="Card title" subtitle="Card subtitle"&gt;
&lt;abp-card-text&gt;Some quick example text to build on the card title and make up the bulk of the card's content.&lt;/abp-card-text&gt;
&lt;a abp-card-link href="#"&gt;Card link&lt;/a&gt;
&lt;a abp-card-link href="#"&gt;Another link&lt;/a&gt;
@ -67,7 +65,7 @@
<div class="demo-with-code">
<div class="demo-area">
<abp-card style="width: 18rem;">
<img class="card-img-top" src="~/imgs/demo/300x200.png" alt="Card image cap">
<img abp-card-image="Top" src="~/imgs/demo/300x200.png" alt="Card image cap">
<abp-card-body>
<abp-card-title>Card title</abp-card-title>
<abp-card-text>Some quick example text to build on the card title and make up the bulk of the card's content.</abp-card-text>
@ -78,7 +76,7 @@
<div class="code-area">
<pre>
&lt;abp-card style="width: 18rem;"&gt;
&lt;img class="card-img-top" src="~/imgs/demo/300x200.png" alt="Card image cap"&gt;
&lt;img abp-card-image="Top" src="~/imgs/demo/300x200.png" alt="Card image cap"&gt;
&lt;abp-card-body&gt;
&lt;abp-card-title&gt;Card title&lt;/abp-card-title&gt;
&lt;abp-card-text&gt;Some quick example text to build on the card title and make up the bulk of the card's content.&lt;/abp-card-text&gt;

Loading…
Cancel
Save