diff options
Diffstat (limited to 'web')
| -rw-r--r-- | web/cobrands/fixmystreet/fixmystreet.js | 12 | ||||
| -rw-r--r-- | web/cobrands/oxfordshire/layout.scss | 94 | ||||
| -rw-r--r-- | web/cobrands/oxfordshire/position_map.js | 34 |
3 files changed, 86 insertions, 54 deletions
diff --git a/web/cobrands/fixmystreet/fixmystreet.js b/web/cobrands/fixmystreet/fixmystreet.js index 1bcb8f3c0..d4dfdf99f 100644 --- a/web/cobrands/fixmystreet/fixmystreet.js +++ b/web/cobrands/fixmystreet/fixmystreet.js @@ -53,16 +53,10 @@ function tabs(elem, indirect) { $(function(){ var $html = $('html'); - var cobrand; + var cobrand = $('meta[name="cobrand"]').attr('content'); var is_small_map = false; - if (window.location.href.indexOf('bromley') != -1) { - cobrand = 'bromley'; + if (cobrand === 'bromley' || cobrand === 'oxfordshire') { is_small_map = true; - } else if (window.location.href.indexOf('oxfordshire') != -1) { - cobrand = 'oxfordshire'; - is_small_map = true; - } else if (window.location.href.indexOf('zurich') != -1 || window.location.href.indexOf('zueri') != -1) { - cobrand = 'zurich'; } // Deal with switching between mobile and desktop versions on resize @@ -447,8 +441,6 @@ $.fn.drawer = function(id, ajax) { var offset = -18 * 16; if (cobrand == 'bromley') { offset = -110; - } else if (cobrand == 'oxfordshire') { - offset = -110; } heightFix(window, '.content', offset, 1); // in case we have a map that isn't full screen diff --git a/web/cobrands/oxfordshire/layout.scss b/web/cobrands/oxfordshire/layout.scss index 8e6b9f227..7dc6b8be6 100644 --- a/web/cobrands/oxfordshire/layout.scss +++ b/web/cobrands/oxfordshire/layout.scss @@ -89,15 +89,14 @@ body.twothirdswidthpage { // show the sidebar tips and notices in the document flow, i.e., in the // left-hand column, rather than in smaller text above the map -.general-sidebar-notes, -#report-a-problem-sidebar { - position: static; - width: auto; - @include box-shadow(rgba(0, 0, 0, 0), 0, 0, 0); - .sidebar-tips, - .sidebar-notes { - font-size:1em; - } +.general-sidebar-notes { + position: static; + width: auto; + @include box-shadow(rgba(0, 0, 0, 0), 0, 0, 0); + .sidebar-tips, + .sidebar-notes { + font-size:1em; + } } // To prevent font size larger interfering with the fixed Oxfordshire layout @@ -105,7 +104,10 @@ body.twothirdswidthpage { .full-width { width: 464px; } .shadow-wrap { width: 464px; } -#map_box { width: 464px; } +#map_box { + width: 956px; + height: 600px; +} .content { width: 432px; } body.fullwidthpage .content { width: auto; } @@ -123,6 +125,39 @@ body.twothirdswidthpage .content { } } } + +body.mappage { + .content { + width: 345px; + padding: 1em; + position: relative; + z-index: 1; + } + + .content, .ie7 .content, .ie9 .content { + margin: 3em 0 0 1em; + @include box-shadow(0px 0px 6px 1px #000); + } + + .container { + width: auto; + min-height: 635px; + z-index: auto; + } + .full-width { width: 377px; } + .shadow-wrap { width: 377px; } + + .general-sidebar-notes, + #report-a-problem-sidebar { + top: 1em; + left: 23.5em; + } + + #forgotten-pw { + left: 21.6em; + } +} + .ie6, .ie7 { body.mappage .container { width: 464px; @@ -134,8 +169,9 @@ body.twothirdswidthpage .content { #map_box { border: solid 1px #999; top: 1em; - right: 0em; - margin: 0; + right: 0; + left: 0; + margin: 0 1em; } // Perhaps fix map location (should be in central?) @@ -154,8 +190,14 @@ body.twothirdswidthpage .content { } } -#front-main #postcodeForm div { +#oxford-wrapper #front-main #postcodeForm div { border: 1px solid #fff; // because orange "Go" button (see below) abuts this border, looks a tiny bit better if it's not dark green + + #pc { + padding: 0 2%; + width: 89%; + height: 38px; + } } // styled Oxfordshire buttons -- including the "Go" button on the postcode form -- to be orange: @@ -180,16 +222,24 @@ input.green-btn{ cursor: pointer; } -// map instructions (click on 'details' to see details) are a specific requirement from OCC management -// populated dynamically by position_map.js -#occ-map-instructions { - display: none; - position: absolute; - color: #666; - margin: 0; - p { - padding: 0.5em; +.big-green-banner { + text-align: left; + text-transform: inherit; + font-family: inherit; + font-size: 1.5em; + padding: 0.5em 2em 0.5em 0.5em; + line-height: 1.3; + background: #339e00 url("/cobrands/fixmystreet/images/sprite.png") right -2177px no-repeat; + + .ie6 &, .ie7 & { + zoom: 1; + position: relative; } } +.extra-text__image { + float: left; + margin-right: 1em; +} + @import "oxfordshire"; diff --git a/web/cobrands/oxfordshire/position_map.js b/web/cobrands/oxfordshire/position_map.js index c0e7e6399..9e299ea72 100644 --- a/web/cobrands/oxfordshire/position_map.js +++ b/web/cobrands/oxfordshire/position_map.js @@ -1,3 +1,9 @@ +/** + * Position the map box correctly on window resize. + * + * Called from fixmystreet.js when the window 'resize' event is fired + * and the page is transitioning to a desktop version. + */ function position_map_box() { var $html = $('html'); var oxfordshire_right; @@ -6,33 +12,17 @@ function position_map_box() { } else { oxfordshire_right = '0em'; } - - var map_box_width = 464; - var map_box_height = 464; + + var map_box_width = "956px"; + var map_box_height = "600px"; // Do the same as CSS (in case resized from mobile). - $('#map_box').prependTo('.content').css({ + $('#map_box').prependTo('.wrapper').css({ zIndex: 1, position: 'absolute', top: '1em', left: '', right: oxfordshire_right, bottom: '', - width: map_box_width + 'px', height: map_box_height +'px', - margin: 0 + width: map_box_width, height: map_box_height, + margin: "0 1em" }); - if($('#map_box').length) { - if (! $('#occ-map-instructions').length) { - $('#map_box').after("<div id='occ-map-instructions'><p>" + - "Click on a pin and then on the “details” link to see an individual report detail.</p></div>"); - } - var mb_y = $('#map_box').position().top + map_box_height ; - $('#occ-map-instructions').show().css({ - left: '', - right: oxfordshire_right, - bottom: '', - top: mb_y +'px', - width: map_box_width - }); - } - } function map_fix() {} var slide_wards_down = 1; - |