fix(template): improve css for smaller screens

poppinss · Jun 13, 2017 · b07c77d · b07c77d
1 parent 5c4fa31
commit b07c77d
Showing 1 changed file with 15 additions and 1 deletion.
diff --git a/src/resources/error.mustache b/src/resources/error.mustache
@@ -429,7 +429,6 @@
 
     .error-stack {
       background: #edecea;
-      height: 650px;
       padding: 100px 80px;
       box-sizing: border-box;
     }
@@ -456,6 +455,7 @@
     .error-message {
       font-weight: 300;
       font-size: 40px;
+      line-height: 48px;
     }
 
     .error-title {
@@ -609,6 +609,20 @@
     .is-hidden {
       display: none;
     }
+
+    @media only screen and (max-width: 970px) {
+      .error-frames {
+        flex-direction: column-reverse;
+      }
+
+      .frame-preview {
+        width: 100%;
+      }
+
+      .frame-stack {
+        width: 100%;
+      }
+    }
 </style>
 </head>
 <body>