Covalent: [Feature] Integrate @angular/flex-layout

[d3viant0ne]

Feature Request

I've integrated flex-layout successfully in one of my work apps already and have been impressed with how much it simplified the layout portion of adding new features. Seems like it would be a good fit here assuming you are interested.

Also worth noting that the MatchMediaObservable has all sorts of cool possibilities for UX.

What is the motivation / use case for changing the behavior?

In my opinion Responsive layout is where free time goes to die so anything that can simplify that for developers is a good thing :)

Which version of Angular and Material, and which browser and OS does this issue affect?

The proposal would be to add the as yet, unreleased @angular/flex-layout v2.0.0-beta.2 as it has two needed bug fixes and introduces a custom break points feature.

Other information

I'm happy to do the work assuming all the stake holders want to go this route. The end result being to get back to exactly where this is now just using flex-layout to get there.

[kyleledbetter]

Thx @d3viant0ne we've been keeping an eye on flex-layout and it looks great. We brought over the flex layout from angular-material v1 since v2 didn't have anything at first and can't live without it.

This is tricky since every bit of Covalent depends on the current flex layout and every single product/app using Covalent will have to update every bit of html.

I'm thinking we bring in flex-layout and keep them living together for a while and slowly deprecate our existing layout while folks transition over. Hoping there's no major conflicts.

MatchMediaObservable definitely has cool UX implications.

So that all being said, yes we'd love for you to submit a PR so we can start testing, thanks so much for the offer!

[emoralesb05]

We will probably start with this as soon as beta.1 is released. 😄 We can migrate slowly and give priority to any modules that have conflicts between our flex and @angular/flex-layout

[d3viant0ne]

@emoralesb05 - FYI @ThomasBurleson landed custom breakpoints and reworked the ObservableMediaService a bit. At this point @angular/flex-layout has feature parity+ with the MediaService currently in Covalent so everything is g2g on the library side.

Just @ me if you want some extra bandwidth updating features in Covalent to use fxFlex

[emoralesb05]

Awesome @d3viant0ne ! I had not seen that the beta.4 release was out since the changelog hasnt been updated in a while.

Will @ you for sure 😄 , i am liking this one in particular https://github.com/angular/flex-layout/pull/147 since its exactly the roadmap we wanted for the tdMediaToggleDirective.

[ThomasBurleson]

Also see https://github.com/angular/flex-layout/wiki/Custom-Breakpoints

On Sun, Feb 5, 2017, 5:27 PM Ed Morales [e-mail] wrote:

Awesome @d3viant0ne https://github.com/d3viant0ne ! I had not seen that
the beta.4 release was out since the changelog hasnt been updated in a
while.

Will @ you for sure 😄 , i am liking this one in particular
angular/flex-layout#147 https://github.com/angular/flex-layout/pull/147
since its exactly the roadmap we wanted for the tdMediaToggleDirective.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/Teradata/covalent/issues/239#issuecomment-277559231,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAM17QDmHQdTWHeuJK2cDA7oTrSZ6Cjhks5rZlrPgaJpZM4LcNpt
.

[emoralesb05]

Thanks @ThomasBurleson ! Will check it out since we want to include this as soon as possible 😄

[emoralesb05]

@d3viant0ne Started the initial PR to include it as part of covalent for next release 😄 .