ResponsiveBreakpointService

[Jogo27]

This ticket is part of the information panel subproject. The goal of this ticket is to implement a service that informs components when the responsive breakpoints defined in the stylesheats are reached. This service will later be used by PollComponent and CreateComponent to decide whether the informations must be in an InformationPanelComponent.
I suggest the following steps:

• Create the service by launching ng generate service ResponsiveBreakpoint.
• Choose a type to hold the information provided by the service. This information says in which width range the page is currently displayed. For instance, you could use a TypeScript enum, or a union of string literal types.
• The information will be provided to the component by a read-only property of type Observable. This read-only property is backed by a private variable of type BehaviorSubject. Look for instance in app/src/app/config.service.ts to have an example of such a pair of properties.
• To update the private variable (using the next method), you could use a BreakpointObserver provided by Angular Material. The width limits to observe are read from CSS, as in the prototype.
• Test your work by injecting the ResponsiveBreakpointService into PollComponent, and displaying the information it provides using the async pipe.
• Once everything works fine, you could optimize your code by removing the private variable backing the observable property, and use filter, map and/or others RxJS operators directly on the returned value of the observe method of BreakpointObserver.