aboutsummaryrefslogtreecommitdiff
path: root/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/components')
-rw-r--r--src/components/common/SocialIcon.tsx25
-rw-r--r--src/components/onboarding/LinkSocialMedia.tsx4
-rw-r--r--src/components/taggs/Tagg.tsx16
-rw-r--r--src/components/taggs/TaggsBar.tsx2
4 files changed, 25 insertions, 22 deletions
diff --git a/src/components/common/SocialIcon.tsx b/src/components/common/SocialIcon.tsx
index 84da1ca7..3c9deb6d 100644
--- a/src/components/common/SocialIcon.tsx
+++ b/src/components/common/SocialIcon.tsx
@@ -14,40 +14,37 @@ const SocialIcon: React.FC<SocialIconProps> = ({
}) => {
switch (social) {
case 'Instagram':
- var icon = require('../../assets/images/instagram-icon.png');
+ var icon = require('../../assets/socials/instagram-icon.png');
break;
case 'Facebook':
- var icon = require('../../assets/images/facebook-icon.png');
+ var icon = require('../../assets/socials/facebook-icon.png');
break;
case 'Twitter':
- var icon = require('../../assets/images/twitter-icon.png');
- break;
- case 'Tiktok':
- var icon = require('../../assets/images/tiktok-icon.png');
+ var icon = require('../../assets/socials/twitter-icon.png');
break;
case 'Twitch':
- var icon = require('../../assets/images/twitch-icon.png');
+ var icon = require('../../assets/socials/twitch-icon.png');
break;
case 'Pinterest':
- var icon = require('../../assets/images/pinterest-icon.png');
+ var icon = require('../../assets/socials/pinterest-icon.png');
break;
case 'Whatsapp':
- var icon = require('../../assets/images/whatsapp-icon.png');
+ var icon = require('../../assets/socials/whatsapp-icon.png');
break;
case 'Linkedin':
- var icon = require('../../assets/images/linkedin-icon.png');
+ var icon = require('../../assets/socials/linkedin-icon.png');
break;
case 'Snapchat':
- var icon = require('../../assets/images/snapchat-icon.png');
+ var icon = require('../../assets/socials/snapchat-icon.png');
break;
case 'Youtube':
- var icon = require('../../assets/images/youtube-icon.png');
+ var icon = require('../../assets/socials/youtube-icon.png');
break;
case 'TikTok':
- var icon = require('../../assets/images/tiktok-icon.png');
+ var icon = require('../../assets/socials/tiktok-icon.png');
break;
default:
- var icon = require('../../assets/images/logo.png');
+ var icon = require('../../assets/socials/logo.png');
break;
}
return <Image style={style} source={icon} />;
diff --git a/src/components/onboarding/LinkSocialMedia.tsx b/src/components/onboarding/LinkSocialMedia.tsx
index 5f95fac8..03ca3a29 100644
--- a/src/components/onboarding/LinkSocialMedia.tsx
+++ b/src/components/onboarding/LinkSocialMedia.tsx
@@ -22,7 +22,7 @@ import {
LINK_TWITTER_ENDPOINT,
LINK_TWITTER_OAUTH,
} from '../../constants';
-import {SOCIAL_FONT_COLORS} from '../../constants/constants';
+import {SOCIAL_FONT_COLORS, TAGG_ICON_DIM} from '../../constants/constants';
import SocialIcon from '../common/SocialIcon';
interface SocialMediaLinkerProps extends TouchableOpacityProps {
@@ -192,6 +192,8 @@ const styles = StyleSheet.create({
},
icon: {
top: '15%',
+ width: TAGG_ICON_DIM,
+ height: TAGG_ICON_DIM,
},
label: {
fontWeight: '500',
diff --git a/src/components/taggs/Tagg.tsx b/src/components/taggs/Tagg.tsx
index a9bc05a9..9418405d 100644
--- a/src/components/taggs/Tagg.tsx
+++ b/src/components/taggs/Tagg.tsx
@@ -5,7 +5,11 @@ import PurpleRingPlus from '../../assets/icons/purple_ring+.svg';
import PurpleRing from '../../assets/icons/purple_ring.svg';
import RingPlus from '../../assets/icons/ring+.svg';
import Ring from '../../assets/icons/ring.svg';
-import {INTEGRATED_SOCIAL_LIST, TAGG_ICON_DIM} from '../../constants';
+import {
+ INTEGRATED_SOCIAL_LIST,
+ TAGG_ICON_DIM,
+ TAGG_RING_DIM,
+} from '../../constants';
import {
getNonIntegratedURL,
handlePressForAuthBrowser,
@@ -85,15 +89,15 @@ const Tagg: React.FC<TaggProps> = ({
const pickTheRightRingHere = () => {
if (youMayPass) {
if (social === 'Tagg') {
- return <Ring width={TAGG_ICON_DIM} height={TAGG_ICON_DIM} />;
+ return <Ring width={TAGG_RING_DIM} height={TAGG_RING_DIM} />;
} else {
- return <PurpleRing width={TAGG_ICON_DIM} height={TAGG_ICON_DIM} />;
+ return <PurpleRing width={TAGG_RING_DIM} height={TAGG_RING_DIM} />;
}
} else {
if (social === 'Tagg') {
- return <RingPlus width={TAGG_ICON_DIM} height={TAGG_ICON_DIM} />;
+ return <RingPlus width={TAGG_RING_DIM} height={TAGG_RING_DIM} />;
} else {
- return <PurpleRingPlus width={TAGG_ICON_DIM} height={TAGG_ICON_DIM} />;
+ return <PurpleRingPlus width={TAGG_RING_DIM} height={TAGG_RING_DIM} />;
}
}
};
@@ -135,7 +139,7 @@ const styles = StyleSheet.create({
container: {
justifyContent: 'center',
alignItems: 'center',
- marginHorizontal: 5,
+ marginHorizontal: 15,
},
image: {
width: TAGG_ICON_DIM,
diff --git a/src/components/taggs/TaggsBar.tsx b/src/components/taggs/TaggsBar.tsx
index 62f5f90e..61bcd90a 100644
--- a/src/components/taggs/TaggsBar.tsx
+++ b/src/components/taggs/TaggsBar.tsx
@@ -127,7 +127,7 @@ const styles = StyleSheet.create({
},
contentContainer: {
alignItems: 'center',
- paddingHorizontal: 15,
+ paddingHorizontal: 10,
},
});