Attempting Hover Reveal For Text, but Product Titles Wont Dissapear In Middle

rashonxx
Tourist
7 0 1

Attemping to do a hover reveal for the products on my site, hover reveal itself works fine, but having an issue where all of the title names of the products wont dissapear still after putting the code for the hover reveal effect. Was wondering if there was any way possible I could fix!

 

Site:

https://luvrboyfactories.com/

 

Screenshot_1314.png

Replies 5 (5)

Abdosamer
Shopify Partner
820 146 161

Hi @rashonxx , go to component-card.css and add the following code :

.card__information {
   
    display: none !important;
}
Buy me a Coffee
Email : abdelrahamansamer71@gmail.com
Chat on WhatsApp
Profolio
rashonxx
Tourist
7 0 1

hi @Abdosamer, works by removing the text but now none of the text from the hover reveal effect also doesn't show now

Abdosamer
Shopify Partner
820 146 161

@rashonxx , did you remove any other code before adding the code I provided you?

Buy me a Coffee
Email : abdelrahamansamer71@gmail.com
Chat on WhatsApp
Profolio
rashonxx
Tourist
7 0 1

no i did not, this is the code i also used for the hover reveal if that helps also:

.product-card-wrapper .card--standard>.card__content .card__information {
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  width: 100%;
  height: 100%;
  display: flex;
  flex-flow: column;
  justify-content: center;
  transition: .3s all;
  opacity: 0;
  visibility: hidden;
}
.product-card-wrapper .card--standard .card__inner:after {
  transition: .3s all;
}
.product-card-wrapper:hover .card--standard .card__inner:after {
  z-index: 0;
  background-color: rgba(255,255,255,0.7);
}
.product-card-wrapper:hover .card--standard>.card__content .card__information {
  opacity: 1;
  visibility: visible;
}
Abdosamer
Shopify Partner
820 146 161

@rashonxx , add this code instead:

.card__information {
    display: none;
}
Buy me a Coffee
Email : abdelrahamansamer71@gmail.com
Chat on WhatsApp
Profolio