Home Forums WoodMart support forum Some minor fixes Reply To: Some minor fixes

#22305

Artem Temos
Keymaster

Hi,

Here is a code snippet to place to the Global Custom CSS field


/* height of top bar */
div.topbar-wrapp,
div.topbar-content {
    height:25px;
}
div.topbar-menu .item-level-0>a, 
div.topbar-menu .menu>.menu-item-language>a {
    height:25px;
    line-height:25px;
}
/* border on image */
.product-grid-item .product-image-link {
    padding: 1px;
}
/* star rating */
.star-rating {
    text-align:left;
}
.star-rating span::before {
    white-space:nowrap;
}
/* labels */
.woodmart-hover-icons div.labels-rectangular {
    left:auto;
    right:0;
}

This one for mobile and tablet devices only

/* buttons */
.woodmart-hover-icons div.woodmart-buttons {
    right: 6px;
}
.woodmart-hover-icons.sale div.woodmart-buttons {
    top: 45px;
}
.woodmart-hover-icons .woodmart-buttons div {
    margin-bottom:5px!important;
}
.woodmart-hover-icons.col-xs-6 .price {
    font-size:10px;
}

Find this snippet in your desktop custom CSS and move to global area to apply it for all devices

.woodmart-hover-icons {
    display:flex;
    flex-wrap:wrap;
    flex-direction: row-reverse;
    justify-content: center;
}
.woodmart-hover-icons > div,
.woodmart-hover-icons > h3,
.woodmart-hover-icons > span {
    flex:1 1 100%;
    max-width:100%;
}
.woodmart-hover-icons .star-rating {
    flex: 0 0 auto;
    max-width: auto;
}
.woodmart-hover-icons .price {
    flex: 1 0 auto;
    max-width: auto;
    text-align:left;
}

And this one you should remove from mobile CSS

.woodmart-hover-icons .price {
    flex:1 1 100%;
    max-width:100%;
    text-align:center;
}

5. Sorry, but we can’t move wishlist icon outside the image because of our theme structure.

6. You can change it globally for all sliders only with this code snippet added to the functions.php file in the child theme

	function woodmart_get_owl_items_numbers( $slides_per_view ) {
		$items = array();
		$items['desktop'] = ( $slides_per_view > 0 ) ? $slides_per_view : 1;
		$items['desktop_small'] = ( $items['desktop'] > 1 ) ? $items['desktop'] - 1 : 1;
		$items['tablet'] = ( $items['desktop_small'] > 1 ) ? $items['desktop_small'] : 1;
		$items['mobile'] = 2;

		return $items;
	}

Regards