Fix a11y issues with cross cluster replication flyouts

elastic · Jan 17, 2023 · d9f81a7 · d9f81a7
1 parent 7393675
commit d9f81a7
Show file tree

Hide file tree

Showing 3 changed files with 182 additions and 156 deletions.
diff --git a/...public/app/sections/home/auto_follow_pattern_list/components/detail_panel/detail_panel.js b/...public/app/sections/home/auto_follow_pattern_list/components/detail_panel/detail_panel.js
@@ -102,9 +102,9 @@ export class DetailPanel extends Component {
 
           <EuiSpacer size="s" />
 
-          <EuiDescriptionList data-test-subj="settingsValues">
-            <EuiFlexGroup>
-              <EuiFlexItem>
+          <EuiFlexGroup>
+            <EuiFlexItem>
+              <EuiDescriptionList data-test-subj="settingsValues">
                 <EuiDescriptionListTitle>
                   <EuiTitle size="xs">
                     <FormattedMessage
@@ -117,9 +117,11 @@ export class DetailPanel extends Component {
                 <EuiDescriptionListDescription data-test-subj="remoteCluster">
                   {remoteCluster}
                 </EuiDescriptionListDescription>
-              </EuiFlexItem>
+              </EuiDescriptionList>
+            </EuiFlexItem>
 
-              <EuiFlexItem>
+            <EuiFlexItem>
+              <EuiDescriptionList data-test-subj="settingsValues">
                 <EuiDescriptionListTitle>
                   <EuiTitle size="xs">
                     <FormattedMessage
@@ -132,13 +134,15 @@ export class DetailPanel extends Component {
                 <EuiDescriptionListDescription data-test-subj="leaderIndexPatterns">
                   {leaderIndexPatterns.join(', ')}
                 </EuiDescriptionListDescription>
-              </EuiFlexItem>
-            </EuiFlexGroup>
+              </EuiDescriptionList>
+            </EuiFlexItem>
+          </EuiFlexGroup>
 
-            <EuiSpacer size="s" />
+          <EuiSpacer size="s" />
 
-            <EuiFlexGroup>
-              <EuiFlexItem>
+          <EuiFlexGroup>
+            <EuiFlexItem>
+              <EuiDescriptionList data-test-subj="settingsValues">
                 <EuiDescriptionListTitle>
                   <EuiTitle size="xs">
                     <FormattedMessage
@@ -158,9 +162,11 @@ export class DetailPanel extends Component {
                     </em>
                   )}
                 </EuiDescriptionListDescription>
-              </EuiFlexItem>
+              </EuiDescriptionList>
+            </EuiFlexItem>
 
-              <EuiFlexItem>
+            <EuiFlexItem>
+              <EuiDescriptionList data-test-subj="settingsValues">
                 <EuiDescriptionListTitle>
                   <EuiTitle size="xs">
                     <FormattedMessage
@@ -180,9 +186,9 @@ export class DetailPanel extends Component {
                     </em>
                   )}
                 </EuiDescriptionListDescription>
-              </EuiFlexItem>
-            </EuiFlexGroup>
-          </EuiDescriptionList>
+              </EuiDescriptionList>
+            </EuiFlexItem>
+          </EuiFlexGroup>
         </section>
       </>
     );