Chore: wrapping applying & cancel buttons together and fixing font fa…

…mily select of the text
scaleflex · Dec 22, 2020 · d9981f2 · d9981f2
1 parent a16b880
commit d9981f2
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 10 deletions.
diff --git a/projects/react/components/CustomizedCanvas.js b/projects/react/components/CustomizedCanvas.js
@@ -827,7 +827,7 @@ export default class CustomizedCanvas extends Component {
           updatedData.text = updates.selectedShape.text = updatedData.text || targetShape.text;
         }
       } else {
-        const newData = {}
+        const newData = { ...updatedData }
 
         if (typeof updatedData.x !== 'undefined' && typeof updatedData.y !== 'undefined') {
           newData.x = updatedData.x;

diff --git a/projects/react/styledComponents/Button.js b/projects/react/styledComponents/Button.js
@@ -21,11 +21,11 @@ const Button = styled.button`
      -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
-  border: 1px solid transparent;
   -webkit-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
   border-radius: ${props => getElementStylesBySize(props, 'button', 'br')};
+  border: 0;
   
   &:focus, &:hover {
     text-decoration: none;

diff --git a/projects/react/styledComponents/Crop.ui.js b/projects/react/styledComponents/Crop.ui.js
@@ -58,8 +58,7 @@ const FieldInput = styled.input.attrs(props => ({
   color: ${p => p.theme.colors.text};
   background: ${props => props.dark ? props.theme.colors.primaryBg : props.theme.colors.secondaryBg};
   border-radius: 2px;
-  box-shadow: rgba(0, 0, 0, 0.5) 0px 1px 1px inset, rgba(82, 104, 109, 0.4) 0px 1px 0px;
-  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: border-color 0.15s ease-in-out;
   vertical-align: middle;
   font-family: Roboto, sans-serif;
   border: 1px solid ${props => props.theme.colors.border};
@@ -74,7 +73,6 @@ const FieldInput = styled.input.attrs(props => ({
   
   &:focus {
     outline: none;
-    box-shadow: rgba(0, 112, 124, 0.5) 0px 1px 1px inset, rgba(0, 112, 124, 0.4) 0px 1px 0px;
   }
 `;
 
@@ -88,22 +86,20 @@ const FileInput = styled('input').attrs(props => ({
   font-size: 12px;
   line-height: 1;
   color: ${p => p.theme.colors.text};
-  background: ${props => props.dark ? props.theme.colors.primaryBg : props.theme.colors.secondaryBgHover};
-  border-radius: 3px;
-  box-shadow: rgba(0, 0, 0, 0.5) 0px 1px 1px inset, rgba(82, 104, 109, 0.4) 0px 1px 0px;
+  background: ${props => props.dark ? props.theme.colors.primaryBg : props.theme.colors.secondaryBg};
+  border-radius: 2px;
   transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   vertical-align: middle;
   border: 0px solid transparent;
   font-family: Roboto, sans-serif;
+  border: 1px solid ${props => props.theme.colors.border};
   
   &:hover {
     outline: none;
   }
   
   &:focus {
-    border: 1px solid ${props => props.theme.colors.secondaryBg};
     outline: none;
-    box-shadow: rgba(0, 112, 124, 0.5) 0px 1px 1px inset, rgba(0, 112, 124, 0.4) 0px 1px 0px;
   }
 `;
 

diff --git a/projects/react/styledComponents/Header.ui.js b/projects/react/styledComponents/Header.ui.js
@@ -33,6 +33,7 @@ const CancelBtn = styled(Button)`
   min-width: 62px;
   height: 30px;
   margin-right: 8px;
+  border: 0;
 
   &:hover {
     background: ${props => getHoverColor(props.theme.colors.primaryBg)};