@page
@model Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo.Pages.Components.BordersModel
@{
    ViewData["Title"] = "Borders";
}

<h2>Borders</h2>

<p>Based on <a href="https://getbootstrap.com/docs/4.1/components/border/" target="_blank"> Bootstrap Border</a>.</p>

<h4># Borders Examples</h4>

<div class="demo-with-code">
    <div class="demo-area">

        <span abp-border="Default">a</span>
        <span abp-border="Top">b</span>
        <span abp-border="Right">c</span>
        <span abp-border="Left">d</span>
        <span abp-border="Bottom">e</span>
        <span abp-border="Top_0">f</span>
        <span abp-border="Right_0">g</span>
        <span abp-border="Left_0">h</span>
        <span abp-border="Bottom_0">i</span>
        <span abp-border="Top_Primary">j</span>
        <span abp-border="Warning_0">k</span>
        <span abp-border="Bottom_Primary_0">l</span>
        <span abp-border="Left_Danger">m</span>

    </div>
    <div class="code-area">
        <pre>
&lt;span abp-border&gt;&lt;/span&gt;
&lt;span abp-border=&quot;Top&quot;&gt;&lt;/span&gt;
&lt;span abp-border=&quot;Right&quot;&gt;&lt;/span&gt;
&lt;span abp-border=&quot;Left&quot;&gt;&lt;/span&gt;
&lt;span abp-border=&quot;Bottom&quot;&gt;&lt;/span&gt;
&lt;span abp-border=&quot;Top_0&quot;&gt;&lt;/span&gt;
&lt;span abp-border=&quot;Right_0&quot;&gt;&lt;/span&gt;
&lt;span abp-border=&quot;Left_0&quot;&gt;&lt;/span&gt;
&lt;span abp-border=&quot;Bottom_0&quot;&gt;&lt;/span&gt;
&lt;span abp-border=&quot;Top_Primary&quot;&gt;&lt;/span&gt;
&lt;span abp-border=&quot;Warning_0&quot;&gt;&lt;/span&gt;
&lt;span abp-border=&quot;Bottom_Primary_0&quot;&gt;&lt;/span&gt;
&lt;span abp-border=&quot;Left_Danger&quot;&gt;&lt;/span&gt;
</pre>
    </div>
</div>