diff --git a/packages/app/src/components/trivet/TestCaseTable.tsx b/packages/app/src/components/trivet/TestCaseTable.tsx index 74503da9f..0c1b97b8c 100644 --- a/packages/app/src/components/trivet/TestCaseTable.tsx +++ b/packages/app/src/components/trivet/TestCaseTable.tsx @@ -15,6 +15,11 @@ import Popup from '@atlaskit/popup'; import TextField from '@atlaskit/textfield'; const containerStyles = css` + display: flex; + flex-direction: column; + flex: 0 1 auto; + min-height: 0; + h3 { margin-top: 32px; margin-bottom: 0; @@ -28,6 +33,10 @@ const styles = css` grid-template-columns: 8px auto 36px 1fr 1fr; padding-top: 10px; + min-height: 0; + flex: 0 1 auto; + overflow: auto; + .cell { padding: 8px; overflow: hidden; @@ -37,6 +46,7 @@ const styles = css` display: flex; align-items: center; border-bottom: 1px solid rgba(255, 255, 255, 0.05); + min-height: 32px; } .test-case-row { diff --git a/packages/app/src/components/trivet/TestSuite.tsx b/packages/app/src/components/trivet/TestSuite.tsx index 469cf5ba2..d0f44b8c2 100644 --- a/packages/app/src/components/trivet/TestSuite.tsx +++ b/packages/app/src/components/trivet/TestSuite.tsx @@ -27,10 +27,24 @@ const styles = css` min-height: 100%; position: relative; display: flex; + overflow: hidden; + height: 100%; .test-suite-area { - padding: 48px 20px 20px 20px; + padding: 48px 20px 40px 20px; + min-height: 0; flex: 1 1 auto; + + display: flex; + flex-direction: column; + } + + .test-suite-area-main { + display: flex; + flex-direction: column; + + flex: 1 1 auto; + min-height: 0; } header { @@ -261,7 +275,7 @@ export const TestSuite: FC<{ testSuite: TrivetTestSuite; tryRunTests: TryRunTest -
+
{validationGraphValidationResults != null && !validationGraphValidationResults.valid && (
Validation graph requires a specific format. Please fix the following errors: