Himanshi Gupta
Himanshi Gupta

Reputation: 171

Is it possible to use .css & .scss files both for an angular 2 component?

I am using angular 2 along with angular 2 material. Till now I was using css for styling but I wish to use this checkbox as shown here in this codepen eg: https://codepen.io/Sambego/pen/zDLxe It involves scss & I am clueless as to where & how should I put this scss code. Here's my subject.component.ts:

@Component({
    selector: 'subjects',
    templateUrl: 'app/subjects.component.html' ,
    styleUrls: ['app/app.component.css'],
    directives: [ MdButton,MdCard,MdToolbar,MdIcon,MdInput,MD_INPUT_DIRECTIVES,MdCheckbox,ProfileDetailsComponent,AgreementComponent,ROUTER_DIRECTIVES],
     providers:[MdIconRegistry]
})

Upvotes: 1

Views: 613

Answers (1)

Jarod Moser
Jarod Moser

Reputation: 7338

If you don't want to use scss in your file system and only need to take what was from the codepen, Then I suggest using this nice website http://www.sassmeister.com/ Copy and paste the scss into the left side then you can copy and paste the css from the right side to your code

Also, codepen offers the option to view the compiled css code, it's in a drop down to the right of the css section

EDIT:

Just tried copying and pasting into the sassmeister website... didn't go over so well, use the built in codepen operation of compiling to css then copy and paste that into your code

Upvotes: 1

Related Questions