diff --git a/app/assets/javascripts/util/geolocation/geolocate-action.js.erb b/app/assets/javascripts/util/geolocation/geolocate-action.js similarity index 98% rename from app/assets/javascripts/util/geolocation/geolocate-action.js.erb rename to app/assets/javascripts/util/geolocation/geolocate-action.js index a98580375..a69c72062 100644 --- a/app/assets/javascripts/util/geolocation/geolocate-action.js.erb +++ b/app/assets/javascripts/util/geolocation/geolocate-action.js @@ -22,6 +22,7 @@ function (geo, alert) { // If geolocation is supported, show geolocate button. if (navigator.geolocation) { _locateTarget = document.getElementById(target); + _locateTarget.classList.remove('hide'); _locateTargetTextContainer = _locateTarget.querySelector('span'); _locateAction = locateAction; diff --git a/app/assets/stylesheets/_base.scss b/app/assets/stylesheets/_base.scss index 06f6b3db2..dfdc2f712 100644 --- a/app/assets/stylesheets/_base.scss +++ b/app/assets/stylesheets/_base.scss @@ -801,15 +801,22 @@ body { top: 0px !important; } } #geolocate-box -{ - text-align: right; -} -.home #geolocate-box { position: absolute; right: 0; } +.inside #geolocate-box +{ + right: 10px; + top: 9px; + // Fixed max-height and overflow adjustment needed to + // handle a 1-pixel layout difference between Chrome and Firefox. + @include box-sizing(border-box); + max-height: 23px; + overflow: hidden; +} + #search-options { font-family: $font_san_serif; diff --git a/app/assets/stylesheets/components/_input-search.scss b/app/assets/stylesheets/components/_input-search.scss index 0b1bce624..b92c1bee0 100644 --- a/app/assets/stylesheets/components/_input-search.scss +++ b/app/assets/stylesheets/components/_input-search.scss @@ -231,19 +231,22 @@ { > .filter-input-group > input { - @include rounded-except(lower-right); + @include rounded-except(upper-right); } .input-search-filter-option { - top: -1px; font-size: $font_size_95; border: none; margin: 0; + padding: 3px; + padding-top: 0; + padding-bottom: 0; + max-height: 23px; background: rgba($white, 0.3); border: 1px solid rgba($white, 0); cursor: pointer; - @include rounded-except(top); + @include rounded-except(bottom); >span { @@ -260,7 +263,7 @@ { background: $search-button-hover-background; border: 1px solid rgba($input-border-color,0.2); - border-top: 1px solid rgba($white, 0.3); + border-bottom: 1px solid rgba($white, 0.3); .fa { diff --git a/app/views/component/search/_geolocate.html.haml b/app/views/component/search/_geolocate.html.haml index ee361f12d..3774b4e68 100644 --- a/app/views/component/search/_geolocate.html.haml +++ b/app/views/component/search/_geolocate.html.haml @@ -1,4 +1,4 @@ #geolocate-box - = button_tag(type: 'submit', name: nil, id: 'button-geolocate', class: "button-small #{context_class}", data: { wait_text: t('buttons.during_geolocation'), regular_text: t('buttons.services_near_me') }) do + = button_tag(type: 'submit', name: nil, id: 'button-geolocate', class: "button-small #{context_class} hide", data: { wait_text: t('buttons.during_geolocation'), regular_text: t('buttons.services_near_me') }) do %i{ class: 'fa fa-globe' } %span= t('buttons.services_near_me')