From bb1bbc2f701ef9cf09716e81e7514f94f9c46499 Mon Sep 17 00:00:00 2001
From: vaidankarswapnil <swapnil.v@zen3tech.com>
Date: Thu, 20 Jan 2022 13:44:29 +0530
Subject: [PATCH] Fixed a11y issue for the settings label

---
 less/documentDB.less                          |  4 +++
 .../Panes/SettingsPane/SettingsPane.tsx       | 27 +++++++++----------
 2 files changed, 16 insertions(+), 15 deletions(-)

diff --git a/less/documentDB.less b/less/documentDB.less
index bc36d1483..2afae78e9 100644
--- a/less/documentDB.less
+++ b/less/documentDB.less
@@ -2885,6 +2885,10 @@ a:link {
 
   .settingsSectionPart {
     padding-left: 8px;
+    label {
+      padding: 0 !important;
+      font-size: inherit;
+    }
   }
 
   .settingsSectionLabel {
diff --git a/src/Explorer/Panes/SettingsPane/SettingsPane.tsx b/src/Explorer/Panes/SettingsPane/SettingsPane.tsx
index 9abc63f82..848b6cd5f 100644
--- a/src/Explorer/Panes/SettingsPane/SettingsPane.tsx
+++ b/src/Explorer/Panes/SettingsPane/SettingsPane.tsx
@@ -188,14 +188,11 @@ export const SettingsPane: FunctionComponent = () => {
         {shouldShowCrossPartitionOption && (
           <div className="settingsSection">
             <div className="settingsSectionPart">
-              <div className="settingsSectionLabel">
-                Enable cross-partition query
-                <InfoTooltip>
-                  Send more than one request while executing a query. More than one request is necessary if the query is
-                  not scoped to single partition key value.
-                </InfoTooltip>
-              </div>
-
+              <label className="settingsSectionLabel">Enable cross-partition query</label>
+              <InfoTooltip>
+                Send more than one request while executing a query. More than one request is necessary if the query is
+                not scoped to single partition key value.
+              </InfoTooltip>
               <Checkbox
                 styles={{
                   label: { padding: 0 },
@@ -211,14 +208,14 @@ export const SettingsPane: FunctionComponent = () => {
         {shouldShowParallelismOption && (
           <div className="settingsSection">
             <div className="settingsSectionPart">
-              <div className="settingsSectionLabel">
+              <label className="settingsSectionLabel" htmlFor="input65">
                 Max degree of parallelism
-                <InfoTooltip>
-                  Gets or sets the number of concurrent operations run client side during parallel query execution. A
-                  positive property value limits the number of concurrent operations to the set value. If it is set to
-                  less than 0, the system automatically decides the number of concurrent operations to run.
-                </InfoTooltip>
-              </div>
+              </label>
+              <InfoTooltip>
+                Gets or sets the number of concurrent operations run client side during parallel query execution. A
+                positive property value limits the number of concurrent operations to the set value. If it is set to
+                less than 0, the system automatically decides the number of concurrent operations to run.
+              </InfoTooltip>
 
               <SpinButton
                 min={-1}