DARKF3D3 Posted July 8, 2018 Share Posted July 8, 2018 I'm trying to remove quick view on PS1.7.4 default template. To do this i commented these code from file templates/catalog/_partials/miniatures/product.tpl: <div class="highlighted-informations{if !$product.main_variants} no-variants{/if} hidden-sm-down"> {block name='quick_view'} <a class="quick-view" href="#" data-link-action="quickview"> <i class="material-icons search"></i> {l s='Quick view' d='Shop.Theme.Actions'} </a> {/block} {block name='product_variants'} {if $product.main_variants} {include file='catalog/_partials/variant-links.tpl' variants=$product.main_variants} {/if} {/block} </div> This partially worked, in fact the quick view block on product over it's no more showed. But the problem it's that the something that on hover add a ::after on <div class="product-description"> and this cause a small 1px line it's showed. Do you know how this can be fixed? Link to comment Share on other sites More sharing options...
Bas Posted November 12, 2018 Share Posted November 12, 2018 It's a css defintion that is causing the 1px line to be shown. The following style solves your problem. <style> #products .thumbnail-container:focus .product-description:after, #products .thumbnail-container:hover .product-description:after, .featured-products .thumbnail-container:focus .product-description:after, .featured-products .thumbnail-container:hover .product-description:after, .product-accessories .thumbnail-container:focus .product-description:after, .product-accessories .thumbnail-container:hover .product-description:after, .product-miniature .thumbnail-container:focus .product-description:after, .product-miniature .thumbnail-container:hover .product-description:after { /* Choose one of the following lines. Both work */ border-top: none; display: none; } </style> But removing it makes the product list a bit dull. But won't you reconsider removing the quick view action? I did. The appearing bar while hovering over the images gives some spice and gives a call to action. I changed the link in to quick_view-block to direct to the product page. BLOCK CHANGE {block name='quick_view'} <a class="showdetails" href="{$product.url}"> <i class="material-icons search"></i> {l s='Quick view' d='Shop.Theme.Actions'} </a> {/block} And the following styles to give make the appearance the same to the quick view look <style> #products .highlighted-informations .showdetails, .featured-products .highlighted-informations .showdetails, .product-accessories .highlighted-informations .showdetails, .product-miniature .highlighted-informations .showdetails { color: #7a7a7a; font-size: 1rem } #products .highlighted-informations .showdetails:hover, .featured-products .highlighted-informations .showdetails:hover, .product-accessories .highlighted-informations .showdetails:hover, .product-miniature .highlighted-informations .showdetails:hover { color: #2fb5d2 } </style> Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now