Fix #12485: Review layer catalog style (#12499)

Author: Binabh

web/client/components/catalog/datasets/Catalog.less

@@ -96,6 +96,8 @@
 
         .ms-catalog-header {
             gap: 2rem;
+            padding-left: 1rem;
+            padding-right: 1rem;
             border-bottom: 1px solid var(--ms-main-border-color);
         }
 
@@ -141,6 +143,12 @@
         .ms-filter-accordion + .ms-filter-accordion {
             margin-top: 0.75rem;
         }
+
+        .ms-tabs {
+            ul {
+                margin-bottom: 1rem;
+            }
+        }
     }
 
     .ms-catalog-service-editor-footer {

web/client/components/catalog/resources/FilterAccordion.jsx

@@ -29,17 +29,17 @@ const AccordionTitle = ({
 }) => {
 
     return (
-        <FlexBox gap="sm" onClick={onClick}>
+        <FlexBox gap="sm" centerChildrenVertically onClick={onClick}>
+            {loading
+                ? <Spinner/>
+                : <Glyphicon glyph={`${expanded ? "bottom" : "next"}`}/>
+            }
             <FlexBox.Fill>
                 <Text strong>
                     {children}
                     <Button onClick={onClick} style={{ display: 'block', width: 0, height: 0, overflow: 'hidden', opacity: 0, padding: 0, margin: 0 }}/>
                 </Text>
             </FlexBox.Fill>
-            {loading
-                ? <Spinner/>
-                : <Glyphicon glyph={`${expanded ? "bottom" : "back"}`}/>
-            }
         </FlexBox>
     );
 };