Merge branch 'master' of https://github.com/ONLYOFFICE/CommunityServer-AspNetCore

# Conflicts:
#	products/ASC.People/Client/src/components/pages/GroupAction/Section/Header/index.js

products/ASC.People/Client/src/components/Article/Body/index.js

@@ -21,7 +21,7 @@ const getItems = data => {
               <Icons.CatalogDepartmentsIcon
                 size="scale"
                 isfill={true}
-                color="dimgray"
+                color="#657077"
               />
             ) : (
                 ""
@@ -41,7 +41,7 @@ const getItems = data => {
             <Icons.CatalogFolderIcon
               size="scale"
               isfill={true}
-              color="dimgray"
+              color="#657077"
             />
           ) : (
               ""

web/ASC.Web.Components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "asc-web-components",
-  "version": "1.0.277",
+  "version": "1.0.279",
   "description": "Ascensio System SIA component library",
   "license": "AGPL-3.0",
   "main": "dist/asc-web-components.js",

web/ASC.Web.Components/src/components/context-menu-button/index.js

@@ -119,7 +119,7 @@ class ContextMenuButton extends React.Component {
         <DropDown directionX={directionX} open={isOpen}>
           {
             this.state.data.map((item, index) =>
-              (item && (item.label || item.icon)) && <DropDownItem {...item} key={item.key || index} onClick={this.onDropDownItemClick.bind(this, item)}
+              (item && (item.label || item.icon || item.key)) && <DropDownItem {...item} key={item.key || index} onClick={this.onDropDownItemClick.bind(this, item)}
               />
             )
           }

web/ASC.Web.Components/src/components/drop-down-item/index.js

@@ -31,8 +31,8 @@ const StyledDropdownItem = styled.div`
     border: 0px;
     cursor: pointer;
     margin: 0px;
-    padding: 0 16px;
+    padding: 0px 16px;
-    line-height: 36px;
+    line-height: 32px;
     box-sizing: border-box;
     text-align: left;
     background: none;
@@ -53,6 +53,7 @@ const StyledDropdownItem = styled.div`
       background-color: ${props => props.noHover ? 'white' : '#F8F9F9'};
       text-align: left;
 
+      
       &:first-of-type {
         border-radius: 6px 6px 0 0;
       }
@@ -60,13 +61,15 @@ const StyledDropdownItem = styled.div`
       &:last-of-type {
         border-radius: 0 0 6px 6px;
       }
+      
     }
 
     ${props => props.isSeparator && 
       `
+        padding: 0px 16px;
         border: 0.5px solid #ECEEF1;
         cursor: default;
-        margin: 0px 16px;
+        margin: 6px 16px 4px;
         line-height: 1px;
         height: 1px;
         width: calc(100% - 32px);
@@ -86,7 +89,7 @@ const StyledDropdownItem = styled.div`
     }
 
     @media ${ tablet } {
-      line-height: 40px;
+      line-height: 36px;
     }
   
     ${props => props.disabled && disabledAndHeaderStyle }

web/ASC.Web.Components/src/components/drop-down/index.js

@@ -114,7 +114,7 @@ class DropDown extends React.PureComponent {
     const { maxHeight, withArrow, withBackdrop, children, open } = this.props;
     const { directionX, directionY, width } = this.state;
     const isTablet = window.innerWidth <= 1024; //TODO: Make some better
-    const itemHeight = isTablet ? 40 : 36;
+    const itemHeight = isTablet ? 36 : 32;
     const fullHeight = children && children.length * itemHeight;
     const calculatedHeight = ((fullHeight > 0) && (fullHeight < maxHeight)) ? fullHeight : maxHeight;
     const dropDownMaxHeightProp = maxHeight ? { height: calculatedHeight + 'px' } : {};

web/ASC.Web.Components/src/components/filter-input/close-button.js

@@ -12,9 +12,9 @@ const CloseButton = props => {
   return (
     <StyledCloseButton className={props.className}>
       <IconButton
-        color={"#D8D8D8"}
+        color={"#A3A9AE"}
-        hoverColor={"#333"}
+        hoverColor={"#555F65"}
-        clickColor={"#333"}
+        clickColor={"#555F65"}
         size={10}
         iconName={'CrossIcon'}
         isFill={true}

web/ASC.Web.Components/src/components/filter-input/filter-block.js

@@ -27,6 +27,7 @@ const StyledFilterItem = styled.div`
   font-size: 13px;
   line-height: 15px;
   box-sizing: border-box;
+  color: #555F65;
 
   &:last-child{
     margin-bottom: 0;
@@ -54,6 +55,9 @@ const StyledComboBox = styled(ComboBox)`
     width: auto;
     padding-left: 4px;
   }
+  .combo-button-label {
+    color: #555F65;
+  }
 `;
 const StyledFilterName = styled.span`
   line-height: 18px;

web/ASC.Web.Components/src/components/filter-input/filter-button.js

@@ -16,6 +16,7 @@ class FilterButton extends React.PureComponent {
         getData={this.props.getData}
         iconHoverName='RectangleFilterHoverIcon'
         iconClickName='RectangleFilterClickIcon'
+        className='filter-button'
       ></ContextMenuButton>
     )
   }

web/ASC.Web.Components/src/components/filter-input/index.js

@@ -31,6 +31,20 @@ const StyledSearchInput = styled.div`
 `;
 const StyledFilterBlock = styled.div`
     display: flex;
+
+    .filter-button {
+        div:active {
+            svg path:first-child { 
+            fill: #ECEEF1; 
+            }
+        }
+        div:first-child:hover {
+            svg path:not(:first-child) { 
+            stroke: #555F65; 
+            }
+        }
+    }
+
 `;
 const cloneObjectsArray = function (props) {
     return map(props, clone);

web/ASC.Web.Components/src/components/filter-input/sort-combobox.js

@@ -24,6 +24,10 @@ const StyledComboBox = styled(ComboBox)`
         }
     }
 
+    .combo-button-label {
+        color: #A3A9AE;
+    }
+
 `;
 
 class SortComboBox extends React.Component {
@@ -123,7 +127,7 @@ class SortComboBox extends React.Component {
             >
                 <StyledIconButton sortDirection={!!this.state.sortDirection}>
                     <IconButton
-                        color={"#D8D8D8"}
+                        color={"#A3A9AE"}
                         hoverColor={"#333"}
                         clickColor={"#333"}
                         size={10}

web/ASC.Web.Components/src/components/tree-menu/sub-components/tree-node.js

@@ -204,6 +204,7 @@ const TreeNodeMenu = styled(TreeNode)`
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
+        color: #555F65;
     }
     span.rc-tree-title:first-child{
         max-width: 100%;