Update colors

src/components/AddToCollectionBtn.tsx

@@ -3,7 +3,7 @@ import styled from 'styled-components';
 
 const Wrapper = styled.button`
     border: none;
-    background-color: #2dc262;
+    background-color: #51cd7c;
     position: fixed;
     z-index: 1;
     bottom: 20px;

src/components/EnteSpinner.tsx

@@ -10,7 +10,7 @@ export default function EnteSpinner(props) {
                 width: '36px',
                 height: '36px',
                 borderWidth: '0.20em',
-                color: '#2dc262',
+                color: '#51cd7c',
             }}
             role="status"
         />

src/components/FullScreenDropZone.tsx

@@ -30,7 +30,7 @@ const Overlay = styled.div`
     font-weight: 900;
     text-align: center;
     position: absolute;
-    border-color: #2dc262;
+    border-color: #51cd7c;
     border-style: solid;
     background: rgba(0, 0, 0, 0.9);
     z-index: 3000;

src/components/PhotoFrame.tsx

@@ -118,7 +118,7 @@ const EmptyScreen = styled.div`
     align-items: center;
     flex-direction: column;
     flex: 1;
-    color: #2dc262;
+    color: #51cd7c;
 
     & > svg {
         filter: drop-shadow(3px 3px 5px rgba(45, 194, 98, 0.5));
@@ -500,6 +500,7 @@ const PhotoFrame = ({
                             paddingRight: '32px',
                             paddingTop: '12px',
                             paddingBottom: '12px',
+                            fontWeight: 900,
                         }}>
                         {constants.UPLOAD_FIRST_PHOTO}
                     </Button>

src/components/SearchBar.tsx

@@ -221,12 +221,12 @@ export default function SearchBar(props: Props) {
             ...style,
             backgroundColor: '#282828',
             color: '#d1d1d1',
-            borderColor: isFocused ? '#2dc262' : '#444',
+            borderColor: isFocused ? '#51cd7c' : '#444',
             boxShadow: 'none',
             ':hover': {
-                borderColor: '#2dc262',
+                borderColor: '#51cd7c',
                 cursor: 'text',
-                '&>.icon': { color: '#2dc262' },
+                '&>.icon': { color: '#51cd7c' },
             },
         }),
         input: (style) => ({

src/components/SubmitButton.tsx

@@ -23,7 +23,7 @@ const SubmitButton = ({ loading, buttonText, inline, disabled }: Props) => (
                     width: '22px',
                     height: '22px',
                     borderWidth: '0.20em',
-                    color: '#2dc262',
+                    color: '#51cd7c',
                 }}
             />
         ) : (

src/components/pages/gallery/PreviewCard.tsx

@@ -60,8 +60,8 @@ const Check = styled.input`
     /** checked */
     &:checked::before {
         content: '';
-        background-color: #2dc262;
-        border-color: #2dc262;
+        background-color: #51cd7c;
+        border-color: #51cd7c;
         color: #fff;
     }
     &:checked::after {
@@ -90,7 +90,7 @@ const Cont = styled.div<{ disabled: boolean; selected: boolean }>`
         max-width: 100%;
         min-height: 100%;
         flex: 1;
-        ${(props) => props.selected && 'border: 5px solid #2dc262;'}
+        ${(props) => props.selected && 'border: 5px solid #51cd7c;'}
         pointer-events: none;
     }
 

src/components/pages/gallery/UploadButton.tsx

@@ -25,7 +25,7 @@ function UploadButton({ openFileUploader, isFirstFetch }) {
                 height="32px">
                 <path fill="none" d="M0 0h24v24H0z" />
                 <path
-                    fill="#2dc262"
+                    fill="#51cd7c"
                     d="M20 6h-8l-2-2H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm0 12H4V8h16v10zM8 13.01l1.41 1.41L11 12.84V17h2v-4.16l1.59 1.59L16 13.01 12.01 9 8 13.01z"
                 />
             </svg>

src/pages/_app.tsx

@@ -182,7 +182,7 @@ const GlobalStyles = createGlobalStyle`
     }
     .btn-success:hover .btn-success:focus .btn-success:active {
         background-color: #29a354;
-        border-color: #2dc262;
+        border-color: #51cd7c;
         color: #242424;
     }
     .btn-success:disabled {
@@ -276,7 +276,7 @@ const GlobalStyles = createGlobalStyle`
         background: rgba(0, 0, 0, 0.8) !important;
     }
     .bg-upload-progress-bar {
-        background-color: #2dc262;
+        background-color: #51cd7c;
     }
     .custom-switch.custom-switch-md .custom-control-label {
         padding-left: 2rem;
@@ -347,7 +347,7 @@ const GlobalStyles = createGlobalStyle`
         margin-right: 12px;
     }
     .carousel-indicators .active {
-        background-color: #2dc262;
+        background-color: #51cd7c;
     }
     div.otp-input input {
         width: 36px !important;
@@ -360,7 +360,7 @@ const GlobalStyles = createGlobalStyle`
     }
 
     div.otp-input input:not(:placeholder-shown) , div.otp-input input:focus{
-        border: 2px solid #2dc262;
+        border: 2px solid #51cd7c;
         border-radius:1px; 
         -webkit-transition: 0.5s;
         transition: 0.5s;

src/pages/index.tsx

@@ -81,7 +81,7 @@ const UpperText = styled(TextContainer)`
 `;
 
 const FeatureText = styled.div`
-    color: #2dc262;
+    color: #51cd7c;
     font-weight: bold;
     padding-top: 20px;
     font-size: 24px;

src/utils/strings/englishConstants.tsx

@@ -140,7 +140,7 @@ const englishConstants = {
     NO_INTERNET_CONNECTION:
         'please check your internet connection and try again',
     TITLE: 'ente.io | encrypted photo storage',
-    UPLOAD_FIRST_PHOTO: 'backup your first photo',
+    UPLOAD_FIRST_PHOTO: 'backup a memory',
     UPLOAD_DROPZONE_MESSAGE: 'drop to backup your files',
     CONFIRM_DELETE_FILE: 'confirm file deletion',
     DELETE_FILE_MESSAGE: 'sure you want to delete selected files?',
@@ -207,14 +207,14 @@ const englishConstants = {
             <a
                 href="https://play.google.com/store/apps/details?id=io.ente.photos"
                 target="_blank"
-                style={{ color: '#2dc262' }}
+                style={{ color: '#51cd7c' }}
                 rel="noreferrer">
                 android
             </a>{' '}
             or{' '}
             <a
                 href="https://apps.apple.com/in/app/ente-photos/id1542026904"
-                style={{ color: '#2dc262' }}
+                style={{ color: '#51cd7c' }}
                 target="_blank"
                 rel="noreferrer">
                 ios app{' '}
@@ -380,8 +380,8 @@ const englishConstants = {
     ),
     SEARCH_STATS: ({ resultCount, timeTaken }) => (
         <span>
-            found <span style={{ color: '#2dc262' }}>{resultCount}</span>{' '}
-            memories ( <span style={{ color: '#2dc262' }}> {timeTaken}</span>{' '}
+            found <span style={{ color: '#51cd7c' }}>{resultCount}</span>{' '}
+            memories ( <span style={{ color: '#51cd7c' }}> {timeTaken}</span>{' '}
             seconds )
         </span>
     ),
@@ -484,7 +484,7 @@ const englishConstants = {
                 using <code>eTags</code> to upload large files, or use our{' '}
                 <a
                     href={url}
-                    style={{ color: '#2dc262', textDecoration: 'underline' }}
+                    style={{ color: '#51cd7c', textDecoration: 'underline' }}
                     target="_blank"
                     rel="noreferrer">
                     desktop app