From 9a8bede80ea2cac5e2c448a55e1cddade078fdf9 Mon Sep 17 00:00:00 2001
From: Rodrigo Antinarelli <rodrigoantinarelli@gmail.com>
Date: Mon, 27 Apr 2020 12:28:04 -0300
Subject: [PATCH] fix small defects

---
 .../ViewportActionBar/ViewportActionBar.jsx   |  2 +-
 .../components/ViewportGrid/ViewportGrid.jsx  |  2 +-
 platform/ui/tailwind.config.js                | 25 ++++++++++---------
 3 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/platform/ui/src/components/ViewportActionBar/ViewportActionBar.jsx b/platform/ui/src/components/ViewportActionBar/ViewportActionBar.jsx
index 8cfa05473..d17d3da71 100644
--- a/platform/ui/src/components/ViewportActionBar/ViewportActionBar.jsx
+++ b/platform/ui/src/components/ViewportActionBar/ViewportActionBar.jsx
@@ -93,7 +93,7 @@ const ViewportActionBar = ({ studyData, onSeriesChange }) => {
             </span>
           </div>
           <div className="flex">
-            <p className="text-base truncate max-w-sm text-primary-light">
+            <p className="text-base truncate max-w-72 text-primary-light">
               {seriesDescription}
             </p>
           </div>
diff --git a/platform/ui/src/components/ViewportGrid/ViewportGrid.jsx b/platform/ui/src/components/ViewportGrid/ViewportGrid.jsx
index 855e63df5..cd9970c0d 100644
--- a/platform/ui/src/components/ViewportGrid/ViewportGrid.jsx
+++ b/platform/ui/src/components/ViewportGrid/ViewportGrid.jsx
@@ -9,7 +9,7 @@ const ViewportGrid = ({ rows, cols, viewportContents }) => {
       <div
         key={index}
         className={classnames(
-          'rounded-lg hover:border-primary-light transition duration-300 outline-none',
+          'rounded-lg hover:border-primary-light transition duration-300 outline-none overflow-hidden',
           {
             'border-2 border-primary-light -m-px': isActive,
             'border border-secondary-light': !isActive,
diff --git a/platform/ui/tailwind.config.js b/platform/ui/tailwind.config.js
index aa238afe4..db9a04e48 100644
--- a/platform/ui/tailwind.config.js
+++ b/platform/ui/tailwind.config.js
@@ -179,7 +179,7 @@ module.exports = {
       '112': '28rem',
       '250px': '250px',
     },
-    backgroundColor: (theme) => theme('colors'),
+    backgroundColor: theme => theme('colors'),
     backgroundPosition: {
       bottom: 'bottom',
       center: 'center',
@@ -196,7 +196,7 @@ module.exports = {
       cover: 'cover',
       contain: 'contain',
     },
-    borderColor: (theme) => ({
+    borderColor: theme => ({
       ...theme('colors'),
       default: theme('colors.gray.300', 'currentColor'),
     }),
@@ -310,7 +310,7 @@ module.exports = {
       extrabold: '800',
       black: '900',
     },
-    height: (theme) => ({
+    height: theme => ({
       auto: 'auto',
       ...theme('spacing'),
       full: '100%',
@@ -355,7 +355,7 @@ module.exports = {
       ...theme('spacing'),
       ...negative(theme('spacing')),
     }),
-    maxHeight: (theme) => ({
+    maxHeight: theme => ({
       full: '100%',
       screen: '100vh',
       ...theme('spacing'),
@@ -374,14 +374,15 @@ module.exports = {
       '6xl': '72rem',
       full: '100%',
       ...breakpoints(theme('screens')),
+      ...theme('spacing'),
     }),
-    minHeight: (theme) => ({
+    minHeight: theme => ({
       ...theme('spacing'),
       '0': '0',
       full: '100%',
       screen: '100vh',
     }),
-    minWidth: (theme) => ({
+    minWidth: theme => ({
       ...theme('spacing'),
       '0': '0',
       xs: '2rem',
@@ -442,9 +443,9 @@ module.exports = {
       '11': '11',
       '12': '12',
     },
-    padding: (theme) => theme('spacing'),
-    placeholderColor: (theme) => theme('colors'),
-    stroke: (theme) => ({
+    padding: theme => theme('spacing'),
+    placeholderColor: theme => theme('colors'),
+    stroke: theme => ({
       ...theme('colors'),
       current: 'currentColor',
     }),
@@ -453,8 +454,8 @@ module.exports = {
       '1': '1',
       '2': '2',
     },
-    textColor: (theme) => theme('colors'),
-    width: (theme) => ({
+    textColor: theme => theme('colors'),
+    width: theme => ({
       auto: 'auto',
       ...theme('spacing'),
       '1/2': '50%',
@@ -519,7 +520,7 @@ module.exports = {
       '40': '40',
       '50': '50',
     },
-    gap: (theme) => theme('spacing'),
+    gap: theme => theme('spacing'),
     gridTemplateColumns: {
       none: 'none',
       '1': 'repeat(1, minmax(0, 1fr))',