Section Row 3 Post Hover +++

Kategori

<section class="discus-parallax bg-white">
    @{
        int card90Col = 3;
        int card90Row = 1;
        int card90CategoryOrderNumber = 14;

        if (Partial.isCategoryOrderNumber(card90CategoryOrderNumber))
        {
            IEnumerable<Category>
                card90Category = Partial.CategorySubOrderNumber(card90CategoryOrderNumber, lang);
            Category card90categorytitle = Partial.Category(card90CategoryOrderNumber, lang);
            int card90Count = Convert.ToInt32(Math.Ceiling(card90Category.Count() / Convert.ToDouble(card90Col)));
            <div class="container-fluid algelbg">
                <div class="container pt30 pb30 algel">
                    @for (int componen = 0; componen < card90Row; componen++)
                    {
                        <div class="row">
                            @foreach (Category comCategory in card90Category.Skip(componen * card90Row).Take(card90Col))
                            {
                                <div class="col-sm-12 kategorilisteli p-2">
                                    <div class="row">
                                        <div class="col-sm-2">
                                            <a href="@Partial.CategoryLink(comCategory.CategoryID)">
                                                <div class="listeliresim1" style="background-image:url(@comCategory.CategoryThumbnail);"></div>
                                            </a>
                                        </div>
                                        <div class="col-sm-10">
                                            <a class="baslik" href="@Partial.CategoryLink(comCategory.CategoryID)">
                                                <h4>@comCategory.CategoryTitle.HtmlEncode()</h4>
                                                <p>
                                                    @Partial.CategoryShortContent(comCategory.CategoryID, 300)
                                                </p>
                                                <h5>@Partial.Translate("Devami", lang) >></h5>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            }
                        </div>
                    }
                </div>
            </div>
        }
    }
</section>

Makale

<section class="discus-parallax bg-white">
    @{
        int card83Col = 3;
        int card83Row = 1;
        int card83categoryOrderNumber = 3;

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

            IEnumerable<Post>
            card83PostsOrderNumber = Partial.PostsOrderNumber(card83categoryOrderNumber, 0, card83Col * card83Row, Partial.Order.OrderBy, true, lang);

            int card83Count = Convert.ToInt32(Math.Ceiling(card83PostsOrderNumber.Count() / Convert.ToDouble(card83Col)));
            <div class="container-fluid algelbg">
                <div class="container pt30 pb30 algel">
                    @for (int componen = 0; componen < card83Count; componen++)
                    {
                        <div class="row">
                            @foreach (Post comPost in card83PostsOrderNumber.Skip(componen * card83Col).Take(card83Col))
                            {
                                <div class="col-sm-12 kategorilisteli p-2">
                                    <div class="row">
                                        <div class="col-sm-2">
                                            <a href="@Partial.PostLink(comPost.PostID)">
                                                <div class="listeliresim1" style="background-image:url(@comPost.PostThumbnail);"></div>
                                            </a>
                                        </div>
                                        <div class="col-sm-10">
                                            <a class="baslik" href="@Partial.PostLink(comPost.PostID)">
                                                <h4>@comPost.PostTitle.HtmlEncode()</h4>
                                                <p>
                                                    @Partial.PostShortContent(comPost.PostID, 300)
                                                </p>
                                                <h5>@Partial.Translate("Devami", lang) >></h5>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            }
                        </div>
                    }
                </div>
            </div>
        }
    }
</section>

CSS

.listeliresim1 {
        height: 160px;
        width: 160px;
        margin-left: auto;
        margin-right: auto;
        border-radius: 50%;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .kategorilisteli {
        padding: 15px 0;
    }

        .kategorilisteli a {
            color: #000;
        }

        .kategorilisteli:hover {
            background-color: #ececec;
        }

        .kategorilisteli h4 {
            font-weight: 700;
            font-size: 18px;
            margin-top: 10px;
            margin-bottom: 10px;
        }

        .kategorilisteli h5 {
            font-size: 14px;
            margin-top: 10px;
            margin-bottom: 10px;
        }

        .kategorilisteli:hover h4 {
            color: #b40766;
        }

https://www.adapsikoloji.com/tr

https://www.agrilion.com.tr/tr