From 9f5ad68a4a4ec7b67f31deabb217fc169a1baa6e Mon Sep 17 00:00:00 2001
From: Adam Plumer <caerus.karu@gmail.com>
Date: Wed, 6 Feb 2019 21:13:29 -0600
Subject: [PATCH 1/2] fix(fxFlex): restore correct styles after fxLayoutAlign
 is applied

---
 .../flex/layout-align/layout-align.spec.ts    | 22 +++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/src/lib/flex/layout-align/layout-align.spec.ts b/src/lib/flex/layout-align/layout-align.spec.ts
index 61ac28df3..1b21cfa4e 100644
--- a/src/lib/flex/layout-align/layout-align.spec.ts
+++ b/src/lib/flex/layout-align/layout-align.spec.ts
@@ -304,6 +304,28 @@ describe('layout-align directive', () => {
       }, styler);
     });
 
+    it('should add responsive styles with fxFlex', () => {
+      createTestComponent(`
+        <div fxFlex.gt-sm="25%" fxFlex.lt-md="100%" fxLayoutAlign="center end"></div>
+      `);
+
+      expectNativeEl(fixture).not.toHaveStyle({
+        'max-width': '25%',
+      }, styler);
+
+      mediaController.activate('md', true);
+
+      expectNativeEl(fixture).toHaveStyle({
+        'max-width': '25%',
+      }, styler);
+
+      mediaController.activate('sm', true);
+
+      expectNativeEl(fixture).not.toHaveStyle({
+        'max-width': '25%',
+      }, styler);
+    });
+
     it('should update responsive styles when the layout direction changes', () => {
       createTestComponent(`
         <div fxLayout

From e32bf549839b6eb15bd567c8cac59bcb4356e4d9 Mon Sep 17 00:00:00 2001
From: Adam Plumer <caerus.karu@gmail.com>
Date: Sat, 16 Mar 2019 20:42:14 -0500
Subject: [PATCH 2/2] fixup! fix(fxFlex): restore correct styles after
 fxLayoutAlign is applied

---
 src/lib/flex/flex/flex.ts | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/lib/flex/flex/flex.ts b/src/lib/flex/flex/flex.ts
index 3197d1bd6..e91f949d7 100644
--- a/src/lib/flex/flex/flex.ts
+++ b/src/lib/flex/flex/flex.ts
@@ -234,6 +234,9 @@ export class FlexDirective extends BaseDirective2 {
       this.marshal.trackValue(this.parentElement, 'layout')
         .pipe(takeUntil(this.destroySubject))
         .subscribe(this.onLayoutChange.bind(this));
+      this.marshal.trackValue(this.nativeElement, 'layout-align')
+        .pipe(takeUntil(this.destroySubject))
+        .subscribe(this.triggerReflow.bind(this));
     }
   }