Personalisation

The application allows for easy configuration of colours and fonts

Colors

All colours in the application are controlled through these 5 colour variables:

1. primary1

2. primary2

3. black

4. white

5. backgroundGray

To update the app's colors, go to src/config/constants.js and replace the hex-colour code with your preferred colour

// TO CHANGE THE MAIN APP COLORS, CHANGE THESE COLOUR CODES
export const COLORS = {
  primary1: '#D7F8C3',
  primary2: '#A3F8FF',
  backgroundGray: '#DDDDDD',
  black: '#020202',
  white: '#fff',
  lightGray: '#C4C4C4', // USED IN SEARCH BAR
};

Fonts

The application applies 2 different font types. These can be replaced with your preferred font in the following steps:

1. Copy your downloaded fonts (must be .otf or .ttf file types) and place these in the fonts folder located at assets/fonts

2. Look for the CustomText component inside src/UI/text/CustomText.js and replace these strings with the new fonts names. Make sure to keep the names exactly the same as the font names you applied in step 1.

   export const TITLE_FONT = 'Montserrat-Regular';
   export const BODY_FONT = 'Chivo-Regular';

Like button animations

The app offers two animation effects for the like button used on posts.

To enable your preferred animation effect, simply change the booleans inside src/config/constants.js to true or false:

export const ENABLE_LIKE_ANIMATION_1 = true;
export const ENABLE_LIKE_ANIMATION_2 = false;