Client: use colors from theme

packages/client/src/components/Badges.js

@@ -302,7 +302,6 @@ const Badges = ({
       {/* {isForm  && ( 
         <BadgeWrapper isTile={isTile}>
           <HelpButton
-            color="#F2675A"
             place="bottom"
             size={isViewTable ? 12 : 16}
             className="bagde_alert icons-group"

packages/client/src/components/EditingWrapperComponent.js

@@ -174,7 +174,9 @@ const EditingWrapper = styled.div`
         }
       `};
 
-    ${({ isDisabled }) => isDisabled && "background-color: #fff"}
+    ${({ isDisabled }) =>
+      isDisabled &&
+      `background-color: ${(props) => props.theme.filesEditingWrapper.disabledBackground}`}
   }
 
   .edit-button {

packages/client/src/components/panels/EmbeddingPanel/StyledEmbeddingPanel.js

@@ -80,7 +80,7 @@ const StyledBody = styled.div`
               margin-right: 8px;
             `}
 
-      border: 1px solid #eceef1;
+      border: ${(props) => props.theme.filesPanels.embedding.border};
       border-radius: 16px;
       line-height: 20px;
       padding: 3px 15px;

packages/client/src/components/panels/StyledPanels.js

@@ -854,7 +854,7 @@ const StyledModalRowContainer = styled.div`
               margin-right: 8px;
             `}
 
-      border: 1px solid #eceef1;
+      border: ${(props) => props.theme.filesPanels.embedding.border};
       border-radius: 16px;
       line-height: 30px;
       padding: 4px 15px;

packages/client/src/pages/PortalSettings/categories/common/Appearance/StyledApperance.js

@@ -75,7 +75,8 @@ const StyledComponent = styled.div`
           `}
     border-radius: 8px;
     cursor: pointer;
-    background: ${(props) => (props.theme.isBase ? "#eceef1" : "#474747")}
+    background: ${(props) =>
+        props.theme.client.settings.common.appearance.themeAddBackground}
       url(${PlusThemeSvgUrl}) no-repeat center;
   }