Turbo theme "image with text" -sections font (need for CSS)

Technical Q&A
1

Hi,

I have a Turbo theme in my store and would like to change the font. I have set up the fonts, but I want a few sections font to be bigger.

 

 Masters 

This includes some description

**Some text**

 Call to action

PROBLEM: I have “Image with text” -section AND I want it’s class “collection_title” to be:

font-weight: 700;
font-size: 41px;

All the other “image with text” sections in my store should be much smaller.

font-weight: 400;
font-size: 28px;

Could you give me CSS for my problem?

The store is under password.

2

Hi @Kjankko-US ,

When you use class “collection_title” it will include all but if you enclose it by a separate class it will work only.

Like the code you sent, you just need to enclose the class “block–1637393573ffd0a2dc-0”, it will be unique for “collection_title”. https://i.imgur.com/ew5CYsM.png

Code:

.block--1637393573ffd0a2dc-0 .collection_title{
    font-weight: 700;
    font-size: 41px;
}

Hope it helps!

1 Like
3

Super! @LitExtension thank you!

4

@LitExtension It works, How about the code if I want the text be smaller in phone (max-width 480px)?

Lets say the text would be for example 32px in mobile OR 70% of the original (desktop screen’s size)

5

Hi @Kjankko-US ,

Please add code:

@media only screen and (max-width:480px) {
    .block--1637393573ffd0a2dc-0 .collection_title{
		font-size: 31px;
	}
}

If it helped you solve your issue, please mark it as a solution. Thank you and good luck.