How do I find out wehre a class is defined?

[Frede]

Hello! In my footer.liquid the class "copyright__content" is used. I would like to change the style of this class (e.g. change font color or size). However, in the footer.liquid this class is not defined. Thus, it must be defined in another code sheet. Where do I find the definition of this specific class and how do I generally find the definition of the classes (or are they all defined in one single code sheet that I have not find yet)?

Thanks!

[suyash1]

@Frede  - if you are looking for a css then please check,

Shopify Admin -> Online Store ->Theme -> Edit code -> base.css/theme.css/styles.css

[Frede]

Thanks for the superfast reply! However, in the file base.css the class copyright__content is not defined (a search for "copyright__content" resulted in 0 hits) and the other two css-files (theme.css and styles.css) are not existing. But the copyright__content must be defined somewhere! How can I find the definition of this class?

Btw, I'm unsing Dawn Theme...

Thanks!

[suyash1]

@Frede did you check footer.liquid file?

[Frede]

Yes, in the footer.liquid file the class copyright__content is used but it do not contain the definition of this class.

[suyash1]

@Frede - it is just a css class, what do you mean by definition?

[Frede]

This is for example the definition of the CSS class "text-body" and comes from the base.css-file:

.text-body {
font-size: 1.5rem;
letter-spacing: 0.06rem;
line-height: calc(1 + 0.8 / var(--font-body-scale));
font-family: var(--font-body-family);
font-style: var(--font-body-style);
font-weight: var(--font-body-weight);
}

I'm looking for the place where the class copyright__content is defined.

[suyash1]

@Frede can you accept me as collab? I can check it into your theme

[Frede]

Sure, my guest code is 9040

[suyash1]

@Frede website link?

[Frede]

my-eloo.de

[suyash1]

@Frede sent the request

[Frede]

Thank you! I have confirmed your request.

[suyash1]

@Frede please check your DM

[Frede]

Thank you sooo much!!!

It's defined in the section-footer.css

[suyash1]

@Frede - do let me know if you have any more updates

[tim]

In modern theme there is usually no single stylesheet, CSS rules are stored in several smaller .css files to be  loaded as needed.

You can easily see where rules related to particular element are by using "Inspect element" in your browser, like in the screenshot above.