Fix/minorfixes (#506)

* fix: Add field button margins * fix: Remove field button margins * fix: Edit form modal fullscreen on mobile
cozy · May 16, 2019 · 4bbaa47 · 4bbaa47
1 parent ce293e7
commit 4bbaa47
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 15 deletions.
diff --git a/src/components/ContactCard/ContactForm/ContactFormField.jsx b/src/components/ContactCard/ContactForm/ContactFormField.jsx
@@ -49,10 +49,11 @@ class ContactFormField extends React.Component {
                 )}
                 <Button
                   icon="plus"
-                  subtle
+                  theme="text"
                   type="button"
                   onClick={() => this.addField(fields)}
                   label={t(`addLabel.${name}`)}
+                  className="u-ph-0 u-mh-0"
                 />
               </div>
             )}
@@ -89,7 +90,7 @@ class ContactFormField extends React.Component {
             round
             icon={'cross-small'}
             onClick={() => this.removeField(fields, index)}
-            className="contact-form__meta-button"
+            className="contact-form__meta-button u-m-0"
           />
         )}
       </div>

diff --git a/src/components/ContactCard/ContactForm/__snapshots__/index.spec.jsx.snap b/src/components/ContactCard/ContactForm/__snapshots__/index.spec.jsx.snap
@@ -169,7 +169,7 @@ exports[`ContactForm should fill form with contact data 1`] = `
             </div>
           </div>
           <button
-            className="styles__c-btn___-2Vnj styles__c-btn--secondary___3Br_N styles__c-btn--round___1Lkyl contact-form__meta-button"
+            className="styles__c-btn___-2Vnj styles__c-btn--secondary___3Br_N styles__c-btn--round___1Lkyl contact-form__meta-button u-m-0"
             onClick={[Function]}
             title="delete"
             type="button"
@@ -233,7 +233,7 @@ exports[`ContactForm should fill form with contact data 1`] = `
             </div>
           </div>
           <button
-            className="styles__c-btn___-2Vnj styles__c-btn--secondary___3Br_N styles__c-btn--round___1Lkyl contact-form__meta-button"
+            className="styles__c-btn___-2Vnj styles__c-btn--secondary___3Br_N styles__c-btn--round___1Lkyl contact-form__meta-button u-m-0"
             onClick={[Function]}
             title="delete"
             type="button"
@@ -260,7 +260,7 @@ exports[`ContactForm should fill form with contact data 1`] = `
           </button>
         </div>
         <button
-          className="styles__c-btn___-2Vnj styles__c-btn--subtle___OknKf"
+          className="styles__c-btn___-2Vnj styles__c-btn--text___2Vp-2 u-ph-0 u-mh-0"
           onClick={[Function]}
           title={null}
           type="button"
@@ -355,7 +355,7 @@ exports[`ContactForm should fill form with contact data 1`] = `
             </div>
           </div>
           <button
-            className="styles__c-btn___-2Vnj styles__c-btn--secondary___3Br_N styles__c-btn--round___1Lkyl contact-form__meta-button"
+            className="styles__c-btn___-2Vnj styles__c-btn--secondary___3Br_N styles__c-btn--round___1Lkyl contact-form__meta-button u-m-0"
             onClick={[Function]}
             title="delete"
             type="button"
@@ -419,7 +419,7 @@ exports[`ContactForm should fill form with contact data 1`] = `
             </div>
           </div>
           <button
-            className="styles__c-btn___-2Vnj styles__c-btn--secondary___3Br_N styles__c-btn--round___1Lkyl contact-form__meta-button"
+            className="styles__c-btn___-2Vnj styles__c-btn--secondary___3Br_N styles__c-btn--round___1Lkyl contact-form__meta-button u-m-0"
             onClick={[Function]}
             title="delete"
             type="button"
@@ -446,7 +446,7 @@ exports[`ContactForm should fill form with contact data 1`] = `
           </button>
         </div>
         <button
-          className="styles__c-btn___-2Vnj styles__c-btn--subtle___OknKf"
+          className="styles__c-btn___-2Vnj styles__c-btn--text___2Vp-2 u-ph-0 u-mh-0"
           onClick={[Function]}
           title={null}
           type="button"
@@ -541,7 +541,7 @@ exports[`ContactForm should fill form with contact data 1`] = `
             </div>
           </div>
           <button
-            className="styles__c-btn___-2Vnj styles__c-btn--secondary___3Br_N styles__c-btn--round___1Lkyl contact-form__meta-button"
+            className="styles__c-btn___-2Vnj styles__c-btn--secondary___3Br_N styles__c-btn--round___1Lkyl contact-form__meta-button u-m-0"
             onClick={[Function]}
             title="delete"
             type="button"
@@ -605,7 +605,7 @@ exports[`ContactForm should fill form with contact data 1`] = `
             </div>
           </div>
           <button
-            className="styles__c-btn___-2Vnj styles__c-btn--secondary___3Br_N styles__c-btn--round___1Lkyl contact-form__meta-button"
+            className="styles__c-btn___-2Vnj styles__c-btn--secondary___3Br_N styles__c-btn--round___1Lkyl contact-form__meta-button u-m-0"
             onClick={[Function]}
             title="delete"
             type="button"
@@ -632,7 +632,7 @@ exports[`ContactForm should fill form with contact data 1`] = `
           </button>
         </div>
         <button
-          className="styles__c-btn___-2Vnj styles__c-btn--subtle___OknKf"
+          className="styles__c-btn___-2Vnj styles__c-btn--text___2Vp-2 u-ph-0 u-mh-0"
           onClick={[Function]}
           title={null}
           type="button"
@@ -1041,7 +1041,7 @@ exports[`ContactForm should match snapshot 1`] = `
           </div>
         </div>
         <button
-          className="styles__c-btn___-2Vnj styles__c-btn--subtle___OknKf"
+          className="styles__c-btn___-2Vnj styles__c-btn--text___2Vp-2 u-ph-0 u-mh-0"
           onClick={[Function]}
           title={null}
           type="button"
@@ -1123,7 +1123,7 @@ exports[`ContactForm should match snapshot 1`] = `
           </div>
         </div>
         <button
-          className="styles__c-btn___-2Vnj styles__c-btn--subtle___OknKf"
+          className="styles__c-btn___-2Vnj styles__c-btn--text___2Vp-2 u-ph-0 u-mh-0"
           onClick={[Function]}
           title={null}
           type="button"
@@ -1205,7 +1205,7 @@ exports[`ContactForm should match snapshot 1`] = `
           </div>
         </div>
         <button
-          className="styles__c-btn___-2Vnj styles__c-btn--subtle___OknKf"
+          className="styles__c-btn___-2Vnj styles__c-btn--text___2Vp-2 u-ph-0 u-mh-0"
           onClick={[Function]}
           title={null}
           type="button"

diff --git a/src/components/Modals/ContactFormModal.jsx b/src/components/Modals/ContactFormModal.jsx
@@ -25,6 +25,7 @@ const ContactFormModal = ({
   <Modal
     overflowHidden={true}
     dismissAction={onClose}
+    mobileFullscreen={true}
     into="body"
     size="xlarge"
   >

diff --git a/src/components/Modals/__snapshots__/ContactFormModal.spec.jsx.snap b/src/components/Modals/__snapshots__/ContactFormModal.spec.jsx.snap
@@ -5,7 +5,7 @@ exports[`ContactFormModal component should render a contact form in a modal 1`]
   closable={true}
   dismissAction={[MockFunction]}
   into="body"
-  mobileFullscreen={false}
+  mobileFullscreen={true}
   overflowHidden={true}
   primaryType="regular"
   secondaryType="secondary"