User Tools

Site Tools


arundo:modif

Easy site modifications

All the css modifications add here: Modules> Theme Settings, configure> Custom Styles

Show product price and other information without hovering

By default Arundo uses such view for the products  Arundo porducts view But you can change it to Arundo modificated products view

Category page

#center_column .view_grid #product_list li .product_container .right_block, .view_grid #product_list li:hover .product_container .right_block { 
    display: block;
    width: auto;
    float: none;
    text-align: center;
    padding: 5px 10px 0 10px;
}
#center_column .view_grid.view_small #product_list li { height: 311px}
#center_column .view_grid #product_list li .product_container .center_block h3 { padding:0 !important; width: 166px;}
.view_grid.view_small #product_list li, .view_grid.view_small #product_list li:hover { 
	width: 170px;
	margin: 0 17px 15px 0;
}
.view_grid.view_small #product_list li:hover span.new {
top: 19px;
right: 14px;
}

2 versions

1)
When hover the product:

#productsCarousel ul li .price { display: block;}
#productsCarousel ul li a.f_title {height: 20px}
#productsCarousel a.f_title { margin: 4px 0 18px 0;}
#productsCarousel ul li:hover { padding: 4px 8px 0;}

2)

When hover the product:

#productsCarousel .container_border { height: 370px !important}
#productsCarousel ul li .price, #productsCarousel ul li .featured_add_to_cart, #productsCarousel ul li .function_buttons {display: block}
#productsCarousel ul li { height: 275px !important }
#productsCarousel .function_buttons, #productsCarousel ul li:hover .function_buttons { padding: 0 0 0 10px !important;}
#productsCarousel ul li a.f_title {height: 20px}
arundo/modif.txt · Last modified: 2013/09/06 02:53 (external edit)