@comicrelief/component-library 7.0.0 → 7.0.2

package/src/components/Organisms/Donate/__snapshots__/Donate.test.js.snap

@@ -367,7 +367,7 @@ exports[`Monthly donation renders correctly 1`] = `
   background: #BECCF9;
 }
 
-.c8 #give-monthly:checked ~ .c11 {
+.c8 .give-monthly:checked ~ .c11 {
   left: calc(50% - 2px);
 }
 
@@ -415,6 +415,8 @@ exports[`Monthly donation renders correctly 1`] = `
   transition: color 0.15s ease-out;
   z-index: 2;
   cursor: default;
+  border-radius: 2rem;
+  color: #FFFFFF;
 }
 
 .c9:active:focus {
@@ -427,16 +429,6 @@ exports[`Monthly donation renders correctly 1`] = `
   box-shadow: inset 0 0 0 4px #0565D1;
 }
 
-.c9[for='give-once'] {
-  border-radius: 2rem;
-  color: #FFFFFF;
-}
-
-.c9[for='give-monthly'] {
-  border-radius: 2rem;
-  color: #FFFFFF;
-}
-
 .c10 {
   font-size: 1rem;
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
@@ -462,6 +454,8 @@ exports[`Monthly donation renders correctly 1`] = `
   transition: color 0.15s ease-out;
   z-index: 2;
   cursor: pointer;
+  border-radius: 2rem;
+  color: #000000;
 }
 
 .c10:active:focus {
@@ -474,16 +468,6 @@ exports[`Monthly donation renders correctly 1`] = `
   box-shadow: inset 0 0 0 4px #0565D1;
 }
 
-.c10[for='give-once'] {
-  border-radius: 2rem;
-  color: #000000;
-}
-
-.c10[for='give-monthly'] {
-  border-radius: 2rem;
-  color: #000000;
-}
-
 @media (min-width:740px) {
   .c5 {
     font-size: 1.25rem;
@@ -644,8 +628,9 @@ exports[`Monthly donation renders correctly 1`] = `
           <input
             aria-label="Single"
             checked={true}
+            className="give-once"
             errormsg=""
-            id="give-once"
+            id="give-once--mship-1"
             label=""
             onClick={[Function]}
             type="radio"
@@ -653,15 +638,16 @@ exports[`Monthly donation renders correctly 1`] = `
           />
           <label
             className="c9"
-            htmlFor="give-once"
+            htmlFor="give-once--mship-1"
           >
             Single
           </label>
           <input
             aria-label="Monthly"
             checked={false}
+            className="give-monthly"
             errormsg=""
-            id="give-monthly"
+            id="give-monthly--mship-1"
             label=""
             onClick={[Function]}
             type="radio"
@@ -669,7 +655,7 @@ exports[`Monthly donation renders correctly 1`] = `
           />
           <label
             className="c10"
-            htmlFor="give-monthly"
+            htmlFor="give-monthly--mship-1"
           >
             Monthly
           </label>
@@ -832,7 +818,7 @@ exports[`Monthly donation renders correctly 1`] = `
                   aria-label="Input a different amount"
                   className="c23"
                   id="mship-1--MoneyBuy-userInput"
-                  max="20000"
+                  max="25000"
                   min="1"
                   name="membership_amount"
                   onChange={[Function]}
@@ -1535,7 +1521,7 @@ exports[`Single donation renders correctly 1`] = `
                   aria-label="Input a different amount"
                   className="c17"
                   id="mship-1--MoneyBuy-userInput"
-                  max="20000"
+                  max="25000"
                   min="1"
                   name="membership_amount"
                   onChange={[Function]}
@@ -2001,7 +1987,7 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
                   aria-label="Input a different amount"
                   className="c17"
                   id="mship-1--MoneyBuy-userInput"
-                  max="20000"
+                  max="25000"
                   min="1"
                   name="membership_amount"
                   onChange={[Function]}

package/src/components/Organisms/EmailSignUp/EmailSignUpForm.js

@@ -23,6 +23,7 @@ const EmailSignUpForm = () => {
       ESU_FIELDS.LAST_NAME
     ]);
     if (valid) {
+      // eslint-disable-next-line no-console
       console.log(data);
     }
   }

package/src/components/Organisms/Membership/Form/Form.js

@@ -170,7 +170,7 @@ const Signup = ({
               id={`${mbshipID}--MoneyBuy-userInput`}
               showLabel
               {...rest}
-              max="20000"
+              max="25000"
               min="1"
               value={userInput}
               pattern="[^[0-9]+([,.][0-9]+)?$]"
@@ -183,8 +183,8 @@ const Signup = ({
           </FormFieldset>
           <Button as="input" type="submit" value="Donate" />
           {errorMsg && (
-            <Error tag="p">
-              Please enter a number between 1 and 20000, and up to 2 decimal
+            <Error tag="p" className="error--amount">
+              Please enter a number between 1 and 25000, and up to 2 decimal
               places
             </Error>
           )}

package/src/components/Organisms/Membership/Membership.test.js

@@ -589,7 +589,7 @@ it("renders correctly", () => {
                       aria-label="Input a different amount"
                       className="c19"
                       id="mship-1--MoneyBuy-userInput"
-                      max="20000"
+                      max="25000"
                       min="1"
                       name="membership_amount"
                       onChange={[Function]}

package/src/utils/Membership.js

@@ -7,7 +7,7 @@ const onKeyPress = event => {
 
 const isAmountValid = input => {
   const reg = /^\s*(?=.*[1-9])\d*(?:\.\d{1,2})?\s*$/g;
-  const isValid = input * 1 >= 1 && input * 1 <= 20000 && reg.test(input);
+  const isValid = input * 1 >= 1 && input * 1 <= 25000 && reg.test(input);
   return isValid;
 };