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

[rashonxx]

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/

[Abdosamer]

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

.card__information {
   
    display: none !important;
}

[rashonxx]

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

[Abdosamer]

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

[rashonxx]

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]

@rashonxx , add this code instead:

.card__information {
    display: none;
}