Перейти к содержимому


Мобильная Версия


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 30

#1 tolikkansk

tolikkansk

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 357 сообщений

Отправлено 04 Февраль 2015 - 10:43

Можно ли редактировать мобильную версию?

#2 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 05 Февраль 2015 - 01:13

Редактировать мобильную версию вы можете в разделе Сайт - Редактор шаблонов - в файле main.css.
Код отвечающий за адаптивность сайта на разных устройствах:
/******************************************************************************
Min Width "768px"
*******************************************************************************/
@media all and (min-width: 768px) {
.container{width:750px}
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12{float:left}
.col-sm-12{width:100%}
.col-sm-11{width:91.66666667%}
.col-sm-10{width:83.33333333%}
.col-sm-9{width:75%}
.col-sm-8{width:66.66666667%}
.col-sm-7{width:58.33333333%}
.col-sm-6{width:50%}
.col-sm-5{width:41.66666667%}
.col-sm-4{width:33.33333333%}
.col-sm-3{width:25%}
.col-sm-2{width:16.66666667%}
.navbar {border-radius: 4px;}
.navbar-collapse{width:auto;border-top: 0 !important;;box-shadow:none} /* border-top: 0; */
.navbar-collapse.collapse{display:block !important;height:auto !important;padding-bottom:0;overflow:visible !important}
.navbar-collapse.in{overflow-y:visible}
.navbar-fixed-top .navbar-collapse,.navbar-static-top .navbar-collapse,.navbar-fixed-bottom .navbar-collapse{padding-left:0;padding-right:0}
.navbar-nav{float:left;margin:0}
.navbar-nav>li{float:left}
.navbar-nav>li>a{padding-top:15px;padding-bottom:15px}
.navbar-nav.navbar-right:last-child{margin-right:-15px}
.navbar-left{float:left !important}
.navbar-right{float:right !important}
.navbar-toggle{display:none}
}
/******************************************************************************
Min Width "992px"
*******************************************************************************/
@media all and (min-width: 992px) {
.container{width:970px}
.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12{float:left}
.col-md-12{width:100%}
.col-md-11{width:91.66666667%}
.col-md-10{width:83.33333333%}
.col-md-9{width:75%}
.col-md-8{width:66.66666667%}
.col-md-7{width:58.33333333%}
.col-md-6{width:50%}
.col-md-5{width:41.66666667%}
.col-md-4{width:33.33333333%}
.col-md-3{width:25%}
.col-md-2{width:16.66666667%}
.col-md-1{width:8.33333333%}
.navbar-collapse {display: block !important;height: auto !important;}
.header .primary .sub {-webkit-backface-visibility: hidden;}
.header .primary .navbar .nav {width:553px;}
.hide-cat {display:none !important}
}
/******************************************************************************
Min Width "1200px"
*******************************************************************************/
@media all and (min-width: 1200px) {
.container{width:1200px}
.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12{float:left}
.col-lg-12{width:100%}
.col-lg-11{width:91.66666667%}
.col-lg-10{width:83.33333333%}
.col-lg-9{width:75%}
.col-lg-8{width:66.66666667%}
.col-lg-7{width:58.33333333%}
.col-lg-6{width:50%}
.col-lg-5{width:41.66666667%}
.col-lg-4{width:33.33333333%}
.col-lg-3{width:25%}
.col-lg-2{width:16.66666667%}
.col-lg-1{width:8.33333333%}
.header .primary .navbar .nav {width:745px;}
#main {overflow-x:hidden;}
}
/******************************************************************************
  Min Width "1600px"
*******************************************************************************/
@media screen and (min-width: 1400px) {
.page-box-content {padding-bottom: 510px;}
}
/******************************************************************************
  Max Width "1200px"
*******************************************************************************/
@media screen and (max-width: 1200px) {
.pagination-box {margin: 20px 0;float: left;clear: both;}
.phone-active, .search-active {left: 0;width: auto;}
}
/******************************************************************************
Max Width "1199px" - Min Width "992px"
*******************************************************************************/
@media all and (min-width: 992px) and (max-width: 1199px) {
.sidebar .banners .slide {width: 220px;}
.col-md-3.product, .col-md-3 > .product {max-width: 242px;}
}
/******************************************************************************
Max Width "991px"
*******************************************************************************/
@media all and (max-width: 991px) {
.fixed-header .page-box {margin-top: 0 !important;padding-top: 0 !important;-webkit-transition: none !important;transition: none !important;}
.fixed-header.hidden-top #top-box {margin-top: 0;margin-bottom: 0;position: static;}
.fixed-header .header, .fixed-header.hidden-top.visible-top .header {-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;position: static;top: inherit;-webkit-backface-visibility: inherit;-webkit-transform: inherit;}
.fixed-header .header-two + * {margin-top: 0;}
.hidden-top {margin-top: 0;}
.fixed-header {margin-top: 0 !important;padding-top: 0 !important;}
.fixed-header.hidden-top {-webkit-transition: all 0 linear;transition: all 0 linear;}
.fixed-header.hidden-top .header {margin-top: 0;position: static;}
.fixed-header.hidden-top.visible-top .header,
.fixed-header.hidden-top.fixed #top-box,
.fixed-header.hidden-top.visible-top.fixed #top-box {margin-top: 0;}
.header {width: auto;}
.header .right-box-wrapper {text-align: right;}
.header .header-icons {margin: 0;}
.header .cart-header {margin-right: 0;}
.header .primary,
.header .header-icons {display: inline-block;float: none;vertical-align: top;}
.header .primary {margin: 0 0 0 -4px;text-align: left;z-index: inherit;}
.header .primary .navbar {margin: 0;min-height: inherit;position: static;}
.header .primary .navbar .btn-navbar {background: #fff;border: 1px solid #ccc;border-bottom: 0 none;-webkit-border-radius: 3px 3px 0 0;-moz-border-radius: 3px 3px 0 0;border-radius: 3px 3px 0 0;-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;display: block;float: left;height: 46px;line-height: 15px;margin: 0;padding: 10px 15px;position: relative;text-shadow: none;z-index: 920;}
.header .primary .navbar .btn-navbar:before {border-left: 1px solid #ccc;bottom: 8px;content: "";display: none;left: -1px;position: absolute;top: 7px;}
.header .primary .navbar .btn-navbar.collapsed:before {display: block;}
.header .primary .navbar .btn-navbar.collapsed {background: none;border: 1px solid transparent;border-bottom: 0 none;}
.header .primary .navbar .btn-navbar .text {color: #1e1e1e;float: right;line-height: 16px;padding: 0 0 0 30px;}
.header .primary .navbar .btn-navbar .icon-bar {background: #00c59c;-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;height: 3px;margin: 0;width: 22px;}
.header .primary .navbar .btn-navbar .icon-bar + .icon-bar {margin-top: 3px;}
.header .primary .navbar .navbar-collapse {border: 0 none;box-shadow: none;left: auto;margin: 22px 0 0;max-height: inherit;overflow: hidden !important;padding: 0 15px;position: absolute;right: 0;top: 50%;width: 200%;z-index: 919;}
.header .primary .navbar .nav {background: #fff;border: 1px solid #ccc;-webkit-border-radius: 3px 0 3px 3px;-moz-border-radius: 3px 0 3px 3px;border-radius: 3px 0 3px 3px;float: none;padding: 6px 6px 3px;}
.header .primary .navbar .nav > li {float: none;margin: 0 0 3px;padding: 0;}
.header .primary .navbar .nav > li > a,
.header .primary .navbar .nav > li > a:visited {background: #f2f2f2;border: 1px solid #f2f2f2;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;font-weight: normal;margin: 0;padding: 7px 9px 7px 59px;text-decoration: none;}
.header .primary .navbar .nav > li > a:hover,
.header .primary .navbar .nav > li:hover > a {background: #e9e9e9;border: 1px solid #e9e9e9;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;}
.header .primary .navbar .nav > .parent > a,
.header .primary .navbar .nav > li.parent:hover > a {background: #f2f2f2;position: relative;}
.header .primary .navbar .nav .parent .parent > a:after {display: none;}
.header .primary .navbar .nav .open-sub {bottom: 0;left: 0;position: absolute;top: 0;width: 55px;}
.header .primary .navbar .nav .open-sub span {background: #1e1e1e;display: block;height: 2px;margin: 17px 0 0 15px;position: absolute;width: 16px;}
.header .primary .navbar .nav .open-sub span + span {height: 16px;margin: 10px 0 0 22px;width: 2px;}
.header .primary .navbar .nav .parent .parent > a .open-sub span {background: #7f7f7f;height: 2px;margin: 14px 0 0 38px;position: absolute;width: 12px;}
.header .primary .navbar .nav .parent .parent > a .open-sub span + span {height: 12px;margin: 9px 0 0 43px;width: 2px;}
.header .primary .navbar .nav > li.parent:hover > a:after {display: none;}
.header .primary .sub, .header .primary .parent .sub,
.header .primary .parent:hover > .sub {background: #f7f7f7;border: 0 none;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;display: none;font-size: 13px;left: 0;line-height: 24px;margin-top: 0;margin-bottom: 0;padding: 6px 0 5px;position: relative;}
.header .primary .navbar .nav > li.parent:hover > a {background-color: #e9e9e9;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;}
.header .primary .navbar .nav > .parent.active > a,
.header .primary .navbar .nav > .parent.active:hover > a{background: #1e1e1e;border-color: #1e1e1e;color: #fff;-webkit-transition: all 0.2s linear;transition: all 0.2s linear;}
.header .primary .navbar .nav > .parent.active > a .open-sub span {background: #fff;}
.header .primary .navbar .nav .parent.active > a .open-sub span + span {display: none;}
.header .primary .parent:hover > .sub {-webkit-animation: fadeIn 0;animation: fadeIn 0;}
.header .primary .sub li {line-height: 22px;}
.header .primary .sub a,
.header .primary .sub a:visited {background: none;color: #7f7f7f;padding: 4px 9px 4px 60px;text-decoration: none;width: auto !important;}
.header .primary .navbar .nav a > i {color: #1e1e1e;}
.header .primary li:hover > .sub a {background: none;}
.header .primary .sub .sub {left: 0;margin-left: 10px;}
.header .cart-header .dropdown-menu {margin-top: -1px;margin-right: -98px;}
.header .cart-header.open .dropdown-toggle:after {left: 0;}
.sidebar.col-sm-12 {margin-top: 40px;}
.toolbar .grid-list .grid, .toolbar .grid-list .list {margin-right: 6px;}
.toolbar .sort-catalog {margin: 0 6px 20px 1px;}
.products.grid {margin-left: -10px;margin-right: -10px;text-align: center;}
.table-box {padding: 0 1px;}
.product-page .product-options .col-sm-12 {float: none;margin-bottom: 20px;width: 100%;}
.shopping-cart-table tbody td {padding: 20px;}
#footer .sidebar .widget:nth-child(2n+1) {clear: left;}
.compare-info .buttons a {float:left;margin-right: 20px;}
.product-page .goods-pagination {float:left;}
}
/******************************************************************************
Max Width "991px" - Min Width "768px"
*******************************************************************************/
@media all and (min-width: 768px) and (max-width: 991px) {
.top-navbar .nav > li a {padding-left: 10px;padding-right: 10px;}
.primary .navbar-collapse.collapse {display: none !important;}
.primary .navbar-collapse.collapse.in {display: block !important;}
.toolbar .filterbar .layout-slider {width: 200px;}
.product-page .image-box .thumblist-box {padding: 0 45px;}
.product-page .image-box #thumblist a {height: 100px;width: 100px;}
.contact-info address {float: none;width: 100%;}
.sidebar .banners .slide {width: 165px;}
.sidebar .banners .banner-text {padding: 10px;}
.sidebar .banners .banner-text p {display: none;}
.products-tab .tab-content {overflow: visible;}
.col-sm-5.respond-carousel .carousel .respond {max-width: 312px;}
#footer .footer-top .col-md-3 {margin-bottom: 40px;}
.product, .cat {width: 240px;}
.register .buttons a:first-child {margin-right:20px;}
.register .buttons button:first-child {margin-right:20px;}
.register .buttons a:last-child {float:left;}
.register .buttons button:last-child {float:left;}
.reviews-box .rating-box {margin:0 auto;float:none;}
.product-page .goods-pagination {text-align: center;float:none;margin-top: 10px;}
.product-page .reviews-box {height: auto;}
}
/******************************************************************************
Max Width "767px"
*******************************************************************************/
@media all and (max-width: 767px) {
.container {padding-left: 10px;padding-right: 10px;}
.carousel .col-sm-1, .carousel .col-sm-2, .carousel .col-sm-3, .carousel .col-sm-4 {min-width: 160px;}
.carousel .col-sm-5, .carousel .col-sm-6, .carousel .col-sm-7, .carousel .col-sm-8, .carousel .col-sm-9, .carousel .col-sm-10, .carousel .col-sm-11, .carousel .col-sm-12 {min-width: 300px;}
.carousel .col-md-1, .carousel .col-md-2, .carousel .col-md-3, .carousel .col-md-4, .carousel .col-xs-1, .carousel .col-xs-2, .carousel .col-xs-3, .carousel .col-xs-4, .carousel .col-xs-5, .carousel .col-xs-6, .carousel .col-xs-7, .carousel .col-xs-8, .carousel .col-xs-9, .carousel .col-xs-10, .carousel .col-xs-11, .carousel .col-xs-12 {max-width: 300px;}
.col2-set .col-1, .col2-set .col-2 {float: none;width: 100%;}
.col2-set .col-1 {margin-bottom: 40px;}
body, body.loaded {min-width: 320px;padding-left: 0;padding-right: 0;overflow-x: hidden;}
h1 {font-size: 28px;}
h2 {font-size: 26px;}
h3 {font-size: 24px;}
h4 {font-size: 22px;}
h5 {font-size: 20px;}
h6 {font-size: 18px;}
.page-box {height: auto !important;min-height: inherit;overflow-x: hidden;}
.page-box-content {padding-bottom: 0;}
#top-box .btn-group.btn-select .visible-xs {display: inline-block !important;}
#top-box .btn-group.btn-select .dropdown-menu {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-border-radius: 0 3px 3px 3px;-moz-border-radius: 0 0 3px 3px;border-radius: 0 0 3px 3px;min-width: inherit;width: 100%;}
.top-navbar {margin: 0;min-height: 30px;}
.top-navbar .btn-navbar {background: none !important;border-color: rgba(255,255,255,.2);-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;color: #fff;color: rgba(255,255,255,.7);float: left;font-size: 16px;margin: 0;padding: 7px;}
.top-navbar .btn-navbar.collapsed {border-color: transparent;}
.navbar-inverse .navbar-toggle .icon-bar {background-color: rgba(255,255,255,.7);-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;}
.top-navbar .collapse, .top-navbar .collapsing {background: #fff;border: 0 none;left: 0;margin: 5px -10px 0;padding: 0;position: absolute !important;top: 100%;z-index: 1002;}
.top-navbar .navbar-nav {margin: 0;}
#top-box .top-navbar .nav > li a {color: #7b7b7b;}
.top-navbar .nav > li:hover a, .top-navbar .nav > li a:hover {background: none;}
.top-navbar.top-navbar-right .btn-navbar {float: right;}
.top-navbar.top-navbar-right .collapse, .top-navbar.top-navbar-right .collapsing {left: auto;right: 0;}
.top-navbar .nav > li a .count {background: rgba(0,0,0,.1);}
.header-three {overflow: hidden;}
.header .right-box {padding-left: 0;}
.phone-active, .search-active {left: 10px;padding: 0;right: 10px;}
.phone-active {font-size: 22px;line-height: 58px;}
.phone-active .title {display: none;}
.search-active .search-string, .search-active .search-string:hover {padding-left: 8px;}
.header .cart-header .dropdown-toggle, .header .primary .navbar .btn-navbar {padding-left: 10px;padding-right: 10px;}
.header .cart-header .dropdown-menu {width: 325px;}
.header.header-three .logo-box {width: 100%;}
.breadcrumb {padding-left: 10px;padding-right: 10px;}
#main {padding: 40px 0;}
#main.no-padding {padding-top: 0;padding-bottom: 0;}
.content.pull-right {float: none !important;}
.sidebar {margin-top: 40px;}
.sidebar .widget {margin: 0 0 40px;}
.sidebar .carousel > .col-md-3 {float: left;margin-left: 10px;margin-right: 10px;}
#catalog .category-img {margin-bottom: 40px;}
#catalog .category-img .description {font-size: 18px;padding: 20px;}
.toolbar .filterbar .layout-slider {width: 240px;}
.pagination-box {margin-top: 0;text-align: center;}
.pagination-box .pagination {margin: 0 -5px 0 0;}
.pagination-box .pagination-text {display: block;float: none;}
.products {text-align: center;}
.list .product .col-md-3, .list .product .col-md-4 {margin-bottom: 20px;}
.list .product .product-image {margin-left: auto;margin-right: auto;max-width: 300px;}
.caroufredsel_wrapper {margin-left: auto !important;margin-right: auto !important;}
.recommended-product .products > .col-md-3 .product {display: block;margin-left: 0;margin-right: 0;}
.products-tab .tab-content > .tab-pane {height: 263px;text-align: center;}
.text-center-mobile {text-align: center;}
.accordion-tab {border: 0 none;float: none;width: 100%;}
.accordion-tab > li {float: none;margin: 0 0 3px;}
.accordion-tab > li > a, .products-tab .accordion-tab > li > a {background-position: 14px 50%;background-repeat: no-repeat;background-color: #f2f2f2;border: 0 none;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;color: #1e1e1e;display: block;font-size: 14px;line-height: 22px;margin: 0;padding: 9px 9px 9px 60px;position: relative;text-decoration: none;-webkit-transition: all .2s linear;transition: all .2s linear;}
.accordion-tab > li > a:hover, .products-tab .accordion-tab > li > a:hover {background-color: #e9e9e9;-webkit-transition: all .2s linear;transition: all .2s linear;}
.accordion-tab > li.active > a, .accordion-tab > li.active > a:hover, .accordion-tab > li.active > a:focus, .accordion-tab > li.active:hover > a, .products-tab .accordion-tab > li.active > a, .products-tab .accordion-tab > li.active:hover > a {background-color: #1e1e1e;border: 0 none;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;color: #fff !important;}
.accordion-tab > li > a:before, .products-tab .accordion-tab > li > a:before {background: #e1e1e1;background: rgba(255,255,255,.4);bottom: 0;content: "";display: block;left: 45px;position: absolute;top: 0;width: 1px;}
.accordion-tab > li.active > a:before, .products-tab .accordion-tab > li.active > a:before {background: #444;background: rgba(255,255,255,.2);}
.accordion-tab > li > a .open-sub, .products-tab .accordion-tab > li > a .open-sub {bottom: 0;display: block;left: 0;position: absolute;top: 0;width: 45px;}
.accordion-tab > li > a .open-sub:before, .accordion-tab > li > a .open-sub:after, .products-tab .accordion-tab > li > a .open-sub:before, .products-tab .accordion-tab > li > a .open-sub:after {background: #1e1e1e;content: "";display: block;height: 2px;left: 0;margin: 19px 0 0 15px;position: absolute;top: 0;width: 16px;}
.accordion-tab > li > a .open-sub:after, .products-tab .accordion-tab > li > a .open-sub:after {height: 16px;margin: 12px 0 0 22px;width: 2px;}
.accordion-tab > .active > a .open-sub:before, .accordion-tab > .active > a .open-sub:after, .products-tab .accordion-tab > .active > a .open-sub:before, .products-tab .accordion-tab > .active > a .open-sub:after {background: #fff;}
.accordion-tab > .active > a .open-sub:after, .products-tab .accordion-tab > .active > a .open-sub:after {display: none;}
.accordion-tab .tab-pane {border: 0 none;display: none;font-size: 13px;padding: 20px 0 30px;}
.page-header {margin-bottom: 40px;}
.image-box {margin: 0 auto 40px;max-width: 470px;}
.product, .cat {width: 300px;}
.product-page .image-box .thumblist-box {max-height: 80px;padding: 0 45px;}
.product-page .image-box #thumblist a {height: 100px;width: 100px;}
.product-page .col-md-7 .price-box {font-size: 40px;}
.product-page .add-cart-form {margin-bottom: 0;}
.product-page .add-cart-form .add-cart,
.product-page .add-cart-form .number {margin-bottom: 40px;}
.product-page .product-tab {margin: 40px 0;}
.product-page .product-tab .tab-pane {padding: 20px 0;}
.product-page .add-cart-form .add-cart {width: 200px;}
.product .col-sm-8.col-md-8 {text-align: center;}
.map-box .contact-info {margin-bottom: 20px;padding: 0;position: relative;top: 0;}
.box-404 {-webkit-border-radius: 150px;-moz-border-radius: 150px;border-radius: 150px;height: 300px;margin: 0 auto 40px;padding: 75px 0 0;width: 300px;}
.box-404 h1 {font-size: 120px;}
.team-box {text-align: center;}
.list-images {margin-left: -10px;margin-right: -10px;margin-bottom: 20px;text-align: center;}
.list-images > .col-md-4 {display: inline-block;margin: 0 0 20px;text-align: left;width: 170px;}
.layout-slider {width: 240px;}
.respond-carousel .carousel [class*="span"] {margin-left: 2px;margin-right: 2px;}
#footer {margin-top: 0;}
#footer .sidebar {margin-top: 0;}
#footer .footer-top {padding-bottom: 0;}
#footer .footer-top .col-md-3 {margin-bottom: 36px;overflow: hidden;}
#footer .footer-bottom .col-md-3 {margin-bottom: 36px;overflow: hidden;}
#footer .footer-bottom .copyright {padding: 17px 0;text-align: center;}
#footer .phone,
#footer .address {float: left;margin-bottom: 29px;width: 48%;}
#footer .phone .title {display: block;}
#footer .address {float: right;}
#footer .up {float: none;margin: 0 auto;}
#back-top .up {bottom:10px;right:10px;}
.content-discount {text-align: center;}
.content-discount .img-discount {width:100%}
.content-discount .desc-discount {width:100%}
#quickform-order,#quickform-close {margin:0.1em 0;display:inline-block;text-align:center;}
}
/******************************************************************************
  Max Width "681px"
*******************************************************************************/
@media screen and (max-width: 681px) and (min-width:600px) {
.header .primary .navbar .navbar-collapse {margin:45px 0 0 ;}
}
/******************************************************************************
  Max Width "640px"
*******************************************************************************/
@media screen and (max-width: 640px) {
.nav-tabs > li {width:100%;border: 1px solid #ddd;background: #f2f2f2;}
.nav-tabs > li > a.active {border:0;}
.nav-tabs > li > a {border:0;}
.tab-content {border-bottom: 1px solid #e1e1e1;border-right: 1px solid #e1e1e1;border-left: 1px solid #e1e1e1;}
.goodsDataOpinionAverageInfo a {float: left;margin: 5px 0 5px 20px;}
.goodsDataOpinionAverageInfo span {float: left;margin: 5px 0 5px 20px;}
}
/******************************************************************************
Max Width "600px"
*******************************************************************************/
@media all and (max-width: 600px) {
.header .cart-header .dropdown-toggle .count {display: none;}
.header .cart-header .dropdown-toggle, .header .primary .navbar .btn-navbar {padding-left: 5px;padding-right: 5px;}
.header.header-two .primary .navbar .btn-navbar.collapsed:before {display: none;}
.hidden-600 {display: none !important;}
}
/******************************************************************************
  Max Width "580px"
*******************************************************************************/
@media only screen and (min-width:220px) and (max-width:580px){
.table-box{overflow-x:scroll;}
.cart-info{min-width:320px;overflow-x:scroll;}
.scroll{min-width:320px;overflow-x:scroll;}
.cart-info .buttons a:last-child {float:left;}
}
/******************************************************************************
Max Width "480px"
*******************************************************************************/
@media all and (max-width: 480px) {
.slider .slid-content .title {max-height: 42px;overflow: hidden;}
#quickform-order,#quickform-close {float:none;}
.reviews-box .rating-box {margin:0 auto;float:none;}
.product-page .goods-pagination {text-align: center;float:none;margin-top: 10px;}
.product-page .reviews-box {height: auto;}
}
/******************************************************************************
Max Width "388px"
*******************************************************************************/
@media all and (max-width: 388px) {
.header .primary .navbar .btn-navbar:before {border:0;}
.header .primary .navbar .navbar-collapse {margin:45px 0 0 0;}
.goodsDataOpinionAverageInfo a {clear:both;}
.goodsDataOpinionAverageInfo span {clear:both;}
.col-xs-6.right-box {width:50%}
.col-xs-6.logo-box {width:50%;}
#goodsDataOpinionAdd .form-control, #goodsDataOpinionAdd .textarea {max-width:150px;}
.goodsDataOpinionCaptcha #opinion_captcha_string {width:50px;}
.goodsDataOpinionCaptcha .captcha {width:0;}
.input-text, .form-control, .textarea {width:200px;}
.callbackForm.form-box .input-text, .callbackForm.form-box .form-control, .callbackForm.form-box .textarea {width:150px;}
.buttons a:first-child {margin-right:20px;}
.buttons button:first-child {margin-right:20px;}
.buttons a:last-child {float:left;}
.buttons button:last-child {float:left;}
.buttons span:last-child {float:left;}
.product-page .goods-pagination {font-size:85%;}
}


#3 tolikkansk

tolikkansk

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 357 сообщений

Отправлено 05 Февраль 2015 - 07:55

Просмотр сообщенияVaccina (05 Февраль 2015 - 01:13) писал:

Редактировать мобильную версию вы можете в разделе Сайт - Редактор шаблонов - в файле main.css.
Код отвечающий за адаптивность сайта на разных устройствах:
/******************************************************************************
Min Width "768px"
*******************************************************************************/
@media all and (min-width: 768px) {
.container{width:750px}
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12{float:left}
.col-sm-12{width:100%}
.col-sm-11{width:91.66666667%}
.col-sm-10{width:83.33333333%}
.col-sm-9{width:75%}
.col-sm-8{width:66.66666667%}
.col-sm-7{width:58.33333333%}
.col-sm-6{width:50%}
.col-sm-5{width:41.66666667%}
.col-sm-4{width:33.33333333%}
.col-sm-3{width:25%}
.col-sm-2{width:16.66666667%}
.navbar {border-radius: 4px;}
.navbar-collapse{width:auto;border-top: 0 !important;;box-shadow:none} /* border-top: 0; */
.navbar-collapse.collapse{display:block !important;height:auto !important;padding-bottom:0;overflow:visible !important}
.navbar-collapse.in{overflow-y:visible}
.navbar-fixed-top .navbar-collapse,.navbar-static-top .navbar-collapse,.navbar-fixed-bottom .navbar-collapse{padding-left:0;padding-right:0}
.navbar-nav{float:left;margin:0}
.navbar-nav>li{float:left}
.navbar-nav>li>a{padding-top:15px;padding-bottom:15px}
.navbar-nav.navbar-right:last-child{margin-right:-15px}
.navbar-left{float:left !important}
.navbar-right{float:right !important}
.navbar-toggle{display:none}
}
/******************************************************************************
Min Width "992px"
*******************************************************************************/
@media all and (min-width: 992px) {
.container{width:970px}
.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12{float:left}
.col-md-12{width:100%}
.col-md-11{width:91.66666667%}
.col-md-10{width:83.33333333%}
.col-md-9{width:75%}
.col-md-8{width:66.66666667%}
.col-md-7{width:58.33333333%}
.col-md-6{width:50%}
.col-md-5{width:41.66666667%}
.col-md-4{width:33.33333333%}
.col-md-3{width:25%}
.col-md-2{width:16.66666667%}
.col-md-1{width:8.33333333%}
.navbar-collapse {display: block !important;height: auto !important;}
.header .primary .sub {-webkit-backface-visibility: hidden;}
.header .primary .navbar .nav {width:553px;}
.hide-cat {display:none !important}
}
/******************************************************************************
Min Width "1200px"
*******************************************************************************/
@media all and (min-width: 1200px) {
.container{width:1200px}
.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12{float:left}
.col-lg-12{width:100%}
.col-lg-11{width:91.66666667%}
.col-lg-10{width:83.33333333%}
.col-lg-9{width:75%}
.col-lg-8{width:66.66666667%}
.col-lg-7{width:58.33333333%}
.col-lg-6{width:50%}
.col-lg-5{width:41.66666667%}
.col-lg-4{width:33.33333333%}
.col-lg-3{width:25%}
.col-lg-2{width:16.66666667%}
.col-lg-1{width:8.33333333%}
.header .primary .navbar .nav {width:745px;}
#main {overflow-x:hidden;}
}
/******************************************************************************
Min Width "1600px"
*******************************************************************************/
@media screen and (min-width: 1400px) {
.page-box-content {padding-bottom: 510px;}
}
/******************************************************************************
Max Width "1200px"
*******************************************************************************/
@media screen and (max-width: 1200px) {
.pagination-box {margin: 20px 0;float: left;clear: both;}
.phone-active, .search-active {left: 0;width: auto;}
}
/******************************************************************************
Max Width "1199px" - Min Width "992px"
*******************************************************************************/
@media all and (min-width: 992px) and (max-width: 1199px) {
.sidebar .banners .slide {width: 220px;}
.col-md-3.product, .col-md-3 > .product {max-width: 242px;}
}
/******************************************************************************
Max Width "991px"
*******************************************************************************/
@media all and (max-width: 991px) {
.fixed-header .page-box {margin-top: 0 !important;padding-top: 0 !important;-webkit-transition: none !important;transition: none !important;}
.fixed-header.hidden-top #top-box {margin-top: 0;margin-bottom: 0;position: static;}
.fixed-header .header, .fixed-header.hidden-top.visible-top .header {-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;position: static;top: inherit;-webkit-backface-visibility: inherit;-webkit-transform: inherit;}
.fixed-header .header-two + * {margin-top: 0;}
.hidden-top {margin-top: 0;}
.fixed-header {margin-top: 0 !important;padding-top: 0 !important;}
.fixed-header.hidden-top {-webkit-transition: all 0 linear;transition: all 0 linear;}
.fixed-header.hidden-top .header {margin-top: 0;position: static;}
.fixed-header.hidden-top.visible-top .header,
.fixed-header.hidden-top.fixed #top-box,
.fixed-header.hidden-top.visible-top.fixed #top-box {margin-top: 0;}
.header {width: auto;}
.header .right-box-wrapper {text-align: right;}
.header .header-icons {margin: 0;}
.header .cart-header {margin-right: 0;}
.header .primary,
.header .header-icons {display: inline-block;float: none;vertical-align: top;}
.header .primary {margin: 0 0 0 -4px;text-align: left;z-index: inherit;}
.header .primary .navbar {margin: 0;min-height: inherit;position: static;}
.header .primary .navbar .btn-navbar {background: #fff;border: 1px solid #ccc;border-bottom: 0 none;-webkit-border-radius: 3px 3px 0 0;-moz-border-radius: 3px 3px 0 0;border-radius: 3px 3px 0 0;-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;display: block;float: left;height: 46px;line-height: 15px;margin: 0;padding: 10px 15px;position: relative;text-shadow: none;z-index: 920;}
.header .primary .navbar .btn-navbar:before {border-left: 1px solid #ccc;bottom: 8px;content: "";display: none;left: -1px;position: absolute;top: 7px;}
.header .primary .navbar .btn-navbar.collapsed:before {display: block;}
.header .primary .navbar .btn-navbar.collapsed {background: none;border: 1px solid transparent;border-bottom: 0 none;}
.header .primary .navbar .btn-navbar .text {color: #1e1e1e;float: right;line-height: 16px;padding: 0 0 0 30px;}
.header .primary .navbar .btn-navbar .icon-bar {background: #00c59c;-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;height: 3px;margin: 0;width: 22px;}
.header .primary .navbar .btn-navbar .icon-bar + .icon-bar {margin-top: 3px;}
.header .primary .navbar .navbar-collapse {border: 0 none;box-shadow: none;left: auto;margin: 22px 0 0;max-height: inherit;overflow: hidden !important;padding: 0 15px;position: absolute;right: 0;top: 50%;width: 200%;z-index: 919;}
.header .primary .navbar .nav {background: #fff;border: 1px solid #ccc;-webkit-border-radius: 3px 0 3px 3px;-moz-border-radius: 3px 0 3px 3px;border-radius: 3px 0 3px 3px;float: none;padding: 6px 6px 3px;}
.header .primary .navbar .nav > li {float: none;margin: 0 0 3px;padding: 0;}
.header .primary .navbar .nav > li > a,
.header .primary .navbar .nav > li > a:visited {background: #f2f2f2;border: 1px solid #f2f2f2;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;font-weight: normal;margin: 0;padding: 7px 9px 7px 59px;text-decoration: none;}
.header .primary .navbar .nav > li > a:hover,
.header .primary .navbar .nav > li:hover > a {background: #e9e9e9;border: 1px solid #e9e9e9;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;}
.header .primary .navbar .nav > .parent > a,
.header .primary .navbar .nav > li.parent:hover > a {background: #f2f2f2;position: relative;}
.header .primary .navbar .nav .parent .parent > a:after {display: none;}
.header .primary .navbar .nav .open-sub {bottom: 0;left: 0;position: absolute;top: 0;width: 55px;}
.header .primary .navbar .nav .open-sub span {background: #1e1e1e;display: block;height: 2px;margin: 17px 0 0 15px;position: absolute;width: 16px;}
.header .primary .navbar .nav .open-sub span + span {height: 16px;margin: 10px 0 0 22px;width: 2px;}
.header .primary .navbar .nav .parent .parent > a .open-sub span {background: #7f7f7f;height: 2px;margin: 14px 0 0 38px;position: absolute;width: 12px;}
.header .primary .navbar .nav .parent .parent > a .open-sub span + span {height: 12px;margin: 9px 0 0 43px;width: 2px;}
.header .primary .navbar .nav > li.parent:hover > a:after {display: none;}
.header .primary .sub, .header .primary .parent .sub,
.header .primary .parent:hover > .sub {background: #f7f7f7;border: 0 none;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;display: none;font-size: 13px;left: 0;line-height: 24px;margin-top: 0;margin-bottom: 0;padding: 6px 0 5px;position: relative;}
.header .primary .navbar .nav > li.parent:hover > a {background-color: #e9e9e9;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;}
.header .primary .navbar .nav > .parent.active > a,
.header .primary .navbar .nav > .parent.active:hover > a{background: #1e1e1e;border-color: #1e1e1e;color: #fff;-webkit-transition: all 0.2s linear;transition: all 0.2s linear;}
.header .primary .navbar .nav > .parent.active > a .open-sub span {background: #fff;}
.header .primary .navbar .nav .parent.active > a .open-sub span + span {display: none;}
.header .primary .parent:hover > .sub {-webkit-animation: fadeIn 0;animation: fadeIn 0;}
.header .primary .sub li {line-height: 22px;}
.header .primary .sub a,
.header .primary .sub a:visited {background: none;color: #7f7f7f;padding: 4px 9px 4px 60px;text-decoration: none;width: auto !important;}
.header .primary .navbar .nav a > i {color: #1e1e1e;}
.header .primary li:hover > .sub a {background: none;}
.header .primary .sub .sub {left: 0;margin-left: 10px;}
.header .cart-header .dropdown-menu {margin-top: -1px;margin-right: -98px;}
.header .cart-header.open .dropdown-toggle:after {left: 0;}
.sidebar.col-sm-12 {margin-top: 40px;}
.toolbar .grid-list .grid, .toolbar .grid-list .list {margin-right: 6px;}
.toolbar .sort-catalog {margin: 0 6px 20px 1px;}
.products.grid {margin-left: -10px;margin-right: -10px;text-align: center;}
.table-box {padding: 0 1px;}
.product-page .product-options .col-sm-12 {float: none;margin-bottom: 20px;width: 100%;}
.shopping-cart-table tbody td {padding: 20px;}
#footer .sidebar .widget:nth-child(2n+1) {clear: left;}
.compare-info .buttons a {float:left;margin-right: 20px;}
.product-page .goods-pagination {float:left;}
}
/******************************************************************************
Max Width "991px" - Min Width "768px"
*******************************************************************************/
@media all and (min-width: 768px) and (max-width: 991px) {
.top-navbar .nav > li a {padding-left: 10px;padding-right: 10px;}
.primary .navbar-collapse.collapse {display: none !important;}
.primary .navbar-collapse.collapse.in {display: block !important;}
.toolbar .filterbar .layout-slider {width: 200px;}
.product-page .image-box .thumblist-box {padding: 0 45px;}
.product-page .image-box #thumblist a {height: 100px;width: 100px;}
.contact-info address {float: none;width: 100%;}
.sidebar .banners .slide {width: 165px;}
.sidebar .banners .banner-text {padding: 10px;}
.sidebar .banners .banner-text p {display: none;}
.products-tab .tab-content {overflow: visible;}
.col-sm-5.respond-carousel .carousel .respond {max-width: 312px;}
#footer .footer-top .col-md-3 {margin-bottom: 40px;}
.product, .cat {width: 240px;}
.register .buttons a:first-child {margin-right:20px;}
.register .buttons button:first-child {margin-right:20px;}
.register .buttons a:last-child {float:left;}
.register .buttons button:last-child {float:left;}
.reviews-box .rating-box {margin:0 auto;float:none;}
.product-page .goods-pagination {text-align: center;float:none;margin-top: 10px;}
.product-page .reviews-box {height: auto;}
}
/******************************************************************************
Max Width "767px"
*******************************************************************************/
@media all and (max-width: 767px) {
.container {padding-left: 10px;padding-right: 10px;}
.carousel .col-sm-1, .carousel .col-sm-2, .carousel .col-sm-3, .carousel .col-sm-4 {min-width: 160px;}
.carousel .col-sm-5, .carousel .col-sm-6, .carousel .col-sm-7, .carousel .col-sm-8, .carousel .col-sm-9, .carousel .col-sm-10, .carousel .col-sm-11, .carousel .col-sm-12 {min-width: 300px;}
.carousel .col-md-1, .carousel .col-md-2, .carousel .col-md-3, .carousel .col-md-4, .carousel .col-xs-1, .carousel .col-xs-2, .carousel .col-xs-3, .carousel .col-xs-4, .carousel .col-xs-5, .carousel .col-xs-6, .carousel .col-xs-7, .carousel .col-xs-8, .carousel .col-xs-9, .carousel .col-xs-10, .carousel .col-xs-11, .carousel .col-xs-12 {max-width: 300px;}
.col2-set .col-1, .col2-set .col-2 {float: none;width: 100%;}
.col2-set .col-1 {margin-bottom: 40px;}
body, body.loaded {min-width: 320px;padding-left: 0;padding-right: 0;overflow-x: hidden;}
h1 {font-size: 28px;}
h2 {font-size: 26px;}
h3 {font-size: 24px;}
h4 {font-size: 22px;}
h5 {font-size: 20px;}
h6 {font-size: 18px;}
.page-box {height: auto !important;min-height: inherit;overflow-x: hidden;}
.page-box-content {padding-bottom: 0;}
#top-box .btn-group.btn-select .visible-xs {display: inline-block !important;}
#top-box .btn-group.btn-select .dropdown-menu {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-border-radius: 0 3px 3px 3px;-moz-border-radius: 0 0 3px 3px;border-radius: 0 0 3px 3px;min-width: inherit;width: 100%;}
.top-navbar {margin: 0;min-height: 30px;}
.top-navbar .btn-navbar {background: none !important;border-color: rgba(255,255,255,.2);-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;color: #fff;color: rgba(255,255,255,.7);float: left;font-size: 16px;margin: 0;padding: 7px;}
.top-navbar .btn-navbar.collapsed {border-color: transparent;}
.navbar-inverse .navbar-toggle .icon-bar {background-color: rgba(255,255,255,.7);-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;}
.top-navbar .collapse, .top-navbar .collapsing {background: #fff;border: 0 none;left: 0;margin: 5px -10px 0;padding: 0;position: absolute !important;top: 100%;z-index: 1002;}
.top-navbar .navbar-nav {margin: 0;}
#top-box .top-navbar .nav > li a {color: #7b7b7b;}
.top-navbar .nav > li:hover a, .top-navbar .nav > li a:hover {background: none;}
.top-navbar.top-navbar-right .btn-navbar {float: right;}
.top-navbar.top-navbar-right .collapse, .top-navbar.top-navbar-right .collapsing {left: auto;right: 0;}
.top-navbar .nav > li a .count {background: rgba(0,0,0,.1);}
.header-three {overflow: hidden;}
.header .right-box {padding-left: 0;}
.phone-active, .search-active {left: 10px;padding: 0;right: 10px;}
.phone-active {font-size: 22px;line-height: 58px;}
.phone-active .title {display: none;}
.search-active .search-string, .search-active .search-string:hover {padding-left: 8px;}
.header .cart-header .dropdown-toggle, .header .primary .navbar .btn-navbar {padding-left: 10px;padding-right: 10px;}
.header .cart-header .dropdown-menu {width: 325px;}
.header.header-three .logo-box {width: 100%;}
.breadcrumb {padding-left: 10px;padding-right: 10px;}
#main {padding: 40px 0;}
#main.no-padding {padding-top: 0;padding-bottom: 0;}
.content.pull-right {float: none !important;}
.sidebar {margin-top: 40px;}
.sidebar .widget {margin: 0 0 40px;}
.sidebar .carousel > .col-md-3 {float: left;margin-left: 10px;margin-right: 10px;}
#catalog .category-img {margin-bottom: 40px;}
#catalog .category-img .description {font-size: 18px;padding: 20px;}
.toolbar .filterbar .layout-slider {width: 240px;}
.pagination-box {margin-top: 0;text-align: center;}
.pagination-box .pagination {margin: 0 -5px 0 0;}
.pagination-box .pagination-text {display: block;float: none;}
.products {text-align: center;}
.list .product .col-md-3, .list .product .col-md-4 {margin-bottom: 20px;}
.list .product .product-image {margin-left: auto;margin-right: auto;max-width: 300px;}
.caroufredsel_wrapper {margin-left: auto !important;margin-right: auto !important;}
.recommended-product .products > .col-md-3 .product {display: block;margin-left: 0;margin-right: 0;}
.products-tab .tab-content > .tab-pane {height: 263px;text-align: center;}
.text-center-mobile {text-align: center;}
.accordion-tab {border: 0 none;float: none;width: 100%;}
.accordion-tab > li {float: none;margin: 0 0 3px;}
.accordion-tab > li > a, .products-tab .accordion-tab > li > a {background-position: 14px 50%;background-repeat: no-repeat;background-color: #f2f2f2;border: 0 none;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;color: #1e1e1e;display: block;font-size: 14px;line-height: 22px;margin: 0;padding: 9px 9px 9px 60px;position: relative;text-decoration: none;-webkit-transition: all .2s linear;transition: all .2s linear;}
.accordion-tab > li > a:hover, .products-tab .accordion-tab > li > a:hover {background-color: #e9e9e9;-webkit-transition: all .2s linear;transition: all .2s linear;}
.accordion-tab > li.active > a, .accordion-tab > li.active > a:hover, .accordion-tab > li.active > a:focus, .accordion-tab > li.active:hover > a, .products-tab .accordion-tab > li.active > a, .products-tab .accordion-tab > li.active:hover > a {background-color: #1e1e1e;border: 0 none;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;color: #fff !important;}
.accordion-tab > li > a:before, .products-tab .accordion-tab > li > a:before {background: #e1e1e1;background: rgba(255,255,255,.4);bottom: 0;content: "";display: block;left: 45px;position: absolute;top: 0;width: 1px;}
.accordion-tab > li.active > a:before, .products-tab .accordion-tab > li.active > a:before {background: #444;background: rgba(255,255,255,.2);}
.accordion-tab > li > a .open-sub, .products-tab .accordion-tab > li > a .open-sub {bottom: 0;display: block;left: 0;position: absolute;top: 0;width: 45px;}
.accordion-tab > li > a .open-sub:before, .accordion-tab > li > a .open-sub:after, .products-tab .accordion-tab > li > a .open-sub:before, .products-tab .accordion-tab > li > a .open-sub:after {background: #1e1e1e;content: "";display: block;height: 2px;left: 0;margin: 19px 0 0 15px;position: absolute;top: 0;width: 16px;}
.accordion-tab > li > a .open-sub:after, .products-tab .accordion-tab > li > a .open-sub:after {height: 16px;margin: 12px 0 0 22px;width: 2px;}
.accordion-tab > .active > a .open-sub:before, .accordion-tab > .active > a .open-sub:after, .products-tab .accordion-tab > .active > a .open-sub:before, .products-tab .accordion-tab > .active > a .open-sub:after {background: #fff;}
.accordion-tab > .active > a .open-sub:after, .products-tab .accordion-tab > .active > a .open-sub:after {display: none;}
.accordion-tab .tab-pane {border: 0 none;display: none;font-size: 13px;padding: 20px 0 30px;}
.page-header {margin-bottom: 40px;}
.image-box {margin: 0 auto 40px;max-width: 470px;}
.product, .cat {width: 300px;}
.product-page .image-box .thumblist-box {max-height: 80px;padding: 0 45px;}
.product-page .image-box #thumblist a {height: 100px;width: 100px;}
.product-page .col-md-7 .price-box {font-size: 40px;}
.product-page .add-cart-form {margin-bottom: 0;}
.product-page .add-cart-form .add-cart,
.product-page .add-cart-form .number {margin-bottom: 40px;}
.product-page .product-tab {margin: 40px 0;}
.product-page .product-tab .tab-pane {padding: 20px 0;}
.product-page .add-cart-form .add-cart {width: 200px;}
.product .col-sm-8.col-md-8 {text-align: center;}
.map-box .contact-info {margin-bottom: 20px;padding: 0;position: relative;top: 0;}
.box-404 {-webkit-border-radius: 150px;-moz-border-radius: 150px;border-radius: 150px;height: 300px;margin: 0 auto 40px;padding: 75px 0 0;width: 300px;}
.box-404 h1 {font-size: 120px;}
.team-box {text-align: center;}
.list-images {margin-left: -10px;margin-right: -10px;margin-bottom: 20px;text-align: center;}
.list-images > .col-md-4 {display: inline-block;margin: 0 0 20px;text-align: left;width: 170px;}
.layout-slider {width: 240px;}
.respond-carousel .carousel [class*="span"] {margin-left: 2px;margin-right: 2px;}
#footer {margin-top: 0;}
#footer .sidebar {margin-top: 0;}
#footer .footer-top {padding-bottom: 0;}
#footer .footer-top .col-md-3 {margin-bottom: 36px;overflow: hidden;}
#footer .footer-bottom .col-md-3 {margin-bottom: 36px;overflow: hidden;}
#footer .footer-bottom .copyright {padding: 17px 0;text-align: center;}
#footer .phone,
#footer .address {float: left;margin-bottom: 29px;width: 48%;}
#footer .phone .title {display: block;}
#footer .address {float: right;}
#footer .up {float: none;margin: 0 auto;}
#back-top .up {bottom:10px;right:10px;}
.content-discount {text-align: center;}
.content-discount .img-discount {width:100%}
.content-discount .desc-discount {width:100%}
#quickform-order,#quickform-close {margin:0.1em 0;display:inline-block;text-align:center;}
}
/******************************************************************************
Max Width "681px"
*******************************************************************************/
@media screen and (max-width: 681px) and (min-width:600px) {
.header .primary .navbar .navbar-collapse {margin:45px 0 0 ;}
}
/******************************************************************************
Max Width "640px"
*******************************************************************************/
@media screen and (max-width: 640px) {
.nav-tabs > li {width:100%;border: 1px solid #ddd;background: #f2f2f2;}
.nav-tabs > li > a.active {border:0;}
.nav-tabs > li > a {border:0;}
.tab-content {border-bottom: 1px solid #e1e1e1;border-right: 1px solid #e1e1e1;border-left: 1px solid #e1e1e1;}
.goodsDataOpinionAverageInfo a {float: left;margin: 5px 0 5px 20px;}
.goodsDataOpinionAverageInfo span {float: left;margin: 5px 0 5px 20px;}
}
/******************************************************************************
Max Width "600px"
*******************************************************************************/
@media all and (max-width: 600px) {
.header .cart-header .dropdown-toggle .count {display: none;}
.header .cart-header .dropdown-toggle, .header .primary .navbar .btn-navbar {padding-left: 5px;padding-right: 5px;}
.header.header-two .primary .navbar .btn-navbar.collapsed:before {display: none;}
.hidden-600 {display: none !important;}
}
/******************************************************************************
Max Width "580px"
*******************************************************************************/
@media only screen and (min-width:220px) and (max-width:580px){
.table-box{overflow-x:scroll;}
.cart-info{min-width:320px;overflow-x:scroll;}
.scroll{min-width:320px;overflow-x:scroll;}
.cart-info .buttons a:last-child {float:left;}
}
/******************************************************************************
Max Width "480px"
*******************************************************************************/
@media all and (max-width: 480px) {
.slider .slid-content .title {max-height: 42px;overflow: hidden;}
#quickform-order,#quickform-close {float:none;}
.reviews-box .rating-box {margin:0 auto;float:none;}
.product-page .goods-pagination {text-align: center;float:none;margin-top: 10px;}
.product-page .reviews-box {height: auto;}
}
/******************************************************************************
Max Width "388px"
*******************************************************************************/
@media all and (max-width: 388px) {
.header .primary .navbar .btn-navbar:before {border:0;}
.header .primary .navbar .navbar-collapse {margin:45px 0 0 0;}
.goodsDataOpinionAverageInfo a {clear:both;}
.goodsDataOpinionAverageInfo span {clear:both;}
.col-xs-6.right-box {width:50%}
.col-xs-6.logo-box {width:50%;}
#goodsDataOpinionAdd .form-control, #goodsDataOpinionAdd .textarea {max-width:150px;}
.goodsDataOpinionCaptcha #opinion_captcha_string {width:50px;}
.goodsDataOpinionCaptcha .captcha {width:0;}
.input-text, .form-control, .textarea {width:200px;}
.callbackForm.form-box .input-text, .callbackForm.form-box .form-control, .callbackForm.form-box .textarea {width:150px;}
.buttons a:first-child {margin-right:20px;}
.buttons button:first-child {margin-right:20px;}
.buttons a:last-child {float:left;}
.buttons button:last-child {float:left;}
.buttons span:last-child {float:left;}
.product-page .goods-pagination {font-size:85%;}
}

Спасибо!

#4 tolikkansk

tolikkansk

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 357 сообщений

Отправлено 05 Февраль 2015 - 08:12

Как можно изменить здесь цвет фона каталога и цвета выпадающего списка?


Изображение

#5 Ирина345

Ирина345

    Активный участник

  • Модераторы
  • 5 709 сообщений

Отправлено 05 Февраль 2015 - 12:27

Просмотр сообщенияtolikkansk (05 Февраль 2015 - 08:12) писал:

Как можно изменить здесь цвет фона каталога и цвета выпадающего списка?



Здравствуйте, найдите в main.css
.header .primary .navbar .nav {background: #fff;border: 1px solid #ccc;-webkit-border-radius: 3px 0 3px 3px;-moz-border-radius: 3px 0 3px 3px;border-radius: 3px 0 3px 3px;float: none;padding: 6px 6px 3px;}
где изменяете значения background: #fff;

для более подробной инструкции уточните номер вашего аккаунта

#6 tolikkansk

tolikkansk

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 357 сообщений

Отправлено 05 Февраль 2015 - 20:31

Просмотр сообщенияИрина345 (05 Февраль 2015 - 12:27) писал:

Здравствуйте, найдите в main.css
.header .primary .navbar .nav {background: #fff;border: 1px solid #ccc;-webkit-border-radius: 3px 0 3px 3px;-moz-border-radius: 3px 0 3px 3px;border-radius: 3px 0 3px 3px;float: none;padding: 6px 6px 3px;}
где изменяете значения background: #fff;

для более подробной инструкции уточните номер вашего аккаунта

номер Аккаунт SL-319026

#7 tolikkansk

tolikkansk

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 357 сообщений

Отправлено 05 Февраль 2015 - 21:37

Ещё такой вопрос: можно ли сделать в Нефрите нижнее меню как в движении, т.е. чтобы раскрывалось при нажатии ? номер Аккаунт SL-319026

Изображение

#8 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 06 Февраль 2015 - 01:50

Просмотр сообщенияtolikkansk (05 Февраль 2015 - 08:12) писал:

Как можно изменить здесь цвет фона каталога и цвета выпадающего списка?
В main.css за фон данного списка отвечают следующие блоки:
.header .primary .navbar .nav > .parent > a, .header .primary .navbar .nav > li.parent:hover > a {
  background: #f2f2f2;
  position: relative;
}
.header .primary .navbar .nav > li > a, .header .primary .navbar .nav > li > a:visited {
  background: #f2f2f2;
  border: 1px solid #f2f2f2;
  border-radius: 0;
  font-weight: normal;
  margin: 0;
  padding: 7px 9px 7px 59px;
  text-decoration: none;
}

Просмотр сообщенияtolikkansk (05 Февраль 2015 - 21:37) писал:

Ещё такой вопрос: можно ли сделать в Нефрите нижнее меню как в движении, т.е. чтобы раскрывалось при нажатии ? номер Аккаунт SL-319026

Пример реализации для блока контактов, в шаблоне HTML находим:
<!-- Контакты и Социальные кнопки -->
			<div class="col-xs-12 col-sm-6 col-md-3 widget social">
			  <div class="footer-header">
				<h3 class="title">Контакты</h3>
			  </div>
			  <ul class="footer-contact">
				{% IF SETTINGS_STORE_WORK_TIME %}<li><span class="icon-time"></span><span title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">{SETTINGS_STORE_WORK_TIME}</span></li>{% ENDIF %}
				{% IF SETTINGS_STORE_PHONE_NUMBER1 %}<li><span class="icon-phone3"></span><span>{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %}{SETTINGS_STORE_PHONE_NUMBER1}</span></li>{% ENDIF %}
				{% IF SETTINGS_STORE_PHONE_NUMBER2 %}<li><span class="icon-phone3"></span><span>{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %}{SETTINGS_STORE_PHONE_NUMBER2}</span></li>{% ENDIF %}
				{% IF SETTINGS_STORE_PHONE_NUMBER3 %}<li><span class="icon-phone3"></span><span>{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %}{SETTINGS_STORE_PHONE_NUMBER3}</span></li>{% ENDIF %}
				{% IF SETTINGS_STORE_EMAIL_MAIN %}<li><span class="icon-envelope-o"></span><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></li>{% ENDIF %}
				{% IF SETTINGS_STORE_SKYPE %}<li><span class="icon-skype"></span><span><a href="skype:{SETTINGS_STORE_SKYPE}?call" title="Свяжитесь с нами по Skype">{SETTINGS_STORE_SKYPE}</a></span></li>{% ENDIF %}
				{% IF SETTINGS_STORE_ICQ %}<li><span class="footer_icq"><img src="http://wwp.icq.com/scripts/online.dll?icq={SETTINGS_STORE_ICQ_ONLY_DIGITS}&amp;img=27" alt="Статус" title="Статус ICQ" /> {SETTINGS_STORE_ICQ}</span></li>{% ENDIF %}		   
			  </ul>
			  <p>Мы в Соц. Сетях</p>
				<a class="sbtnf sbtnf-rounded color color-hover icon-twitter" href="#"></a>
				<a class="sbtnf sbtnf-circle color color-hover icon-facebook" href="#"></a>
				<a class="sbtnf sbtnf-circle color color-hover icon-vk" href="#"></a>
				<a class="sbtnf sbtnf-rounded color color-hover icon-youtube" href="#"></a>
			</div>
			<!-- END Контакты и Социальные кнопки -->
меняем на:
<!-- Контакты и Социальные кнопки -->
			<div class="col-xs-12 col-sm-6 col-md-3 widget social spoiler">
			  <div class="footer-header">
				<h3 class="title spoiler_link">Контакты</h3>
			  </div>
			  <ul class="footer-contact spoiler_content">
				{% IF SETTINGS_STORE_WORK_TIME %}<li><span class="icon-time"></span><span title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">{SETTINGS_STORE_WORK_TIME}</span></li>{% ENDIF %}
				{% IF SETTINGS_STORE_PHONE_NUMBER1 %}<li><span class="icon-phone3"></span><span>{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %}{SETTINGS_STORE_PHONE_NUMBER1}</span></li>{% ENDIF %}
				{% IF SETTINGS_STORE_PHONE_NUMBER2 %}<li><span class="icon-phone3"></span><span>{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %}{SETTINGS_STORE_PHONE_NUMBER2}</span></li>{% ENDIF %}
				{% IF SETTINGS_STORE_PHONE_NUMBER3 %}<li><span class="icon-phone3"></span><span>{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %}{SETTINGS_STORE_PHONE_NUMBER3}</span></li>{% ENDIF %}
				{% IF SETTINGS_STORE_EMAIL_MAIN %}<li><span class="icon-envelope-o"></span><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></li>{% ENDIF %}
				{% IF SETTINGS_STORE_SKYPE %}<li><span class="icon-skype"></span><span><a href="skype:{SETTINGS_STORE_SKYPE}?call" title="Свяжитесь с нами по Skype">{SETTINGS_STORE_SKYPE}</a></span></li>{% ENDIF %}
				{% IF SETTINGS_STORE_ICQ %}<li><span class="footer_icq"><img src="http://wwp.icq.com/scripts/online.dll?icq={SETTINGS_STORE_ICQ_ONLY_DIGITS}&amp;img=27" alt="Статус" title="Статус ICQ" /> {SETTINGS_STORE_ICQ}</span></li>{% ENDIF %}		   
			  </ul>
			  <p>Мы в Соц. Сетях</p>
				<a class="sbtnf sbtnf-rounded color color-hover icon-twitter" href="#"></a>
				<a class="sbtnf sbtnf-circle color color-hover icon-facebook" href="#"></a>
				<a class="sbtnf sbtnf-circle color color-hover icon-vk" href="#"></a>
				<a class="sbtnf sbtnf-rounded color color-hover icon-youtube" href="#"></a>
			</div>
			<!-- END Контакты и Социальные кнопки -->

В конец main.js добавьте:
$(function() {
  $(document).on('click', '.spoiler .spoiler_link', function() {
	if ($(window).width() <= 890) {
	  $('.spoiler .spoiler_content').slideUp();
	  if (!$(this).parent().find('.spoiler_content').is(':visible')) {
		$(this).parent().find('.spoiler_content').slideToggle();
	  }
	}
	return (false);
  });
});

В конец main.css добавьте:
@media all and (max-width: 890px) {
.spoiler_content{display:none;}
}


#9 tolikkansk

tolikkansk

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 357 сообщений

Отправлено 06 Февраль 2015 - 06:33

Поставил изменения, все равно не работает:
https://pp.vk.me/c62...bBqkeFi9F1o.jpg

#10 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 06 Февраль 2015 - 07:25

<div class="footer-header">
								<h3 class="title spoiler_link">Контакты</h3>
						  </div>
замените на:
<div class="footer-header spoiler_link">
								<h3 class="title">Контакты</h3>
						  </div>


#11 tolikkansk

tolikkansk

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 357 сообщений

Отправлено 06 Февраль 2015 - 07:49

Просмотр сообщенияVaccina (06 Февраль 2015 - 07:25) писал:

<div class="footer-header">
							 <h3 class="title spoiler_link">Контакты</h3>
						 </div>
замените на:
<div class="footer-header spoiler_link">
							 <h3 class="title">Контакты</h3>
						 </div>

Спасибо! Смотрите, я аналогично поставил для обратной связи и меню, но там не работает, почему?


<div class="col-xs-12 col-sm-6 col-md-3 widget social">
					   <div class="footer-header spoiler_link">
					   <h3 class="title">Обратная связь</h3>
							   
						  </div>



<div class="col-xs-12 col-sm-6 col-md-3 widget links">
			   <div class="footer-header spoiler_link">
			 
				<h3 class="title">Меню</h3>
			  </div>
			  <div class="nav">
				<ul>
				{% FOR menu %}
				  {% FOR footer %}
					{% FOR links %}<li><a href="{menu.footer.links.URL}" {% IF menu.footer.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.footer.links.TITLE %}title="{menu.footer.links.TITLE}"{% ENDIF %}>{menu.footer.links.NAME}</a></li>{% ENDFOR %}
				  {% ENDFOR %}
				{% ENDFOR %}
				</ul>
			  </div>
			</div>


#12 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 06 Февраль 2015 - 07:53

Просмотрите пожалуйста еще раз, разница в 2 блоках кода только в 3 строках.
Было:
<div class="col-xs-12 col-sm-6 col-md-3 widget social">
стало:
<div class="col-xs-12 col-sm-6 col-md-3 widget social spoiler">

Далее было:
<div class="footer-header">
стало:
<div class="footer-header spoiler_link">

и последнее, было:
<ul class="footer-contact">
стало:
<ul class="footer-contact spoiler_content">


#13 tolikkansk

tolikkansk

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 357 сообщений

Отправлено 06 Февраль 2015 - 08:42

Просмотр сообщенияVaccina (06 Февраль 2015 - 07:53) писал:

Просмотрите пожалуйста еще раз, разница в 2 блоках кода только в 3 строках.
Было:
<div class="col-xs-12 col-sm-6 col-md-3 widget social">
стало:
<div class="col-xs-12 col-sm-6 col-md-3 widget social spoiler">

Далее было:
<div class="footer-header">
стало:
<div class="footer-header spoiler_link">

и последнее, было:
<ul class="footer-contact">
стало:
<ul class="footer-contact spoiler_content">

Спасибо! Извините, не заметил сразу! Вот такой вопрос: Как можно на первой картинке поднять Корзину, а на второй опустить каталог?Изображение

Изображение

#14 Ирина345

Ирина345

    Активный участник

  • Модераторы
  • 5 709 сообщений

Отправлено 06 Февраль 2015 - 10:33

Просмотр сообщенияtolikkansk (06 Февраль 2015 - 08:42) писал:

Спасибо! Извините, не заметил сразу! Вот такой вопрос: Как можно на первой картинке поднять Корзину, а на второй опустить каталог?


Здравствуйте, найдите в main.css
.header .cart-header .dropdown-toggle, .header .primary .navbar .btn-navbar {padding-left: 5px;padding-right: 5px;}

замените на
.header .cart-header .dropdown-toggle, .header .primary .navbar .btn-navbar {padding-left: 5px;padding-right: 5px;}
.header .cart-header .dropdown-toggle{margin-bottom: 15px;}
.header .primary .navbar .btn-navbar {margin-top: 19px;}




#15 tolikkansk

tolikkansk

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 357 сообщений

Отправлено 07 Февраль 2015 - 21:44

Несколько вопросов:
1) как перенести картинку в указанное место (самое маленькое разрешение, когда начинается такой вид)
2) как сделать это безобразие более менее красиво? (в районе от 991рх до 1200рх)

Прикрепленные изображения

  • 8022015-1.png
  • 8022015-2.png


#16 tolikkansk

tolikkansk

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 357 сообщений

Отправлено 09 Февраль 2015 - 17:27

Модераторы, и?

#17 Alekseys

Alekseys

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 2 355 сообщений

Отправлено 09 Февраль 2015 - 17:57

Просмотр сообщенияtolikkansk (09 Февраль 2015 - 17:27) писал:

Модераторы, и?
Здравствуйте.
1. Перенесите
<img src="http://e54023.storeland.net/top-box.png" alt="">
поставив после
<div class="navbar navbar-inverse top-navbar top-navbar-left">
2. Укажите схематично на скриншоте, как оно должно выглядеть.

#18 tolikkansk

tolikkansk

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 357 сообщений

Отправлено 10 Февраль 2015 - 21:28

Просмотр сообщенияAlekseys (09 Февраль 2015 - 17:57) писал:

Здравствуйте.
1. Перенесите
<img src="http://e54023.storeland.net/top-box.png" alt="">
поставив после
<div class="navbar navbar-inverse top-navbar top-navbar-left">
2. Укажите схематично на скриншоте, как оно должно выглядеть.

По поводу второго вопроса: чтобы все названия категорий были в один ряд

#19 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 11 Февраль 2015 - 00:28

В main.css после:
/******************************************************************************
  Max Width "1200px"
*******************************************************************************/
@media screen and (max-width: 1200px) {

вставьте:
.header .primary .navbar .nav {
  width: 100%;
}


#20 tutkypi

tutkypi

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 118 сообщений
  • ГородКостанай

Отправлено 18 Февраль 2015 - 23:30

Здравствуйте,как исправить это?Шапка вроде адаптируется,но вот фоновое(где надпись обведена зеленым) эти три картинки не меняются.
Аккаунт SL-325231
http://medkaz.ru

Прикрепленные изображения

  • 54.png





Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных