Grid layout for XFRM without Addon

Grid layout for XFRM without Addon

Less код, пока не полный.
Less:
//макет сетки в 2 столбца для менеджера ресурсов
template-xfrm_overview,
.template-xfrm_category_view {
    .structItem--resource {
        background-color: white;
        border-collapse: collapse;
        padding: 0px;
        width: 100%;
        min-height: 138px;
        height: 138px;
        height: auto;
        display: inline-block;
        margin: 9px 0px 0px 6px;
        max-width: 49%;
        max-height: 162px;
        box-sizing: border-box;
        vertical-align: top;
        border-radius: 2px;
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.28);
        @media (max-width: 1125px) {
            max-width: calc(95%);
        }
        @media (max-width: 650px) {
            display: table;
            max-width: 100%;
            margin: 5px 5px 5px 0px;
            box-shadow: none;
        }

        .structItem-cell--main {
            width: 100%;
            height: 112px;
        }

        .structItem-cell--resourceMeta {
            display: block;
            width: auto;
            margin-top: -13px;
            margin-bottom: 15px;

            .pairs--justified > dd {
                float: left;
                text-align: right;
                max-width: 100%;
            }

        }

        .ratingStarsRow--justified {
            border-bottom: 1px solid #dfdfdf;
            margin-bottom: 2px;
            padding-bottom: 2px;
        }

        .structItem-metaItem--lastUpdate,
        .structItem-metaItem--downloads {
            float: left;
        }

        .structItemContainer {
            background-color: #f5f5f5;
        }

        .structItem-cell--iconExpanded {
            width: 120px;
            @media (max-width: 650px) {
                //width: 100px;
            }

            .structItem-iconContainer {
                .avatar {
                    width: 96px;
                    height: 96px;
                    font-size: 57.6px;
                    margin-left: 3px;

                    &.structItem-secondaryIcon {
                        display: none;
                    }

                }
            }
        }
    }
}
Назад
Сверху Снизу