Merge pull request #262 from shravyaramesh/new-requested-button-sp

[fix] Suggested People: [Style] Added new requested button

2 files changed, 6 insertions, 2 deletions

diff --git a/src/assets/ionicons/requested-button.svg b/src/assets/ionicons/requested-button.svg
new file mode 100644
index 00000000..e0b924cd
--- /dev/null
+++ b/src/assets/ionicons/requested-button.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 122.69 33.43"><defs><style>.cls-1{fill:#fff;}</style></defs><path class="cls-1" d="M121.18,0H1.51A1.52,1.52,0,0,0,0,1.51V31.92a1.52,1.52,0,0,0,1.51,1.51H121.18a1.51,1.51,0,0,0,1.51-1.51V1.51A1.51,1.51,0,0,0,121.18,0ZM24.91,21.3l-2-3.87H21.13V21.3H18.92V10.73h4.4c2.4,0,3.78,1.28,3.78,3.36h0a3.1,3.1,0,0,1-1.91,3l2.23,4.2ZM37,17.77H31.43c0,1.33.73,2.1,1.86,2.1a1.75,1.75,0,0,0,1.61-.81l0,0h2v.07c-.25,1-1.29,2.37-3.65,2.37s-3.94-1.6-3.94-4.18h0c0-2.57,1.5-4.21,3.85-4.21s3.82,1.61,3.82,4ZM47.14,24H45v-3.9h-.13a2.51,2.51,0,0,1-2.43,1.35c-2,0-3.26-1.57-3.26-4.15v0c0-2.59,1.23-4.15,3.3-4.15a2.62,2.62,0,0,1,2.43,1.46H45V13.23h2.14ZM57.39,21.3H55.25V20.05h-.13a2.36,2.36,0,0,1-2.34,1.41c-1.81,0-2.74-1.09-2.74-3V13.23h2.14V18c0,1.14.43,1.73,1.44,1.73a1.58,1.58,0,0,0,1.63-1.8V13.23h2.14Zm10.25-3.53H62.09c0,1.33.73,2.1,1.86,2.1a1.75,1.75,0,0,0,1.61-.81l0,0h2v.07c-.25,1-1.29,2.37-3.65,2.37S60,19.86,60,17.28h0c0-2.57,1.5-4.21,3.85-4.21s3.82,1.61,3.82,4ZM77,18.83c0,1.59-1.47,2.63-3.54,2.63s-3.44-1-3.59-2.36v0h2.11v0a1.42,1.42,0,0,0,1.5.86c.82,0,1.38-.36,1.38-.89v0c0-.43-.32-.7-1.14-.88l-1.35-.29C70.8,17.55,70,16.8,70,15.59h0c0-1.51,1.35-2.52,3.36-2.52s3.29,1,3.38,2.35v0h-2v0a1.32,1.32,0,0,0-1.39-.83c-.74,0-1.26.34-1.26.88h0c0,.43.3.68,1.13.86l1.34.29c1.61.34,2.37,1,2.37,2.21Zm7-4H82.27v3.79c0,.73.31,1.05,1,1.05a5.41,5.41,0,0,0,.63,0v1.59a6.09,6.09,0,0,1-1.07.1c-2,0-2.76-.64-2.76-2.21V14.84H78.87V13.23h1.24V11.31h2.16v1.92h1.67Zm9.83,2.93H88.22c0,1.33.73,2.1,1.87,2.1a1.74,1.74,0,0,0,1.6-.81l0,0h2l0,.07c-.25,1-1.29,2.37-3.65,2.37s-3.94-1.6-3.94-4.18h0c0-2.57,1.5-4.21,3.86-4.21s3.81,1.61,3.81,4Zm10.14,3.53h-2.14V20h-.13a2.49,2.49,0,0,1-2.41,1.38c-2,0-3.27-1.57-3.27-4.15v0c0-2.59,1.23-4.15,3.27-4.15a2.54,2.54,0,0,1,2.41,1.42h.13V10.15h2.14Z"/><path class="cls-1" d="M24.84,14.13v0a1.58,1.58,0,0,1-1.76,1.67H21.13V12.46h1.92A1.61,1.61,0,0,1,24.84,14.13Z"/><path class="cls-1" d="M34.93,16.43H31.45a1.76,1.76,0,0,1,1.75-1.77C34.13,14.66,34.8,15.26,34.93,16.43Z"/><path class="cls-1" d="M45,17.26v0c0,1.47-.71,2.37-1.84,2.37s-1.83-.9-1.83-2.38v0c0-1.47.7-2.38,1.83-2.38S45,15.78,45,17.26Z"/><path class="cls-1" d="M65.59,16.43H62.11a1.76,1.76,0,0,1,1.75-1.77C64.79,14.66,65.46,15.26,65.59,16.43Z"/><path class="cls-1" d="M91.72,16.43H88.24A1.76,1.76,0,0,1,90,14.66C90.92,14.66,91.59,15.26,91.72,16.43Z"/><path class="cls-1" d="M101.8,17.26v0c0,1.47-.71,2.37-1.84,2.37s-1.83-.9-1.83-2.38v0c0-1.47.7-2.38,1.83-2.38S101.8,15.78,101.8,17.26Z"/></svg>
\ No newline at end of file
diff --git a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx
index b1650e3d..6cf792ef 100644
--- a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx
+++ b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx
@@ -20,6 +20,7 @@ import SuggestedPeopleOnboardingStackScreen from '../../routes/suggestedPeopleOn
 import {getSuggestedPeople} from '../../services/SuggestedPeopleService';
 import {cancelFriendRequest, resetScreenType} from '../../store/actions';
 import {RootState} from '../../store/rootReducer';
+import RequestedButton from '../../assets/ionicons/requested-button.svg';
 import {
   FriendshipStatusType,
   FriendshipType,
@@ -187,7 +188,10 @@ const SuggestedPeopleScreen: React.FC = () => {
               style={styles.requestedButton}
               onPress={() => onCancelRequest(suggested)}
               disabled={false}>
-              <Text style={styles.requestedButtonTitle}>{'Requested'}</Text>
+              <RequestedButton
+                width={SCREEN_WIDTH * 0.3}
+                height={SCREEN_HEIGHT * 0.085}
+              />
             </TouchableOpacity>
           );
         } else {
@@ -380,7 +384,6 @@ const styles = StyleSheet.create({
     shadowRadius: 2,
     shadowOffset: {width: 2, height: 2},
     shadowOpacity: 0.5,
-    backgroundColor: '#fff',
   },
   requestedButtonTitle: {
     backgroundColor: 'transparent',