fix: make sure dataset selector is scrollbar

nextstrain · Sep 29, 2023 · ab22f86 · ab22f86
1 parent de83b6b
commit ab22f86
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 3 deletions.
diff --git a/packages_rs/nextclade-web/src/components/Main/ButtonChangeDataset.tsx b/packages_rs/nextclade-web/src/components/Main/ButtonChangeDataset.tsx
@@ -28,8 +28,7 @@ const Container = styled.div`
   border: 1px #ccc9 solid;
   border-radius: 5px;
 
-  max-width: 100%;
-  height: 110px;
+  min-height: 110px;
 `
 
 export interface ChangeDatasetButtonProps extends ButtonProps {

diff --git a/packages_rs/nextclade-web/src/components/Main/DatasetCurrentSummary.tsx b/packages_rs/nextclade-web/src/components/Main/DatasetCurrentSummary.tsx
@@ -53,7 +53,6 @@ const Container = styled.div`
   padding: 12px;
   border: 1px #ccc9 solid;
   border-radius: 5px;
-  margin: 0.5rem auto;
 `
 
 const FlexLeft = styled.div`

diff --git a/packages_rs/nextclade-web/src/components/Main/StepDatasetSelection.tsx b/packages_rs/nextclade-web/src/components/Main/StepDatasetSelection.tsx
@@ -71,6 +71,8 @@ function DatasetSelection() {
 }
 
 const Wrapper = styled.div`
+  display: flex;
+  flex: 1;
   width: 100% !important;
 
   @media (min-width: 991.98px) {
@@ -80,6 +82,8 @@ const Wrapper = styled.div`
 `
 
 const Row = styled(RowBase)`
+  display: flex;
+  flex: 1;
   width: 100% !important;
 
   @media (min-width: 991.98px) {
@@ -89,6 +93,8 @@ const Row = styled(RowBase)`
 `
 
 const Col = styled(ColBase)`
+  display: flex;
+  flex: 1;
   width: 100% !important;
 
   @media (min-width: 991.98px) {