diff --git a/src/components/conformance/ResultsDisplay/nav.tsx b/src/components/conformance/ResultsDisplay/nav.tsx
index 1d3b61da..375a85e8 100644
--- a/src/components/conformance/ResultsDisplay/nav.tsx
+++ b/src/components/conformance/ResultsDisplay/nav.tsx
@@ -15,18 +15,22 @@ type ResultsNavProps = {
export default function ResultNavigation(props: ResultsNavProps): JSX.Element {
return (
);
}
diff --git a/src/components/conformance/ResultsDisplay/styles.module.css b/src/components/conformance/ResultsDisplay/styles.module.css
index c5542aea..9c1fa7cf 100644
--- a/src/components/conformance/ResultsDisplay/styles.module.css
+++ b/src/components/conformance/ResultsDisplay/styles.module.css
@@ -15,6 +15,11 @@
padding: 0.75em;
}
+.navSection {
+ display: flex;
+ flex-direction: row;
+}
+
.navLink:hover {
cursor: pointer;
}
@@ -27,16 +32,29 @@
padding: 0.5rem 0;
}
-@media screen and (max-height: 996px) {
+@media screen and (max-width: 996px) {
.resultsDisplay {
height: auto;
width: calc(100vw-12px);
overflow-y: auto;
}
+ .navSection {
+ min-height: 2.5rem;
+ height: auto;
+ width: 100vw;
+ }
+
.resultsNav {
- height: 3.5rem;
+ height: auto;
+ flex-direction: column;
width: 100vw;
- padding: 0.75rem auto;
+ padding: 0;
+ }
+
+ .dropdownContainer {
+ padding: 0.25rem 0;
+ width: 10.5rem;
+ height: 2rem;
}
}