diff --git a/themes/fid_adlr/scss/_customVariables.scss b/themes/fid_adlr/scss/_customVariables.scss index 0429069caf2c998be104c40e57cb4f1190c132e0..f750346d503a61eeb9af859e08cb47bcfe5fef19 100644 --- a/themes/fid_adlr/scss/_customVariables.scss +++ b/themes/fid_adlr/scss/_customVariables.scss @@ -300,6 +300,7 @@ $search-form-width-home-xl: $search-form-width-home-lg; // ++ Height and width of the default search input field $search-input-height-default: 92px; $search-input-height-fixed: 65px; +$search-input-width-affix-xs: 75%; $search-input-width-affix-sm: 75%; $search-input-width-affix-md: 80%; $search-input-width-affix-lg: 90%; @@ -320,7 +321,7 @@ $search-padding-sm-md: 40px; $seachbox-width-lg: 710px; // ++ Height of textbox with adlr claim in header (home page) -$home-text-top-padding-xs: 100px; +$home-text-top-padding-xs: 90px; $home-text-top-padding-sm: 0; $home-text-top-padding-lg: 0; $home-text-box-height-xs: 300px; diff --git a/themes/fid_adlr/scss/compiled.scss b/themes/fid_adlr/scss/compiled.scss index 1afc759ec640e0f07d755cdad589998c3bbefb0e..ce093404a631611819c327fcccb7e5dadb469ff2 100644 --- a/themes/fid_adlr/scss/compiled.scss +++ b/themes/fid_adlr/scss/compiled.scss @@ -1035,7 +1035,6 @@ body:not(.template-name-home) { // Add correct data for font-size, letter-spacing, lineheight, texttransform @include default-headings-font(26px, 1.7px, 36px, none); height: $home-text-box-height-xs; - margin-right: 5%; margin-left: 0; max-width: calc(#{$screen-xs-max} / 2); padding-bottom: $home-text-bottom-padding-xs; @@ -1051,7 +1050,7 @@ body:not(.template-name-home) { height: $home-text-box-height-sm; margin-bottom: 70px; margin-left: $home-text-left-margin-sm; - margin-top: calc(#{$navbar-header-height} + 50px); + margin-top: calc(#{$navbar-header-height} + 30px); padding-bottom: $home-text-bottom-padding-sm; padding-left: 0; padding-right: 0; @@ -1298,8 +1297,13 @@ input.searchForm_lookfor { background-color: transparent; height: $search-input-height-fixed; + @media screen and (max-width: $screen-xs-max) { + padding-right: em(60px); + } + @media screen and (min-width: $screen-sm-min) { height: $search-input-height-sm; + padding-right: em(45px); width: $search-input-width-sm; } @@ -1380,15 +1384,15 @@ input.searchForm_lookfor { @media screen and (max-width: $screen-xs-max) { height: $search-input-height-fixed; - left: 90%; + right: calc(100% - #{$search-input-width-affix-xs} - 18%); } @media screen and (min-width: $screen-sm-min) and (max-width: $screen-sm-max) { - left: calc(#{$search-input-width-affix-sm} - 2%); + right: calc(100% - #{$search-input-width-affix-sm}); } @media screen and (min-width: $screen-md-min) and (max-width: $screen-md-max) { - left: calc(#{$search-input-width-affix-md} - 2%); + right: calc(100% - #{$search-input-width-affix-md}); } @media screen and (min-width: $screen-lg-min) {