designed DisplayItem and ItemsDisplay so it now renders a pretty table

1 files changed, 24 insertions, 3 deletions

diff --git a/src/components/Display/Display.scss b/src/components/Display/Display.scss
index e3d8b7c..25bb331 100644
--- a/src/components/Display/Display.scss
+++ b/src/components/Display/Display.scss
@@ -1,6 +1,27 @@
+@import "../../styles/theme";
+
+.ItemsDisplay,
+.ItemsDisplay table {
+  width: 100%;
+}
+
 .ItemsDisplay {
-  margin-top: 3rem;
-  margin-bottom: 3rem;
+  $sideBorder: 1px dashed $tableBorderColor;
+  border-right: $sideBorder;
+  border-left: $sideBorder;
+
+  padding: 1rem 0.5rem;
+}
+
+.ItemsDisplay td {
+  text-align: center;
+  border-bottom: 1px solid $labelUnderlineColor;
+}
+
+.ItemsDisplay .leftAlign {
+  text-align: left;
+}
 
-  
+.ItemsDisplay .legend {
+  background-color: $altBG;
 }