How can I modify the layout and image shape in the DAWN theme?

Store Design
1

Hi i was wondering if someone could help i am using DAWN Theme, and I want to change the layout of the collection list on my homepage to 4 per a row on desktop and 2 per a row on mobile.

also i would like to change the picture shape of the collections square to round

website

https://sweets-retreat.myshopify.com/

1 Like
2

hi @sweetbuddie

please add this code in base.css.

.grid–1-col .grid__item {
width: calc(100% / 4)!important;
max-width: 25% !important;
}

and 720px down add to mobile .

.grid–1-col .grid__item {
width: calc(100% / 2)!important;
max-width: 50% !important;
}

.thank you so much..

1 Like
3

Hi cheers dude it worked great :slightly_smiling_face: your a star

4

do you know the code to change the shape of the image to round please.

1 Like
5

hey @sweetbuddie

which one image ? please send me screen short..

then i will solve your problem.

thank you.

6

also desktop mode collection list has 2 per a row not 4

2 rows.JPG
2 rows.JPG248Ă—435 22.1 KB

collectionss.JPG
collectionss.JPG349Ă—512 39.3 KB

111.JPG
111.JPG322Ă—149 12.2 KB

7

round.png
round.png1366Ă—768 265 KB

u can seen this…

i think square image is very better for you.

thank you so much…

1 Like
8

I think I am changing the pics how do I implement the code for it mate.

also i now have 2 rows on mobile

but desktop didn’t work that is set to 2 as well even though in the code it says 4

1 Like