fix: data source selector in dev tools tab moved to left (#7347)

* fix: style issue that data source selector in dev tools tab moved to left Signed-off-by: Yulong Ruan <[email protected]> * Changeset file for PR #7347 created/updated --------- Signed-off-by: Yulong Ruan <[email protected]> Co-authored-by: opensearch-changeset-bot[bot] <154024398+opensearch-changeset-bot[bot]@users.noreply.github.com>
opensearch-project · Jul 22, 2024 · 9ce538a · 9ce538a
1 parent d30677d
commit 9ce538a
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 1 deletion.
diff --git a/changelogs/fragments/7347.yml b/changelogs/fragments/7347.yml
@@ -0,0 +1,2 @@
+fix:
+- Data source selector in dev tools tab moved to left ([#7347](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/7347))
diff --git a/src/plugins/dev_tools/public/application.tsx b/src/plugins/dev_tools/public/application.tsx
@@ -124,6 +124,7 @@ function DevToolsWrapper({
           onSelectedDataSource={onChange}
           disabled={!dataSourceEnabled}
           fullWidth={false}
+          compressed
         />
       </div>
     );

diff --git a/src/plugins/dev_tools/public/index.scss b/src/plugins/dev_tools/public/index.scss
@@ -23,6 +23,12 @@
 }
 
 .devAppDataSourceSelector {
-  margin: 7px 8px 0 0;
+  margin: 4px 8px 0 0;
   min-width: 400px;
+  margin-left: auto;
+}
+
+.devAppTabs {
+  display: flex;
+  flex-flow: row wrap;
 }