Kategori

@{
    int card80Col = 3;
    int card80categoryOrderNumber = 3;

    if (Partial.isCategoryOrderNumber(card80categoryOrderNumber))
    {
        Category subCategory = Partial.Category(card80categoryOrderNumber, lang);

        IEnumerable<Category>
          categories = Partial.CategorySubOrderNumber(card80categoryOrderNumber, lang);
        <div class="section-full mobile-page-padding p-t80 p-b30 square_shape1 bg-parallax bg-cover" data-stellar-background-ratio="0.5" style="background-image:url(@subCategory.CategoryThumbnail);">
            <div class="container">
                <div class="section-head ">
                    <div class="mt-separator-outer separator-center">
                        <div class="mt-separator">
                            <h2 class="text-white text-uppercase sep-line-one "><span class="text-white " style="color:white;">@subCategory.CategoryTitle.HtmlEncode()</span></h2>
                        </div>
                    </div>
                </div>

                <div class="section-content">
                    <div class="container">
                        <div class="row">
                            @foreach (Category comCategory in categories.Skip(0).Take(card80Col))
                            {
                                <div class="col-md-4 col-sm-6">
                                    <div class="mt-box blog-post latest-blog-3 date-style-1 bg-white m-b30">
                                        <div class="mt-post-media">
                                            <a href="@comCategory.CategoryLink"><img src="@comCategory.CategoryImage" alt="@comCategory.CategoryTitle.HtmlEncode()"></a>
                                        </div>
                                        <div class="mt-post-info p-a30">
                                            <div class="post-overlay-position">
                                                <div class="mt-post-title ">
                                                    <a href="@comCategory.CategoryLink"> <h4 class="post-title m-b0">@comCategory.CategoryTitle.HtmlEncode()</h4></a>
                                                </div>
                                                <div class="mt-post-text">
                                                    <a href="@comCategory.CategoryLink"> <p> @Partial.CategoryShortContent(comCategory.CategoryID, 105)</p></a>
                                                </div>
                                                <div class="readmore-line">
                                                    <span><a href="@comCategory.CategoryLink" class="site-button-link" data-hover="Read More">@Partial.Translate("Devami", lang)<i class="fa fa-angle-right arrow-animation"></i></a></span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            }
                        </div>
                    </div>
                </div>

            </div>
        </div>
    }
}

Makale

@{
    int card81Col = 3;
    int card81Row = 1;
    int card81categoryOrderNumber = 3;

    if (Partial.isCategoryOrderNumber(card81categoryOrderNumber))
    {
        Category categorytitle = Partial.Category(card81categoryOrderNumber, lang);

        IEnumerable<Post>
        card81PostsOrderNumber = Partial.PostsOrderNumber(card81categoryOrderNumber, 0, card81Col * card81Row, Partial.Order.OrderBy, true, lang);

        int card81Count = Convert.ToInt32(Math.Ceiling(card81PostsOrderNumber.Count() / Convert.ToDouble(card81Col)));

        <div class="section-full mobile-page-padding p-t80 p-b30 square_shape1 bg-parallax bg-cover" data-stellar-background-ratio="0.5" style="background-image:url(@categorytitle.CategoryThumbnail);">
            <div class="container">
                <div class="section-head ">
                    <div class="mt-separator-outer separator-center">
                        <div class="mt-separator">
                            <h2 class="text-white text-uppercase sep-line-one "><span class="text-white " style="color:white;">@categorytitle.CategoryTitle.HtmlEncode()</span></h2>
                        </div>
                    </div>
                </div>

                <div class="section-content">
                    <div class="container">
                        @for (int componen = 0; componen < card81Count; componen++)
                        {
                            <div class="row">
                                @foreach (Post comPost in card81PostsOrderNumber.Skip(componen * card81Col).Take(card81Col))
                                {
                                    <div class="col-md-4 col-sm-6">
                                        <div class="mt-box blog-post latest-blog-3 date-style-1 bg-white m-b30">
                                            <div class="mt-post-media">
                                                <a href="@Partial.PostLink(comPost.PostID)"><img src="@comPost.PostThumbnail" alt="@comPost.PostTitle.HtmlEncode()"></a>
                                            </div>
                                            <div class="mt-post-info p-a30">
                                                <div class="post-overlay-position">
                                                    <div class="mt-post-title ">
                                                        <a href="@Partial.PostLink(comPost.PostID)"> <h4 class="post-title m-b0">@comPost.PostTitle.HtmlEncode()</h4></a>
                                                    </div>
                                                    <div class="mt-post-text">
                                                        <a href="@Partial.PostLink(comPost.PostID)"> <p> @Partial.PostShortContent(comPost.PostID, 105)</p></a>
                                                    </div>
                                                    <div class="readmore-line">
                                                        <span><a href="@Partial.PostLink(comPost.PostID)" class="site-button-link" data-hover="Read More">@Partial.Translate("Devami", lang)<i class="fa fa-angle-right arrow-animation"></i></a></span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                }
                            </div>
                        }
                    </div>
                </div>

            </div>
        </div>
    }
}

CSS


    .square_shape1, .square_shape2 {
        position: relative;
        overflow: hidden;
        z-index: 0;
    }

    .bg-cover {
        background-size: cover;
    }

    .bg-parallax {
        background-attachment: fixed;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .p-b30 {
        padding-bottom: 30px;
    }

    .p-t80 {
        padding-top: 80px;
    }

    a {
        -webkit-transition: all 0.2s linear;
        -moz-transition: all 0.2s linear;
        -ms-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
        transition: all 0.2s linear;
    }

    .site-button-link {
        display: inline-block;
        font-weight: 600;
        position: relative;
        padding-left: 0;
    }

        .site-button-link i {
            display: inline-block;
            margin: -4px 0px 0px 5px;
            font-size: 16px;
            vertical-align: middle;
            line-height: 24px;
        }

    .arrow-animation {
        position: relative;
        -webkit-animation: linear infinite alternate;
        -webkit-animation-name: run;
        -webkit-animation-duration: 1s;
    }

    @@-webkit-keyframes run {
        0% {
            left: 0;
        }

        50% {
            left: 5px;
        }

        100% {
            left: 0;
        }
    }

İndex Bileşenleri