cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(aio): fix search box overlap for small devices (#17075)

Browse Source 
- Adjust search box height
- Adjust search box standard width and width for smaller devices
- Fix search jump outside of specified max width
This commit is contained in:
Stefanie Fluin 2017-06-05 22:57:17 -07:00 committed by Igor Minar
parent 7c78282ce8
commit 76b4b80a23
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
aio/src/styles/1-layouts/_top-menu.scss
View File

@ -86,7 +86,7 @@ md-toolbar.mat-toolbar {
} }
} }
aio-shell.sidenav-open { aio-shell.page-home.sidenav-open {
md-toolbar.mat-toolbar md-icon { md-toolbar.mat-toolbar md-icon {
color: $mediumgray; color: $mediumgray;
} }
@ -108,17 +108,17 @@ aio-search-box input {
background-color: $offwhite; background-color: $offwhite;
padding: 5px 16px; padding: 5px 16px;
margin-left: 8px; margin-left: 8px;
width: 150px; width: 180px;
height: 40%; max-width: 240px;
height: 50%;
@include bp(big) { @include bp(big) {
transition: width 0.4s ease-in-out; transition: width 0.4s ease-in-out;
&:focus { &:focus {
width: 50%; width: 50%;
max-width: 240px;
} }
} }
@media (max-width: 480px) { @media (max-width: 480px) {
width: 180px; width: 150px;
} }
} }