From 533ae390f6814b4d7837123a2265c6347a1df010 Mon Sep 17 00:00:00 2001
From: Maicol Santos <maicol.santos@gsd.com.br>
Date: Mon, 20 Nov 2017 17:01:59 -0300
Subject: [PATCH] 184 Responsive table

Add a media query to fix the table behavior on mobile
---
 src/_Table.sass | 40 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)

diff --git a/src/_Table.sass b/src/_Table.sass
index c27ec39..f999743 100644
--- a/src/_Table.sass
+++ b/src/_Table.sass
@@ -17,3 +17,43 @@ th
 
 	&:last-child
 		padding-right: 0
+
+@media screen and (max-width: 40.0rem)
+  table
+    border-spacing: 0
+    display: flex
+    width: 100%
+
+    thead
+      border-right: solid .1rem $color-quinary
+
+      td,
+      th
+        padding-left: 0
+
+        &:first-child
+          padding-left: 0
+
+        &:last-child
+          padding-right: 1.2rem
+
+    tbody
+      display: flex
+      overflow-x: auto
+      white-space: nowrap
+
+      tr
+        border-right: solid .1rem $color-quinary
+
+        &:last-child
+          border-right: none
+
+    td,
+    th
+      display: block
+
+      &:first-child
+        padding-left: 1.2rem
+
+      &:last-child
+        padding-right: 1.2rem