search

basst314 / ngx-webcam

A simple Angular webcam component / pure & minimal, no flash-fallback
https://basst314.github.io/ngx-webcam/?
MIT License
231 stars 104 forks source link

Can not set [class] attribute. #67

Open pkasidit opened 4 years ago

pkasidit commented 4 years ago

I need to set style width:100% to video element. I see class on that element but can not set by [class].

ganholete commented 4 years ago

Me too

sagar2071995 commented 4 years ago

@pkasidit and @ganholete you have to add following lines in your css class_name .webcam-wrapper, .webcam-wrapper video { width: 100% !important; height: 100% !important; }

mspace commented 4 years ago

If using angular, I solved it like this:

/* cascade style to all child elements of a component, but not to any other element on the page */
:host ::ng-deep {
  .webcam-container .webcam-wrapper, .webcam-wrapper video {
    width: 100% !important;
    height: 100% !important;
  }
}

This way, your component does not need to have encapsulation set to None.


@Component({
  encapsulation: ViewEncapsulation.None,

Taken from here: https://blog.angular-university.io/angular-host-context/

shajirhaider commented 4 years ago

I have solved it with this

::ng-deep .webcam-container .webcam-wrapper, .webcam-wrapper video { width: 100% !important; height: 100% !important; } you need to put it on the style file of the component where you are using it