From 4329437ea690fc07f3727325c54a349eada8aa11 Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Fri, 17 Jul 2015 03:53:58 +0500 Subject: Improving search header for mobile layouts and other UI changes --- web/sass-files/sass/partials/_headers.scss | 7 ++++++- web/sass-files/sass/partials/_modal.scss | 2 +- web/sass-files/sass/partials/_responsive.scss | 9 ++++++--- web/sass-files/sass/partials/_search.scss | 13 ++++++------- 4 files changed, 19 insertions(+), 12 deletions(-) (limited to 'web/sass-files/sass') diff --git a/web/sass-files/sass/partials/_headers.scss b/web/sass-files/sass/partials/_headers.scss index d876d8b37..c2740891a 100644 --- a/web/sass-files/sass/partials/_headers.scss +++ b/web/sass-files/sass/partials/_headers.scss @@ -157,6 +157,7 @@ font-size: 14px; line-height: 50px; #member_popover { + margin-right: 5px; width: 45px; color: #999; cursor: pointer; @@ -232,12 +233,16 @@ vertical-align: top; display: inline-block; width: 15px; - margin: 9px 3px 3px 0; + margin: 9px 4px 3px 0; &:hover { svg { fill: #888; } } + a { + height: 100%; + display: block; + } svg { vertical-align: top; margin-top: 8px; diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss index 1b0338884..f359037c5 100644 --- a/web/sass-files/sass/partials/_modal.scss +++ b/web/sass-files/sass/partials/_modal.scss @@ -155,7 +155,7 @@ position: relative; max-width: 90%; min-height: 50px; - min-width: 280px; + min-width: 320px; @include border-radius(3px); display: table; margin: 0 auto; diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss index 1f9643175..a33d69378 100644 --- a/web/sass-files/sass/partials/_responsive.scss +++ b/web/sass-files/sass/partials/_responsive.scss @@ -432,13 +432,16 @@ color: #fff; .search__form { border: none; - padding: 0 10px 0 30px; + padding: 0 60px 0 25px; .form-control { + line-height: 31px; background: none; color: #fff; - border-bottom: 1px solid rgba(#fff, 0.7); border-radius: 0; - padding: 0 10px 0 23px; + padding: 0 10px 0; + @include input-placeholder { + color: rgba(#fff, 0.6); + } } ::-webkit-input-placeholder { color: #fff; diff --git a/web/sass-files/sass/partials/_search.scss b/web/sass-files/sass/partials/_search.scss index 8d51d00c0..d4a4da243 100644 --- a/web/sass-files/sass/partials/_search.scss +++ b/web/sass-files/sass/partials/_search.scss @@ -2,21 +2,20 @@ padding: 8px 8px 8px 0; } .sidebar__collapse { - width: 20px; - height: 30px; + width: auto; + height: auto; position: absolute; - top: 10px; - left: 6px; + top: 17px; + right: 15px; cursor: pointer; - background: url("../images/arrow-left.png") center no-repeat; - @include background-size(10px 15px); z-index: 5; display: none; } .sidebar__search-icon { position: absolute; - left: 40px; + left: 15px; top: 18px; + font-size: 16px; @include opacity(0.8); display: none; } -- cgit v1.2.3-1-g7c22