Kategori

<section class="bg-white discus-parallax">
    <div class="container pt30 pb30">
        @{
            int card116Col = 2;
            int card116TotalRow = 1;
            int card116CategoryOrderNumber = 16;

            if (Partial.isCategoryOrderNumber(card116CategoryOrderNumber))
            {
                IEnumerable<Category> card116Category = Partial.CategorySubOrderNumber(card116CategoryOrderNumber, lang);
                Category category116no = Partial.Category(card116CategoryOrderNumber, lang);
                int card116Count = Convert.ToInt32(Math.Ceiling(card116Category.Count() / Convert.ToDouble(card116Col)));
                <div class="row">
                    <h2>@category116no.CategoryTitle.HtmlEncode()</h2>

                </div>
                for (int componen = 0; componen < card116TotalRow; componen++)
                {
                    foreach (Category comCategory in card116Category.Skip(componen * card116Col).Take(card116Col))
                    {
                        <div class="row refe" style="background-image: url(@comCategory.CategoryThumbnail);">
                            <div class="refedetay col-xs-12 col-sm-4 col-md-4">
                                <div class="title">@comCategory.CategoryTitle.HtmlEncode()</div>
                                <div class="refe-description">
                                    <p style="text-align: center;"><strong>@Partial.CategoryShortContent(comCategory.CategoryID, 105)</strong></p>
                                </div>
                                <a href="@Partial.CategoryLink(comCategory.CategoryID)" class="btn btn-default">@Partial.Translate("Devami", lang)</a>
                            </div>
                            <div class="price-container col-xs-12 col-sm-8 col-md-8">

                                <div class="refe-price">
                                    <div class="refcoverme tip-tablo">
                                        <a class="hucre hucre-ortala fancybox" href="@Partial.CategoryLink(comCategory.CategoryID)">
                                            <h5>@Partial.Translate("Devami", lang)</h5>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    }
                }
            }
        }
    </div>
</section>

Makale

<section class="bg-white discus-parallax">
    <div class="container pt30 pb30">
        @{
            int card117Col = 2;
            int card117TotalRow = 1;
            int card117CategoryOrderNumber = 2;

            if (Partial.isCategoryOrderNumber(card117CategoryOrderNumber))
            {
                IEnumerable<Post> card117Posts = Partial.PostsOrderNumber(card117CategoryOrderNumber, 0, card117Col * card117TotalRow, Partial.Order.ID, true, lang);
                Category category117title = Partial.Category(card117CategoryOrderNumber, lang);
                int card117Count = Convert.ToInt32(Math.Ceiling(card117Posts.Count() / Convert.ToDouble(card117Col)));
                <div class="row">
                    <h2>@category117title.CategoryTitle.HtmlEncode()</h2>
                </div>
                for (int componen = 0; componen < card117Count; componen++)
                {
                    foreach (Post comPost in card117Posts.Skip(componen * card117Col).Take(card117Col))
                    {
                        <div class="row refe" style="background-image: url(@comPost.PostThumbnail);">
                            <div class="refedetay col-xs-12 col-sm-4 col-md-4">
                                <div class="title">@comPost.PostTitle.HtmlEncode()</div>
                                <div class="refe-description">
                                    <p style="text-align: center;"><strong>@Partial.PostShortContent(comPost.PostID, 105)</strong></p>
                                </div>
                                <a href="@Partial.PostLink(comPost.PostID)" class="btn btn-default">@Partial.Translate("Devami", lang)</a>
                            </div>
                            <div class="price-container col-xs-12 col-sm-8 col-md-8">
                                <div class="refe-price">
                                    <div class="refcoverme tip-tablo">
                                        <a class="hucre hucre-ortala fancybox" href="@Partial.PostLink(comPost.PostID)">
                                            <h5>@Partial.Translate("Devami", lang)</h5>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    }
                }
            }
        }
    </div>
</section>

CSS

.refedetay {
        left: 0;
        top: 0;
        background: rgba(255, 255, 255, 0.8);
        color: #FFFFFF;
        padding: 70px 30px 30px;
        height: 100%;
        z-index: 1;
        -webkit-transition: all 1s ease;
        -o-transition: all 1s ease;
        transition: all 1s ease;
    }
    .refe {
        width: 100%;
        height: 300px;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
        margin-bottom: 20px;
    }
        .refedetay .title {
            color: #000000;
            font-size: 20px;
            color: #c4922a;
            font-weight: bold;
        }
    .refedetay .refe-description {
        color: #000000;
        width: 100%;
        height: 100px;
        overflow: hidden;
        margin: 10px 0px;
        font-size: 14px;
    }
    .btn-default {
        text-shadow: 0 1px 0 #fff;
        background-image: -webkit-linear-gradient(top,#fff 0,#e0e0e0 100%);
        background-image: -o-linear-gradient(top,#fff 0,#e0e0e0 100%);
        background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#e0e0e0));
        background-image: linear-gradient(to bottom,#fff 0,#e0e0e0 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
        filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
        background-repeat: repeat-x;
        border-color: #dbdbdb;
        border-color: #ccc;
    }

    .refe .refe-price h5 {
        font-weight: bold;
        color: #c4922a;
        font-size: 14px;
    }
    .refe:hover .refe-price h5 {
    background: rgba(0, 0, 0, 0.8);
    width: 100%;
    padding: 15px 25px;
    -webkit-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
    border-radius: 10px;
    }

    .refe-price {
        height: 300px;
        opacity: 0;
    }
    .refe:hover .refe-price {
        opacity: 1;
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    .tip-tablo {
        display: table;
    }
        .tip-tablo .hucre-ortala {
            vertical-align: middle;
        }

    .refcoverme {
        min-height: 300px;
        margin: 0px auto;
        padding: 0px 10px;
    }

http://www.aramseyapi.com/tr

http://www.lodosantalyainsaat.com/tr

İndex Bileşenleri