Basic font weight change


#1

Hey again, new to Ionic and I wanted to know how does one go about to style a text?
I mean I’ve made a simple page, say home.html, likewise:

<ion-content padding>
  <h1 class="title-custom" text-center>this is a title</h1>
</ion-content>

and then over at home.scss I’d do this (which as a web developer is a basic form of styling),
page-home {
.title-custom {
font-weight: 300;
padding-top: 2em;
}
}

But when I run the app on browser, it’s like that title is not even considering the “title-custom” class. How do I change anything when it comes to styling?


#2

Does the font have a lower/higher font-weight?

Try different font-weights not every font has font-weights with 100/200/300/400/500


#3

Yep, the style works if I use in-line styling, but not if I use it the way I mentioned in the question. Even the color won’t change.


#4

And do you have page-selector: ‘page-home’; in your home.ts?


#5

okay hey, that worked. I added selector: 'page-home' to the component at home.ts. Thanks!


#6

You are welcome. Please mark my answer as solution and like it.

Have a great day.