How can I change slide show text color and position without the theme.scss.liquid file?

Store Design
1

I want to change the colour of the text on the slide show on the theme Studio, however everything i’m reading says I need to change it in theme.scss.liquid file. I 100% do not have this file, I have tried downloading the theme several times and it still isn’t there. Can someone please help.

Also The positioning of the slideshow text is fine on desktop, however no matter where I move the text to (l,r,c) it covers up the slide show image on mobile, Can someone please also help with this.

Thank you in advance.

2

@pcw ,

Please share the store URL.

3

Hello,

Please share the store URL and if password protected please share that also.

4

https://prettycharmingweird.com/

p/w: PCW

5

There is no theme.scss file on your theme because there is another css file that is base.css. You can edit your css code on base.css file

1 Like
6

Hello,

Thanks for the store URL and password. Let me check.

7

First of all as i have checked if you want to edit the css file then you can change in the base.css file.

beacuse every theme structure have different css file.

Angel95_0-1660046769975.png
Angel95_0-1660046769975.png508×230 8.13 KB

for the second issue that you are having. Let me check.

8

I’ve gone onto base.css and tried entering

color: black;

under this section. is this correct, it doesn’t seem to be making any changes

@media screen and (max-width: 989px) {
.header__heading,
.header__heading-link {
text-align: center;
}

9

I’m not sure which bit i’m meant to be editing on bass.css to get black text

10

@pcw ,

h2.banner__heading.medium {
    color: #000;
}
.banner__text span {
    color: black;
}
h2.banner__heading.h2 {
    color: black;
}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->base.scss.liquid

11

i’ve entered that into the base.css file and it’s worked thank you.

Do you know how I can fix the text from going over the scroll image on the mobile view please?

12

@pcw
Hello,

@media only screen and (max-width: 786px){
.banner__heading.h2 {
  font-size: 24px !important;
  margin: 0 auto;
}
.banner__text {
	margin: 0 auto;
	font-size: 20px !important;
}
.banner__buttons {
	margin: 0 auto;
}
.banner__buttons a {
  font-size: 16px !important;
}
}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->base.scss.liquid
This Solution It’s Useful So Please Like And Accept Solution
Like This

oscprofessional_0-1660117096443.png
oscprofessional_0-1660117096443.png544×555 46.4 KB

13

I’ve just tried this, it puts the headline to the side and the description over the image