Merge branch 'release/rc-v1.2.0' of https://github.com/ONLYOFFICE/DocSpace into release/rc-v1.2.0

packages/client/src/components/ItemIcon.js

@@ -8,13 +8,34 @@ const StyledIcon = styled.img`
     props.isRoom &&
     css`
       border-radius: 6px;
-      outline: 1px solid
-        ${(props) =>
-          props.default ? "none" : props.theme.itemIcon.borderColor};
+      vertical-align: middle;
     `}
 `;
 
-StyledIcon.defaultProps = { theme: Base };
+const IconWrapper = styled.div`
+  ${(props) =>
+    props.isRoom &&
+    css`
+      position: relative;
+      border-radius: 6px;
+
+      &::before {
+        content: "";
+        position: absolute;
+        top: 0px;
+        right: 0px;
+        bottom: 0px;
+        left: 0px;
+        border: 1px solid
+          ${(props) =>
+            props.default ? "none" : props.theme.itemIcon.borderColor};
+        border-radius: 5px;
+        overflow: hidden;
+      }
+    `}
+`;
+
+IconWrapper.defaultProps = { theme: Base };
 
 const EncryptedFileIcon = styled.div`
   background: url("images/security.svg") no-repeat 0 0 / 16px 16px transparent;
@@ -36,13 +57,14 @@ const ItemIcon = ({ icon, fileExst, isPrivacy, isRoom, defaultRoomIcon }) => {
 
   return (
     <>
-      <StyledIcon
-        className={`react-svg-icon`}
-        isRoom={isRoom}
-        src={showDefaultIcon ? defaultRoomIcon : icon}
-        onLoad={onLoadRoomIcon}
-        default={showDefaultIcon}
-      />
+      <IconWrapper isRoom={isRoom} default={showDefaultIcon}>
+        <StyledIcon
+          className={`react-svg-icon`}
+          isRoom={isRoom}
+          src={showDefaultIcon ? defaultRoomIcon : icon}
+          onLoad={onLoadRoomIcon}
+        />
+      </IconWrapper>
       {isPrivacy && fileExst && <EncryptedFileIcon isEdit={false} />}
     </>
   );