Added sidebar styles (plus markup for faq page) - also included a sticky option

Signed-off-by: Josh Angell <josh@supercooldesign.co.uk>

1 files changed, 28 insertions, 4 deletions

diff --git a/web/cobrands/fixmystreet/layout.scss b/web/cobrands/fixmystreet/layout.scss
index 07e8778c9..71904cd4f 100644
--- a/web/cobrands/fixmystreet/layout.scss
+++ b/web/cobrands/fixmystreet/layout.scss
@@ -288,23 +288,47 @@ body.fullwidthpage {
     width:40em;
   }
 }
-// two thirds width page, also has option for a sidebar
+// two thirds width page, also has option for a sidebar which can be sticky or not
 body.twothirdswidthpage {
   @extend .fullwidthpage;
   .content {
     width:40em;
     position: relative;
     aside {
-      background:#fff;
+      background:#eee;
       position:absolute;
-      left:44em;
+      left:42em;
       top:0;
-      width:13.5em;
+      z-index: -1;
+      width:13em;
       padding:1em;
       @include box-shadow(0px 0px 6px 1px #000);
     }
+    .sticky-sidebar {
+      position: absolute;
+      left:42em;
+      z-index: -1;
+      aside {
+        position: fixed;
+        top:7em;
+        left:auto;
+      }
+    }
   }
 }
+//as ie6 doesn;t like 'fixed' we will make it absolute again
+.ie6 body.twothirdswidthpage .content .sticky-sidebar {
+  position:static;
+  aside {
+    position:absolute;
+    left:42em;
+    top:0;
+  }
+}
+//bit of extra space for ie7
+.ie7 body.twothirdswidthpage .content .sticky-sidebar aside {
+  top:11em;
+}
 
 
 // table wrapper - this enables anything to become a