Improve admin report edit page.

Show map, break into two columns, fix display of sent time after
clicking "Mark as sent", tidy up labels.

3 files changed, 36 insertions, 12 deletions

diff --git a/web/cobrands/sass/_admin.scss b/web/cobrands/sass/_admin.scss
index 36323f295..a53f9f60a 100644
--- a/web/cobrands/sass/_admin.scss
+++ b/web/cobrands/sass/_admin.scss
@@ -9,6 +9,11 @@ $button_col:    #fff;
 $button_bg_col: #a1a1a1;  // also search bar (tables)
 
 .admin {
+    .full-width {
+        padding: 0 1em;
+        background-color: #fff;
+    }
+
     table {
         width: 100%;
         font-size: 0.9em;
diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss
index f81d969ab..5cff6e769 100644
--- a/web/cobrands/sass/_base.scss
+++ b/web/cobrands/sass/_base.scss
@@ -301,11 +301,15 @@ label{
   margin-top: 1.25em;
   margin-bottom: 0.25em;
   font-weight: bold;
-  &.inline{
+  &.inline {
     display: inline;
     padding: flip(0 2em 0 1em, 0 1em 0 2em);
     font-weight: normal;
   }
+  &.inline-text {
+    display: inline;
+    font-weight: normal;
+  }
 }
 
 // grey background, full width box
@@ -542,10 +546,9 @@ body.mappage .wrapper {
   position: static;
 }
 
-
 // #key-tools is the list that's pulled out an stick to the bottom of the page of desktop, below is mostly just aesthetic
 .shadow-wrap {
-  @extend .full-width;
+  margin: 0 -1em;
   ul#key-tools{
     @include list-reset-soft;
     margin-bottom: 1em;
@@ -644,7 +647,7 @@ footer {
 }
 
 #footer-mobileapps {
-  @extend .full-width;
+  margin: 0 -1em;
   padding: 1em 1em 0;
   h4 {
     margin:0;
@@ -998,10 +1001,9 @@ input.final-submit {
 
 // map stuff
 #map_box {
-  @extend .full-width;
+  margin: 0 -1em 1em;
   background: #333;
   height: 29em;
-  margin-bottom: 1em;
   overflow: hidden;
   position: relative;
 
@@ -1348,11 +1350,10 @@ table.nicetable {
 }
 
 .promo {
-  @extend .full-width;
+  margin: 0 -1em 1em;
   color: $primary_text;
   background: $primary;
   padding:1em;
-  margin-bottom:1em;
   overflow:hidden;
   position: relative;
   .close-promo {
@@ -1372,10 +1373,9 @@ table.nicetable {
 }
 
 .alert {
-  @extend .full-width;
+  margin: 0 -1em 1em;
   background:#ff0000;
   padding:1em;
-  margin-bottom:1em;
   color:#fff;
   a, a:hover {
     color:$primary;
@@ -1442,7 +1442,7 @@ table.nicetable {
     margin: 0.5em 0 0;
   }
   #postcodeForm {
-    @extend .full-width;
+    margin: 0 -1em;
     padding:1em;
     color: $primary_text;
     background: $primary;
diff --git a/web/cobrands/sass/_layout.scss b/web/cobrands/sass/_layout.scss
index cd90b74ed..536825b5a 100644
--- a/web/cobrands/sass/_layout.scss
+++ b/web/cobrands/sass/_layout.scss
@@ -324,6 +324,18 @@ body.mappage {
   }
 }
 
+// Want to cover over the blue sidebar
+body.mappage.admin {
+    .full-width--top {
+        margin-top: -1em;
+        padding-top: 1em;
+    }
+    .full-width--bottom {
+        padding-bottom: 1em;
+        margin-bottom: -4em;
+    }
+}
+
 #map_box {
   position: absolute;
   z-index: auto;
@@ -839,7 +851,7 @@ textarea.form-error {
 }
 
 // Notes presented alongside the reporting form
-#report-a-problem-sidebar {
+.sidebar, #report-a-problem-sidebar {
   margin-bottom: 2em;
 
   // If the parent is .with-notes we know we have space to
@@ -854,6 +866,13 @@ textarea.form-error {
     font-size: 0.75em;
   }
 
+  ul {
+      @include list-reset-soft;
+      li {
+          margin-bottom: 0.5em;
+      }
+  }
+
   .sidebar-notes {
     color: #666;
   }