فروشگاه آنلاین ساین:: گرید محصولات

محصولات طرح بندی خلاقانه

ما طرح بندی محصولاتی را ارائه می دهیم که سایت شما را زیباتر و جذاب تر می کند. لطفا از طرح خلاقانه ما لذت ببرید.

                                .grid-type {
                                    display: grid;
                                    grid-template-columns: repeat(auto-fill,calc(100% / 4));
                                    .grid-item {
                                        grid-row-end: span 1;
                                        grid-column-end: span 1;
                                    &.grid-height-2 {
                                        grid-row-end: span 2;
                                        grid-column-end: span 2;
                                    }
                                }
                                @include mq(lg, max) {
                                    .grid-type {
                                        grid-template-columns: repeat(auto-fill,calc(100% / 2));
                                    }
                                }

اسپیکر بلوتوثی

230,000 تومان

ساعت هوشمند اپل

8,000,000 تومان ~~1,200,000 تومان~~

شارژر بی سیم

2,200,000 تومان

ساعت هوشمند

58,000 تومان

گوشی سامسونگ

2,300,000 تومان

نمایش کد

انواع دیگر

                                .grid-type-other {
                                    display: grid;
                                    grid-template-columns: repeat(auto-fill,calc(100% / 4));
                                    grid-template-rows: repeat(auto-fill,calc(100% / 3));
                                    .height-x3 { 
                                        grid-row-end: span 3;
                                        grid-column-end: span 1;
                                    }
                                    @include mq(xl, max) {
                                        grid-template-columns: repeat(auto-fill,calc(100% / 3));
                                    }
                                    @include mq('800px', max) {
                                        grid-template-columns: repeat(auto-fill,calc(100% / 2));
                                        grid-template-rows: repeat(auto-fill,calc(100% / 5));
                                    }
                                    @include mq(sm, max) {
                                        grid-template-columns: repeat(auto-fill,calc(100% / 1));
                                    }
                                }