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
Teradata · Jul 5, 2017 · ec31c38 · ec31c38
1 parent b948746
commit ec31c38
Show file tree

Hide file tree

Showing 9 changed files with 9 additions and 6 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -4,6 +4,7 @@
               [mode]="mode"
               [opened]="opened"
               [style.max-width]="sidenavWidth"
+              [style.min-width]="sidenavWidth"
               [disableClose]="disableClose">
     <ng-content select="td-navigation-drawer"></ng-content>
     <ng-content select="[td-sidenav-content]"></ng-content>

diff --git 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