(Minimal Theme) Move "Shop Now" button down on image with text overlay

Store Design
1

As my banner I’m using an image with text overlay instead of the slideshow.

I’m added the “Shop Now” button but it’s right in the middle and I’d like to move it down. I’d like it to move down on mobile as well.

Site: www.sneaxco.com

PW - ahewrt

Thank you for your help!

2 Likes
2

@SmallwoodDR82

Please add the following code at the bottom of your CSS file.

@media screen and (min-width: 480px){
.image-with-text-overlay-wrapper .homepage-featured-content-box{
transform: translateY(30%) !important;
}
}

@media only screen and (max-width: 768px){
.image-with-text-overlay-wrapper .homepage-featured-content-box{
transform: translateY(20%) !important;
}
}

Hope this works.

Thanks!

3

which CSS file?

1 Like
4

@SmallwoodDR82

Try with assets/theme-index.min.css file.

5

@SmallwoodDR82

sorry for that issue please try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme-index.min.css ->paste below code at the bottom of the file.
    this code apply for after 5 - 6 second
.image-with-text-overlay-wrapper .homepage-featured-content-box {
align-items: flex-end;
}
@media only screen and (max-width: 767px) {
.homepage-featured-content-box-inner, .homepage-map-content-box-inner {padding: 10px;}
.homepage-content--1627161879a2b0dcd1 .homepage-section-btn {
padding: 5px 15px;
    font-size: 13px;
    margin-bottom: -10px;
}
}
1 Like
6

worked perfect thank you!