From ec31c38ec7d55ee402c196c296fc12f3635fad28 Mon Sep 17 00:00:00 2001 From: Ed Morales Date: Tue, 4 Jul 2017 20:11:51 -0700 Subject: [PATCH] fix(layout): remove % note from sidenavWidth (#738) also fix issue where the width would act weird in certain occations when the min-width was greater than the max-width --- src/platform/core/layout/README.md | 2 +- src/platform/core/layout/layout-manage-list/README.md | 2 +- .../layout/layout-manage-list/layout-manage-list.component.html | 1 + .../layout/layout-manage-list/layout-manage-list.component.ts | 2 +- src/platform/core/layout/layout-nav-list/README.md | 2 +- .../core/layout/layout-nav-list/layout-nav-list.component.html | 1 + .../core/layout/layout-nav-list/layout-nav-list.component.ts | 2 +- src/platform/core/layout/layout.component.html | 1 + src/platform/core/layout/layout.component.ts | 2 +- 9 files changed, 9 insertions(+), 6 deletions(-) diff --git a/src/platform/core/layout/README.md b/src/platform/core/layout/README.md index 4745566d11..f6bed416f4 100644 --- a/src/platform/core/layout/README.md +++ b/src/platform/core/layout/README.md @@ -9,7 +9,7 @@ | --- | --- | --- | | mode | 'over', 'side' or 'push' | The mode or styling of the sidenav. Defaults to 'over'. | opened | boolean | Whether or not the sidenav is opened. Use this binding to open/close the sidenav. Defaults to 'false'. -| sidenavWidth | string | Sets the 'width' of the sidenav in either 'px' or '%' ('%' is not well supported yet as stated in the layout docs). Defaults to '320px'. +| sidenavWidth | string | Sets the 'width' of the sidenav in either 'px' or '%'. Defaults to '320px'. ## Usage diff --git a/src/platform/core/layout/layout-manage-list/README.md b/src/platform/core/layout/layout-manage-list/README.md index 49322d0c2b..df7592f288 100644 --- a/src/platform/core/layout/layout-manage-list/README.md +++ b/src/platform/core/layout/layout-manage-list/README.md @@ -9,7 +9,7 @@ | --- | --- | --- | | mode | 'over', 'side' or 'push' | The mode or styling of the sidenav. Defaults to 'side'. | opened | boolean | Whether or not the sidenav is opened. Use this binding to open/close the sidenav. Defaults to 'true'. -| sidenavWidth | string | Sets the 'width' of the sidenav in either 'px' or '%' ('%' is not well supported yet as stated in the layout docs). Defaults to '257px'. +| sidenavWidth | string | Sets the 'width' of the sidenav in either 'px' or '%'. Defaults to '257px'. ## Usage diff --git a/src/platform/core/layout/layout-manage-list/layout-manage-list.component.html b/src/platform/core/layout/layout-manage-list/layout-manage-list.component.html index 7c11ae0fef..673ae59594 100644 --- a/src/platform/core/layout/layout-manage-list/layout-manage-list.component.html +++ b/src/platform/core/layout/layout-manage-list/layout-manage-list.component.html @@ -5,6 +5,7 @@ [opened]="opened" [disableClose]="disableClose" [style.max-width]="sidenavWidth" + [style.min-width]="sidenavWidth" layout="column" layout-fill class="md-whiteframe-z1"> diff --git a/src/platform/core/layout/layout-manage-list/layout-manage-list.component.ts b/src/platform/core/layout/layout-manage-list/layout-manage-list.component.ts index 435303e960..b13eecd616 100644 --- a/src/platform/core/layout/layout-manage-list/layout-manage-list.component.ts +++ b/src/platform/core/layout/layout-manage-list/layout-manage-list.component.ts @@ -50,7 +50,7 @@ export class TdLayoutManageListComponent implements ILayoutTogglable { /** * sidenavWidth?: string * - * Sets the "width" of the sidenav in either "px" or "%" ("%" is not well supported yet as stated in the layout docs) + * Sets the "width" of the sidenav in either "px" or "%" * Defaults to "257px". * * https://github.com/angular/material2/tree/master/src/lib/sidenav diff --git a/src/platform/core/layout/layout-nav-list/README.md b/src/platform/core/layout/layout-nav-list/README.md index e4e57764b2..bdb46b4870 100644 --- a/src/platform/core/layout/layout-nav-list/README.md +++ b/src/platform/core/layout/layout-nav-list/README.md @@ -14,7 +14,7 @@ | navigationRoute | string | option to set the combined route for the icon, logo, and toolbarTitle. | mode | 'over', 'side' or 'push' | The mode or styling of the sidenav. Defaults to 'side'. | opened | boolean | Whether or not the sidenav is opened. Use this binding to open/close the sidenav. Defaults to 'true'. -| sidenavWidth | string | Sets the 'width' of the sidenav in either 'px' or '%' ('%' is not well supported yet as stated in the layout docs). Defaults to '257px'. +| sidenavWidth | string | Sets the 'width' of the sidenav in either 'px' or '%'. Defaults to '257px'. ## Usage diff --git a/src/platform/core/layout/layout-nav-list/layout-nav-list.component.html b/src/platform/core/layout/layout-nav-list/layout-nav-list.component.html index 4714a1cdfd..29bc7ff6d3 100644 --- a/src/platform/core/layout/layout-nav-list/layout-nav-list.component.html +++ b/src/platform/core/layout/layout-nav-list/layout-nav-list.component.html @@ -7,6 +7,7 @@ [opened]="opened" [disableClose]="disableClose" [style.max-width]="sidenavWidth" + [style.min-width]="sidenavWidth" layout="column" layout-fill class="md-whiteframe-z1"> diff --git a/src/platform/core/layout/layout-nav-list/layout-nav-list.component.ts b/src/platform/core/layout/layout-nav-list/layout-nav-list.component.ts index 03cf9dfe89..6c531c5c30 100644 --- a/src/platform/core/layout/layout-nav-list/layout-nav-list.component.ts +++ b/src/platform/core/layout/layout-nav-list/layout-nav-list.component.ts @@ -81,7 +81,7 @@ export class TdLayoutNavListComponent implements ILayoutTogglable { /** * sidenavWidth?: string * - * Sets the "width" of the sidenav in either "px" or "%" ("%" is not well supported yet as stated in the layout docs) + * Sets the "width" of the sidenav in either "px" or "%" * Defaults to "350px". * * https://github.com/angular/material2/tree/master/src/lib/sidenav diff --git a/src/platform/core/layout/layout.component.html b/src/platform/core/layout/layout.component.html index a2b7160e5d..e942611157 100644 --- a/src/platform/core/layout/layout.component.html +++ b/src/platform/core/layout/layout.component.html @@ -4,6 +4,7 @@ [mode]="mode" [opened]="opened" [style.max-width]="sidenavWidth" + [style.min-width]="sidenavWidth" [disableClose]="disableClose"> diff --git a/src/platform/core/layout/layout.component.ts b/src/platform/core/layout/layout.component.ts index 1e04c812dc..8c27385d86 100644 --- a/src/platform/core/layout/layout.component.ts +++ b/src/platform/core/layout/layout.component.ts @@ -50,7 +50,7 @@ export class TdLayoutComponent implements ILayoutTogglable { /** * sidenavWidth?: string * - * Sets the "width" of the sidenav in either "px" or "%" ("%" is not well supported yet as stated in the layout docs) + * Sets the "width" of the sidenav in either "px" or "%" * Defaults to "320px". * * https://github.com/angular/material2/tree/master/src/lib/sidenav