Feature - widescreen

* Added optional extra stylesheets to layout
* If widescreen set in query, set for user session.
* If widescreen in session, add wide stylesheet

ui/router.js

@@ -109,11 +109,21 @@ module.exports = settings => {
     directives: getContentSecurityPolicy(settings)
   }));
 
+  app.use((req, res, next) => {
+    if (req.query.widescreen) {
+      set(req.session, 'widescreen', true);
+    }
+    next();
+  });
+
   app.use((req, res, next) => {
     res.locals.user = req.user || {};
     res.locals.static = res.locals.static || {};
     set(res.locals, 'static.content', merge({}, res.locals.static.content, settings.content));
     set(res.locals, 'static.urls', merge({}, settings.urls));
+    if (req.session.widescreen) {
+      set(res.locals, 'stylesheets', '/public/css/wide.css');
+    }
     next();
   });
 

ui/views/base.jsx

@@ -23,6 +23,7 @@ const Layout = ({
   error,
   children,
   scripts = [],
+  stylesheets = [],
   user,
   crumbs,
   footerLinks,
@@ -52,7 +53,7 @@ const Layout = ({
   const page = (
     <HomeOffice
       propositionHeader={siteTitle}
-      stylesheets={['/public/css/app.css']}
+      stylesheets={['/public/css/app.css'].concat(stylesheets)}
       scripts={scripts}
       headerContent={<StatusBar user={user} />}
       nonce={nonce}