how do i make the collection list look the same on mobile as on desktop

[crossovertees]

How do i Make the collection list look the same on the mobile app as it dose on desktop. looks bad on mobile. I want the collection list to fit in the whole window and I want the text on the photo like it is on desktop.

[Emirates7 · Accepted solution]

Hi Crossovertess,

Go to Online Stores -> Themes -> Customizer -> Theme Settings -> Custom CSS and add below code:

  .collection-card--style-4 .collection-card__info {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 1.5rem;
    margin-top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
  }
  .collection-card--style-4 .collection-card__info--group {
    flex: 1;
  }
@media (max-width: 767px) {
    .collection-card--style-4 .collection-card__info * {
        color: #fff !important;
    }
}

Regards,

Emirates7

[Emirates7 · Accepted solution]

Hi Crossovertess,

Go to Online Stores -> Themes -> Customizer -> Theme Settings -> Custom CSS and add below code:

  .collection-card--style-4 .collection-card__info {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 1.5rem;
    margin-top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
  }
  .collection-card--style-4 .collection-card__info--group {
    flex: 1;
  }
@media (max-width: 767px) {
    .collection-card--style-4 .collection-card__info * {
        color: #fff !important;
    }
}

Regards,

Emirates7

[crossovertees]

Ok that fixed that part but what about the fact its having to be scrolled, and text is taking up most of the photo.

[crossovertees]

Figured out the text size now just need to figure out the scrolling. 

[crossovertees]

Figured it all out. Thanks.

[crossovertees]

How do I fix this?

[Emirates7 · Accepted solution]

Hi,

This is code for this bug:

.f-mobile-nav .site-logo {
height: 16rem !important;
}

Regards,

Emirates7

[crossovertees]

Thank you.