7 replies

Styling Components with SASS

Hello there,
I am working an a Portfolio Website for a friend.
I've decided to do it in React.js. And I am having some trouble with styling using SASS.

I've created a separate reusable component with props,

<Button />

<Button />

, that goes inside the

<Nav />

<Nav />

component.
I've created a

_button.scss

_button.scss

file for the button, there are four buttons inside the nav and I left the styles for each individual

<Button />

<Button />

component inside the

_nav.scss

_nav.scss

.
Which are selected by using the

class

class

.

Though, the styles don't show up for each unique button, just for the general button style.
And I believe this is because the class name is being populated by the use of props in the

<Button />

<Button />

component, so the

.scss

.scss

can't pick up the class name in the html because it a whole component in the jsx.

I could just go back and not have the button as a separate component and keep all the styles in the

_nav.scss

_nav.scss

and the selectors for the class names will be fine.

Let me know what you think.

Thanks.

KP-C

Kevin Powell - Community•3y ago•

7 replies

Json

Styling Components with SASS

<Button />

<Button />

, that goes inside the

<Nav />

<Nav />

component.
I've created a

_button.scss

_button.scss

file for the button, there are four buttons inside the nav and I left the styles for each individual

<Button />

<Button />

component inside the

_nav.scss

_nav.scss

.
Which are selected by using the

class

class

.

Though, the styles don't show up for each unique button, just for the general button style.
And I believe this is because the class name is being populated by the use of props in the

<Button />

<Button />

component, so the

.scss

.scss

can't pick up the class name in the html because it a whole component in the jsx.

I could just go back and not have the button as a separate component and keep all the styles in the

_nav.scss

_nav.scss

and the selectors for the class names will be fine.

Let me know what you think.

Thanks.

Styling Components with SASS

Similar Threads

Styling Components with SASS

Similar Threads

Similar Threads

Similar Threads