Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

Commit

Permalink
fix(sidenav): properly sets width of sidenav
Browse files Browse the repository at this point in the history 
Closes #957
  • Loading branch information
Robert Messerle committed Feb 4, 2015
1 parent 88813b7 commit 0318ca4
Show file tree
Hide file tree
Showing 2 changed files with 7 additions and 4 deletions.
10 changes: 6 additions & 4 deletions docs/app/css/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

body {
overflow: hidden;
max-width: 100%;
max-width: 100%;
max-height: 100%;
font-size: 14px;
}
Expand Down Expand Up @@ -305,7 +305,7 @@ md-tabs.demo-source-tabs .active md-tab-label {
height: 128px !important;
}
.small-demo .demo-toolbar,
.small-demo .md-toolbar-tools {
.small-demo .md-toolbar-tools {
min-height: 48px;
max-height: 48px;
font-size: 20px;
Expand Down Expand Up @@ -429,7 +429,7 @@ ul.buckets li a:focus {
min-height: 72px;
border-bottom: 1px solid #ddd;
}
.api-params-label {
.api-params-label {
margin-right: 8px;
text-align: center;
margin-top: 14px;
Expand Down Expand Up @@ -523,7 +523,9 @@ md-content.demo-source-container > hljs > pre > code.highlight {
.site-sidenav,
.site-sidenav.md-locked-open-add-active,
.site-sidenav.md-locked-open {
min-width: 218px;
width: 254px;
min-width: 254px;
max-width: 254px;
}
.site-sidenav > * {
min-width: 218px;
Expand Down
1 change: 1 addition & 0 deletions src/components/sidenav/sidenav.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ md-sidenav {

width: $sidenav-default-width;
min-width: $sidenav-default-width;
max-width: $sidenav-default-width;
bottom: 0;
z-index: $z-index-sidenav;
background-color: white;
Expand Down

2 comments on commit 0318ca4

@offminded
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is there a specific reason for a 254px sidenav width?

According to material spec, desktop component proportions can be determined as incrementing in keylines:
http://www.google.com/design/spec/layout/metrics-keylines.html#metrics-keylines-ratio-keylines

I think 256px width would be better accordance with material spec. (64dp x 4 = 256dp) and this way sidenav component would fit perfectly to 8dp square baseline grid.

@ThomasBurleson
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@offminded - Seems reasonable. Thx for the review. Plz submit an issue for this... or better yet a Pull Request.

Please sign in to comment.