Merge pull request #3842 from ivanko22/replaceFont2

[WV-196] fix replace Nunito to Poppins font TEAM REVIEW
wevote · Feb 29, 2024 · 3c5e61d · 3c5e61d
2 parents bbe2b05 + 05b5260
commit 3c5e61d
Show file tree

Hide file tree

Showing 14 changed files with 42 additions and 42 deletions.
diff --git a/src/App.jsx b/src/App.jsx
@@ -712,7 +712,7 @@ const WeVoteBody = styled('div')`
   background-color: #fff; // rgb(235, 236, 238); // #fafafa;
   color: #333;
   display: block;
-  font-family: "Nunito Sans", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+  font-family: "Poppins", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
   line-height: 1.4;
   margin: 0 auto;
   // max-width: 960px;

diff --git a/src/css/main.css b/src/css/main.css
@@ -1,5 +1,5 @@
 @charset "UTF-8";
-@import "https://fonts.googleapis.com/css?family=Nunito+Sans:400,700&display=swap";
+@import "https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap";
 
 /*!
  July 31, 2023: ran https://www.cssportal.com/css-optimize/ to shrink the size of the file
@@ -54,7 +54,7 @@ html {
 body {
   background-color:#fff;
   color:#000;
-  font-family:"Nunito Sans","Helvetica Neue Light","Helvetica Neue","Helvetica","Arial",sans-serif;
+  font-family:"Poppins","Helvetica Neue Light","Helvetica Neue","Helvetica","Arial",sans-serif;
   font-size:16px;
   font-style:normal;
   font-weight:normal;
@@ -2387,7 +2387,7 @@ h1,h2,h3,h4,h5,h6 {
 .card-main__display-name {
   display:inline-block;
   font-size:18px;
-  font-weight:700;
+  font-weight:600;
   margin-right:8px;
   vertical-align:middle
 }
@@ -3671,7 +3671,7 @@ a {
 }
 
 .intro-story__h1 {
-  font-weight:800;
+  font-weight:600;
   font-size:24px;
   padding:32px 0 0
 }
@@ -3687,7 +3687,7 @@ a {
 }
 
 .intro-story__h1--alt {
-  font-weight:700;
+  font-weight:600;
   font-size:30px;
   padding-top:32px
 }
@@ -3892,7 +3892,7 @@ a {
 
 .issue-icon-list__issue-icon {
   color:#999;
-  font-weight:900;
+  font-weight:600;
   height:calc(16px + 4px);
   width:calc(16px + 4px);
   flex:none;
@@ -4533,7 +4533,7 @@ a {
 
 .header-nav__icon--about {
   font-size:.8rem;
-  font-weight:700;
+  font-weight:600;
   height:24px;
   display:flex;
   align-items:center;

diff --git a/src/js/common/components/Settings/VoterPhotoUpload.jsx b/src/js/common/components/Settings/VoterPhotoUpload.jsx
@@ -158,7 +158,7 @@ const styles = (theme) => ({
   dropzoneText: {
     color: '#818181',
     fontSize: '18px',
-    fontFamily: "'Nunito Sans', 'Helvetica Neue Light', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
+    fontFamily: "'Poppins', 'Helvetica Neue Light', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
     fontWeight: '300',
     paddingLeft: 5,
     paddingRight: 5,

diff --git a/src/js/common/pages/CampaignStart/CampaignStartIntro.jsx b/src/js/common/pages/CampaignStart/CampaignStartIntro.jsx
@@ -295,7 +295,7 @@ const StepText = styled('div')(({ theme }) => (`
 
 const StepTitle = styled('div')(({ theme }) => (`
   font-size: 20px;
-  font-weight: 600;
+  font-weight: 500;
   padding: 0 8px;
   text-align: left;
   ${theme.breakpoints.down('sm')} {

diff --git a/src/js/common/stories/button.css b/src/js/common/stories/button.css
@@ -1,5 +1,5 @@
 .storybook-button {
-  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-family: 'Poppins', 'Helvetica Neue', Helvetica, Arial, sans-serif;
   font-weight: 700;
   border: 0;
   border-radius: 3em;

diff --git a/src/js/components/Intro/FriendInvitationOnboardingIntro.jsx b/src/js/components/Intro/FriendInvitationOnboardingIntro.jsx
@@ -382,7 +382,7 @@ const StepNumber = styled('div')(({ theme }) => (`
 
 const StepTitle = styled('div')(({ theme }) => (`
   font-size: 20px;
-  font-weight: 600;
+  font-weight: 500;
   padding: 0 8px;
   text-align: left;
   vertical-align: top;

diff --git a/src/js/components/Navigation/HeaderBarSuspense.jsx b/src/js/components/Navigation/HeaderBarSuspense.jsx
@@ -52,7 +52,7 @@ export default function HeaderBarSuspense () {
       position: 'relative',
       color: 'rgb(51, 51, 51)',
       backgroundColor: 'white',
-      fontFamily: '"Nunito Sans", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif',
+      fontFamily: '"Poppins", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif',
       height: '48px',
       boxShadow: standardBoxShadow('wide'),
     }}

diff --git a/src/js/components/Ready/ElectionCountdown.jsx b/src/js/components/Ready/ElectionCountdown.jsx
@@ -333,7 +333,7 @@ const CardCountdownInternalWrapper = styled('div')`
 const CardTitleUpcoming = styled('h1')(({ theme }) => (`
   color: #2E3C5D !important;
   font-size: 64px;
-  font-weight: 900;
+  font-weight: 500;
   margin-bottom: 8px;
   margin-top: 12px;
   text-align: center;
@@ -358,7 +358,7 @@ const CardSubTitle = styled('h3', {
   shouldForwardProp: (prop) => !['desktopMode', 'center'].includes(prop),
 })(({ desktopMode, center }) => (`
   font-size: ${desktopMode ? '18px' : '22px'};
-  font-weight: 700;
+  font-weight: 500;
   color: #2E3C5D !important;
   margin-bottom: 0 !important;
   margin-top: ${desktopMode ? '24px' : null};

diff --git a/src/js/components/Ready/ReadyTaskBallot.jsx b/src/js/components/Ready/ReadyTaskBallot.jsx
@@ -886,7 +886,7 @@ const styles = (theme) => ({
   color: 'rgb(51, 51, 51)',
   display: 'flex',
   flexDirection: 'column',
-  fontFamily: '"Nunito Sans", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif',
+  fontFamily: '"Poppins", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif',
   fontSize: 16,
   height: 173,
   lineHeight: 22,

diff --git a/src/js/components/Share/SharedItemIntroduction.jsx b/src/js/components/Share/SharedItemIntroduction.jsx
@@ -210,7 +210,7 @@ const StepNumber = styled('div')(({ theme }) => (`
 
 const StepTitle = styled('div')(({ theme }) => (`
   font-size: 20px;
-  font-weight: 600;
+  font-weight: 500;
   padding: 0 8px;
   text-align: left;
   vertical-align: top;

diff --git a/src/js/components/Style/muiStyleOverrides.js b/src/js/components/Style/muiStyleOverrides.js
@@ -22,7 +22,7 @@ const muiStyleOverrides = {
     styleOverrides: {
       root: {
         boxShadow: 'unset',
-        fontFamily: '"Nunito Sans", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif',
+        fontFamily: '"Poppins", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif',
         fontSize: '16px',
         textTransform: 'none',
         userSelect: 'none',
@@ -35,31 +35,31 @@ const muiStyleOverrides = {
   MuiChip: {
     styleOverrides: {
       root: {
-        fontFamily: '"Nunito Sans", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif',
+        fontFamily: '"Poppins", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif',
         fontSize: 16,
       },
     },
   },
   MuiFormControlLabel: {
     styleOverrides: {
       root: {
-        fontFamily: '"Nunito Sans", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif',
+        fontFamily: '"Poppins", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif',
         marginBottom: '-.5rem',
       },
     },
   },
   MuiInputBase: {
     styleOverrides: {
       root: {
-        fontFamily: '"Nunito Sans", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif',
+        fontFamily: '"Poppins", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif',
         fontSize: 16,
       },
     },
   },
   MuiMenuItem: {
     styleOverrides: {
       root: {
-        fontFamily: '"Nunito Sans", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif',
+        fontFamily: '"Poppins", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif',
         marginTop: '-6px',
         minHeight: 34,
       },
@@ -68,7 +68,7 @@ const muiStyleOverrides = {
   MuiTab: {
     styleOverrides: {
       root: {
-        fontFamily: '"Nunito Sans", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif',
+        fontFamily: '"Poppins", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif',
         fontSize: 16,
         outline: 'none !important',
         textTransform: 'none',

diff --git a/src/js/components/Values/IssueCard.jsx b/src/js/components/Values/IssueCard.jsx
@@ -465,7 +465,7 @@ const FollowersWrapper = styled('div')`
 
 const IssueName = styled('h3')`
   font-size: 18px;
-  font-weight: bold;
+  font-weight: 500;
   margin-bottom: 0;
 `;
 

diff --git a/src/js/pages/Ballot/AddCandidateExtension/AddCandidateExtensionForm.jsx b/src/js/pages/Ballot/AddCandidateExtension/AddCandidateExtensionForm.jsx
@@ -142,8 +142,8 @@ export default function AddCandidateExtensionForm (props) {
           name="candidateName"
           id="candidateName"
           defaultValue={candidate.candidateName}
-          InputLabelProps={{ style: { fontFamily: 'Nunito Sans' } }}
-          InputProps={{ style: { fontFamily: 'Nunito Sans' } }}
+          InputLabelProps={{ style: { fontFamily: 'Poppins' } }}
+          InputProps={{ style: { fontFamily: 'Poppins' } }}
           onBlur={handleBlur}
         />
         <CandidateTextField
@@ -154,8 +154,8 @@ export default function AddCandidateExtensionForm (props) {
           name="candidateSpecificEndorsementUrl"
           id="candidateSpecificEndorsementUrl"
           defaultValue={candidate.candidateSpecificEndorsementUrl}
-          InputLabelProps={{ style: { fontFamily: 'Nunito Sans' } }}
-          InputProps={{ style: { fontFamily: 'Nunito Sans' } }}
+          InputLabelProps={{ style: { fontFamily: 'Poppins' } }}
+          InputProps={{ style: { fontFamily: 'Poppins' } }}
           onBlur={handleBlur}
         />
         <CandidateTextField
@@ -167,8 +167,8 @@ export default function AddCandidateExtensionForm (props) {
           name="endorsementPageUrl"
           id="endorsementURL"
           defaultValue={candidate.endorsementPageUrl}
-          InputLabelProps={{ style: { fontFamily: 'Nunito Sans' } }}
-          InputProps={{ style: { fontFamily: 'Nunito Sans' } }}
+          InputLabelProps={{ style: { fontFamily: 'Poppins' } }}
+          InputProps={{ style: { fontFamily: 'Poppins' } }}
           onBlur={handleBlur}
         />
         <CheckBoxArea>
@@ -216,10 +216,10 @@ export default function AddCandidateExtensionForm (props) {
           // id="candidateURL"
           defaultValue={candidate.endorsementText}
           InputLabelProps={{
-            style: { fontFamily: 'Nunito Sans' },
+            style: { fontFamily: 'Poppins' },
             shrink: true,
           }}
-          InputProps={{ style: { fontFamily: 'Nunito Sans' } }}
+          InputProps={{ style: { fontFamily: 'Poppins' } }}
           onBlur={handleBlur}
           rows="5"
           // maxRows="5"
@@ -242,7 +242,7 @@ const CandidateForm = styled('div')`
 
 const CandidateTextField = styled(TextField)`
   display: block;
-  font-family: "Nunito Sans", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+  font-family: "Poppins", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
   margin-bottom: 10px;
 `;
 

diff --git a/src/js/pages/Ballot/EditCandidateForExtension/EditCandidateForExtensionForm.jsx b/src/js/pages/Ballot/EditCandidateForExtension/EditCandidateForExtensionForm.jsx
@@ -65,8 +65,8 @@ export default function EditCandidateForExtensionForm (props) {
           label="Candidate Name"
           name="candidateName"
           defaultValue={candidate.candidateName}
-          InputLabelProps={{ style: { fontFamily: 'Nunito Sans' } }}
-          InputProps={{ style: { fontFamily: 'Nunito Sans' } }}
+          InputLabelProps={{ style: { fontFamily: 'Poppins' } }}
+          InputProps={{ style: { fontFamily: 'Poppins' } }}
           onBlur={handleBlur}
         />
         <CandidateTextField
@@ -76,8 +76,8 @@ export default function EditCandidateForExtensionForm (props) {
           label="Campaign URL"
           name="candidateCampaignUrl"
           defaultValue={candidate.candidateCampaignUrl}
-          InputLabelProps={{ style: { fontFamily: 'Nunito Sans' }, shrink: true }}
-          InputProps={{ style: { fontFamily: 'Nunito Sans' } }}
+          InputLabelProps={{ style: { fontFamily: 'Poppins' }, shrink: true }}
+          InputProps={{ style: { fontFamily: 'Poppins' } }}
           onBlur={handleBlur}
         />
         <CandidateTextField
@@ -88,8 +88,8 @@ export default function EditCandidateForExtensionForm (props) {
           label="Endorsement URL"
           name="endorsementPageUrl"
           defaultValue={candidate.endorsementPageUrl}
-          InputLabelProps={{ style: { fontFamily: 'Nunito Sans' } }}
-          InputProps={{ style: { fontFamily: 'Nunito Sans' } }}
+          InputLabelProps={{ style: { fontFamily: 'Poppins' } }}
+          InputProps={{ style: { fontFamily: 'Poppins' } }}
           onBlur={handleBlur}
         />
         <CheckBoxArea>
@@ -135,8 +135,8 @@ export default function EditCandidateForExtensionForm (props) {
           label="Endorsement Text"
           name="statementText"
           defaultValue={candidate.statementText === 'null' ? '' : candidate.statementText}
-          InputLabelProps={{ style: { fontFamily: 'Nunito Sans' }, shrink: true }}
-          InputProps={{ style: { fontFamily: 'Nunito Sans' } }}
+          InputLabelProps={{ style: { fontFamily: 'Poppins' }, shrink: true }}
+          InputProps={{ style: { fontFamily: 'Poppins' } }}
           onBlur={handleBlur}
           rows="5"
           // maxRows="5"
@@ -161,7 +161,7 @@ const CandidateForm = styled('div')`
 
 const CandidateTextField = styled(TextField)`
   display: block;
-  font-family: "Nunito Sans", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+  font-family: "Poppins", "Helvetica Neue Light", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
   margin-bottom: 10px;
 `;