Venture theme content to expand to edge of screen

Store Design
1

Hi guys,

I have been doing some coding and there is still space around everything (I want everything to be expanded to the edge of the screen). I also want the images to be touching and the buttons to be hovering over the images, so I selected the secondary image layout to make this possible, but the images are now small again. Is there a way to expand everything to the edge of the screen and also make the whole image show? If possible I want to also move the button to the bottom of each collection image. See picture below for reference:

The URL is thecurrentau.com and the password is ‘pass’

Thanks!

Screen Shot 2021-07-22 at 4.53.46 pm.png
Screen Shot 2021-07-22 at 4.53.46 pm.png999×504 448 KB

1 Like
2

@Thecurrentau

Please add this code at the bottom of theme → edit code → assets → theme.scss.liquid file.

@media only screen and (min-width: 1350px){
.template-index .page-width {
    max-width: 100% !important;
    padding: 0 5px !important;
}
.template-index .main-content {
    padding-bottom: 0 !important;
}
.featured-card--cover .featured-card__header {
    position: relative;
    display: block !important;
    padding-top: 315px !important;
}
}

Thanks!

3

hello @Thecurrentau

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media only screen and (min-width: 1350px){
.template-index  #shopify-section-1616154233020efe37 .page-width {
    max-width: 100%;
    padding: 0 5px;
}

.template-index   #shopify-section-1616154233020efe37 .featured-card__header {
  position:absolute;
  left:15%;
  bottom:0;
  display:block;
}
.template-index .main-content{
	    margin-top: 0px  !important;
}
}
4

this worked but the images are still squashed/cropped to a small size. I unticked the secondary image layout to allow the photos to be full size, and the padding is a bit off where the button is. The text is also not centred.

Screen Shot 2021-07-24 at 1.12.56 pm.png
Screen Shot 2021-07-24 at 1.12.56 pm.png2880×1438 526 KB

I want the buttons to look like this:

https://thatssofetch.com.au

Screen Shot 2021-07-24 at 1.01.23 pm.png
Screen Shot 2021-07-24 at 1.01.23 pm.png2880×882 494 KB

I also want the padding to look like this, with 5px in between each image and the image to edge of screen.

Is there a way we could do a call so I can show you what i am wanting to change?

Thanks so much for your help

5

also I forgot to mention that I want the button to look like this on both the phone and monitor view