diff options
Diffstat (limited to 'web')
-rw-r--r-- | web/css/_main.scss | 8 | ||||
-rw-r--r-- | web/css/core.scss | 113 | ||||
-rw-r--r-- | web/js/map-OpenLayers.js | 2 | ||||
-rw-r--r-- | web/js/map-bing-ol.js | 30 | ||||
-rw-r--r-- | web/js/map-streetview.js | 2 |
5 files changed, 145 insertions, 10 deletions
diff --git a/web/css/_main.scss b/web/css/_main.scss index d74d70ceb..383e099a1 100644 --- a/web/css/_main.scss +++ b/web/css/_main.scss @@ -29,7 +29,7 @@ h2 { select, input, textarea { font-size: 99%; - max-width: 99%; + max-width: 95%; } #mysociety { @@ -214,6 +214,12 @@ select, input, textarea { #header { font-size: 150%; } + h1 { + font-size: 140%; + } + h2 { + font-size: 130%; + } #navigation { position: static; border-top: solid 2px $header_colour; diff --git a/web/css/core.scss b/web/css/core.scss index 6186f8965..895a8826b 100644 --- a/web/css/core.scss +++ b/web/css/core.scss @@ -88,6 +88,7 @@ $map_width: 500px; label { float: none; padding-right: 0; + margin-top: 0; } #submit { @@ -163,7 +164,7 @@ $map_width: 500px; fieldset, .fieldset { border: none; - padding: 0.5em; + margin: 0.5em; div { margin-top: 2px; clear: left; @@ -186,8 +187,11 @@ $map_width: 500px; cursor: hand; } + /* Lots of defaults to override small screen CSS */ #questionnaire label, #alerts label { float: none; + margin-top: 0; + display: inline; } .confirmed { @@ -241,12 +245,6 @@ $map_width: 500px; /* Drag is only present in noscript form */ #drag { - position: absolute; - width: $map_width; - height: $map_width; - right: 0; - top: 0; - input, img { position: absolute; border: none; @@ -538,6 +536,7 @@ $map_width: 500px; .olControlAttribution { bottom: 3px !important; left: 3px; + color: #222222; } .olControlPermalink { bottom: 3px !important; @@ -621,6 +620,106 @@ $map_width: 500px; margin-bottom: 1em; } + fieldset, .fieldset { + margin: 1em; + } + + label { + margin-top: 1em; + display: block; + float: none; + text-align: left; + padding-right: 0; + width: auto; + } + .fieldset div.checkbox, #problem_submit { + padding-left: 0; + } + .fieldset div.checkbox label, label.n { + display: inline; + } + + #rss_list { + float: none; + width: auto; + } + #rss_buttons { + float: none; + width: auto; + text-align: left; + } + } +} + +@media all and (max-width: 750px) { + $map_width: 365px; + #mysociety { + #map_box { + padding-left: 10px; + width: $map_width + 2px; + } + #map { + width: $map_width; + height: $map_width; + } + .banner { + margin-right: $map_width + 20px; + } + #text_map_arrow { + right: -18px; + border-width: 16px 9px; + } + } +} + +@media all and (max-width: 580px) { + $map_width: 235px; + #mysociety { + #map_box { + width: $map_width + 2px; + } + #map { + width: $map_width; + height: $map_width; + } + .banner { + margin-right: $map_width + 20px; + } + } +} + +@media all and (max-width: 320px) { + #mysociety { + #map_box { + padding-left: 0; + float: none; + width: 100%; + } + #map { + width: 99%; + } + + .banner { + margin-right: 0; + clear: both; + margin-top: 1em; + } + #text_map { + padding: 0.25em 0.5em; + font-size: 100%; + -moz-border-radius-topleft: 0; + -moz-border-radius-bottomleft: 1em; + -moz-border-radius-bottomright: 1em; + -webkit-border-top-left-radius: 0; + -webkit-border-bottom-left-radius: 1em; + -webkit-border-bottom-right-radius: 1em; + border-top-left-radius: 0; + border-bottom-left-radius: 1em; + border-bottom-right-radius: 1em; + } + #text_map_arrow { + display: none; + } } } diff --git a/web/js/map-OpenLayers.js b/web/js/map-OpenLayers.js index d3914a128..0f9974222 100644 --- a/web/js/map-OpenLayers.js +++ b/web/js/map-OpenLayers.js @@ -49,6 +49,7 @@ $(function(){ fixmystreet.drag.deactivate(); $('#side-form').hide(); $('#side').show(); + $('#sub_map_links').show(); fixmystreet.page = 'around'; }); @@ -317,6 +318,7 @@ OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, { }); $('#side-form').show(); $('#side').hide(); + $('#sub_map_links').hide(); fixmystreet.page = 'new'; location.hash = 'report'; } diff --git a/web/js/map-bing-ol.js b/web/js/map-bing-ol.js index 032ac1e89..391f837c6 100644 --- a/web/js/map-bing-ol.js +++ b/web/js/map-bing-ol.js @@ -4,14 +4,40 @@ function set_map_config(perm) { new OpenLayers.Control.ArgParser(), new OpenLayers.Control.Navigation(), perm, + //new OpenLayers.Control.ZoomPanel() new OpenLayers.Control.PanZoomFMS() ]; fixmystreet.map_type = OpenLayers.Layer.Bing; } OpenLayers.Layer.Bing = OpenLayers.Class(OpenLayers.Layer.XYZ, { - attribution: '<a href="http://www.bing.com/maps/">' + - '<img border=0 src="http://dev.virtualearth.net/Branding/logo_powered_by.png"></a>', + attributionTemplate: '${logo}${copyrights}', + + setMap: function() { + OpenLayers.Layer.XYZ.prototype.setMap.apply(this, arguments); + this.updateAttribution(); + this.map.events.register("moveend", this, this.updateAttribution); + }, + + updateAttribution: function() { + var z = this.map.getZoom() + this.zoomOffset; + var copyrights; + var logo = ''; + if (z >= 16) { + copyrights = 'Contains Ordnance Survey data © Crown copyright and database right 2010'; + } else { + logo = '<a href="http://www.bing.com/maps/"><img border=0 src="http://dev.virtualearth.net/Branding/logo_powered_by.png"></a>'; + copyrights = '© 2011 <a href="http://www.bing.com/maps/">Microsoft</a>. © AND, Navteq, Ordnance Survey'; + } + this.attribution = OpenLayers.String.format(this.attributionTemplate, { + logo: logo, + copyrights: copyrights + }); + this.map && this.map.events.triggerEvent("changelayer", { + layer: this, + property: "attribution" + }); + }, initialize: function(name, options) { var url = []; diff --git a/web/js/map-streetview.js b/web/js/map-streetview.js index cfd595b95..99fdca983 100644 --- a/web/js/map-streetview.js +++ b/web/js/map-streetview.js @@ -44,6 +44,8 @@ OpenLayers.Util.onImageLoadError = function() { * - <OpenLayers.Layer.XYZ> */ OpenLayers.Layer.StreetView = OpenLayers.Class(OpenLayers.Layer.XYZ, { + attribution: 'Map contains Ordnance Survey data © Crown copyright and database right 2010.', + /** * Constructor: OpenLayers.Layer.StreetView * |