From bd4ce2daeee6958e4c693a5b545f54b67fb4e5dc Mon Sep 17 00:00:00 2001
From: fabrixxm <fabrix.xm@gmail.com>
Date: Wed, 26 Apr 2017 08:58:45 +0200
Subject: [PATCH] mobile aside: max-width and transparent overlay

fix maximum aside with in mobile screen at 300px.
This way the aside will not cover all the screen.
The area not covered by aside element are dimmed by a semi-transparent overlay
---
 view/theme/frio/css/style.css | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/view/theme/frio/css/style.css b/view/theme/frio/css/style.css
index 9e0fafad1b..e65b81ac19 100644
--- a/view/theme/frio/css/style.css
+++ b/view/theme/frio/css/style.css
@@ -109,10 +109,22 @@ code {
         top: 0!important;
         background-color: #fff;
         width: 100%;
+        max-width: 300px;
         height: 100%;
         padding-top: 100px;
         z-index: 10;
     }
+    aside::before {
+        content: " ";
+        position: fixed;
+        display: block;
+        top: 0; left: 300px; right: 0; bottom: 0;
+        background-color: rgba(0,0,0,0.4);
+    }
+    aside + div {
+        display:none!important;
+    }
+
 }
 /*
 * standard page elements