Web: Files: SharingPanel: ComboBox button style fix

products/ASC.Files/Client/src/components/panels/AddGroupsPanel/index.js

@@ -148,6 +148,7 @@ class AddGroupsPanelComponent extends React.Component {
 
             <StyledBody ref={this.scrollRef}>
               <GroupSelector
+                className="groupSelector"
                 isOpen={visible}
                 isMultiSelect
                 displayType="aside"
@@ -160,6 +161,7 @@ class AddGroupsPanelComponent extends React.Component {
                     directionX="right"
                     onAccessChange={this.onAccessChange}
                     accessOptions={accessOptions}
+                    arrowIconColor="#000000"
                   />
                 }
                 showCounter

products/ASC.Files/Client/src/components/panels/AddUsersPanel/index.js

@@ -140,6 +140,7 @@ class AddUsersPanelComponent extends React.Component {
               directionX="right"
               onAccessChange={this.onAccessChange}
               accessOptions={accessOptions}
+              arrowIconColor="#000000"
             />
           ),
         }
@@ -180,6 +181,7 @@ class AddUsersPanelComponent extends React.Component {
 
             <StyledBody ref={this.scrollRef}>
               <PeopleSelector
+                className="peopleSelector"
                 role={isMultiSelect ? null : "user"}
                 employeeStatus={1}
                 displayType="aside"

products/ASC.Files/Client/src/components/panels/SharingPanel/AccessComboBox.js

@@ -14,6 +14,7 @@ const AccessComboBox = (props) => {
     itemId,
     onAccessChange,
     t,
+    arrowIconColor,
   } = props;
   const {
     FullAccess,
@@ -100,12 +101,15 @@ const AccessComboBox = (props) => {
   );
 
   const accessIcon = getAccessIcon(access);
+  const selectedOption = arrowIconColor
+    ? { key: 0, arrowIconColor }
+    : { key: 0 };
 
   return (
     <ComboBox
       advancedOptions={advancedOptions}
       options={[]}
-      selectedOption={{ key: 0 }}
+      selectedOption={selectedOption}
       size="content"
       className="panel_combo-box"
       scaled={false}

products/ASC.Files/Client/src/components/panels/StyledPanels.js

@@ -7,14 +7,7 @@ const PanelStyles = css`
 
     .optionalBlock {
       margin-right: 4px;
-    }
-
-    &.add-groups {
-      .combo-buttons_arrow-icon {
-        flex: 0 0 5px;
-        width: 5px;
-        margin-top: 16px;
-      }
+      display: flex;
     }
 
     .combo-button {
@@ -26,6 +19,19 @@ const PanelStyles = css`
     }
   }
 
+  .groupSelector,
+  .peopleSelector {
+    .combo-buttons_arrow-icon {
+      flex: 0 0 6px;
+      width: 6px;
+      margin-top: auto;
+      margin-bottom: auto;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
+  }
+
   .footer {
     padding: 16px 0;
     width: calc(100% - 32px);