@plusscommunities/pluss-core-app 8.0.0 → 8.0.1-auth.0

package/src/colours.js

@@ -1,50 +1,50 @@
 // const COLOUR_1 = '#011d5c';
 // const COLOUR_2 = '#3179cb';
 // const COLOUR_3 = '#1bb7ee';
-const TEXT_DARKEST = '#3e4245';
+const TEXT_DARKEST = "#3e4245";
 const TEXT_DARK = TEXT_DARKEST;
-const TEXT_BLUEGREY = '#6c7a90';
+const TEXT_BLUEGREY = "#6c7a90";
 // const TEXT_DARK_ALPHA50 = 'rgba(60, 60, 80, .5)';
 // const TEXT_DARK_ALPHA20 = 'rgba(60, 60, 80, .2)';
-// const TEXT_DARK_ALPHA10 = 'rgba(60, 60, 80, .1)';
-const TEXT_MID = '#5a5a6e';
-// const TEXT_MID_ALPHA50 = 'rgba(90, 90, 110, .5)';
-const TEXT_LIGHT = '#717b81';
-const TEXT_LIGHTER = 'rgba(113, 123, 129, 0.8)';
-const TEXT_SUPER_LIGHT = '#d1d1d1';
-const BG_GREY = '#e9e9ef';
-const LINEGREY = '#d5dde4';
-const BOXGREY = '#ebeff2';
-const PINKISH_GREY = '#c4c4c4';
+const TEXT_DARK_ALPHA10 = "rgba(60, 60, 80, .1)";
+const TEXT_MID = "#5a5a6e";
+const TEXT_MID_ALPHA50 = "rgba(90, 90, 110, .5)";
+const TEXT_LIGHT = "#717b81";
+const TEXT_LIGHTER = "rgba(113, 123, 129, 0.8)";
+const TEXT_SUPER_LIGHT = "#d1d1d1";
+const BG_GREY = "#e9e9ef";
+const LINEGREY = "#d5dde4";
+const BOXGREY = "#ebeff2";
+const PINKISH_GREY = "#c4c4c4";
 // const PALE_GREY = '#f6f7f9';
-const INACTIVE_BUTTON = '#d5d9e1';
-const INACTIVE_TEXT = 'rgba(113, 123, 130, 0.8)';
-const COLOUR_TEAL = '#82d6e5';
+const INACTIVE_BUTTON = "#d5d9e1";
+const INACTIVE_TEXT = "rgba(113, 123, 130, 0.8)";
+const COLOUR_TEAL = "#82d6e5";
 // const COLOUR_TEAL_ALPHA50 = 'rgba(4, 196, 169, 0.2)';
 // const COLOUR_BLUE = '#0083ee';
 // const COLOUR_BLUE_LIVE = 'rgb(0, 173, 238)';
 // const COLOUR_BLUE_ALPHA10 = 'rgba(0, 131, 238, 0.1)';
 // const COLOUR_DARKBLUE = '#191e78';
 // const COLOUR_PURPLE = '#8e44ad';
-const COLOUR_RED = '#C52F40';
-const COLOUR_GRAPEFRUIT = '#FF6363';
-const COLOUR_GREEN = '#00cc76';
-const COLOUR_GREEN_LIGHT = '#58dba4';
-const COLOUR_TANGERINE = '#ff8c75';
+const COLOUR_RED = "#C52F40";
+const COLOUR_GRAPEFRUIT = "#FF6363";
+const COLOUR_GREEN = "#00cc76";
+const COLOUR_GREEN_LIGHT = "#58dba4";
+const COLOUR_TANGERINE = "#ff8c75";
 // const COLOUR_CITRON = '#bdbd27';
 // const DARK_OVERLAY = 'rgba(19,19,26,.6)';
 // const FACEBOOK_BLUE = '#3B5998';
 // const COLOUR_NAV_GREY = '#f6f6f6';
-const COLOUR_TRANSPARENT = 'rgba(0,0,0,0)';
+const COLOUR_TRANSPARENT = "rgba(0,0,0,0)";
 // const COLOUR_SIDEBAR = '#303030';
-const COLOUR_BRANDING_MAIN = '#FF6363';
+const COLOUR_BRANDING_MAIN = "#FF6363";
 // const COLOUR_BRANDING_OFF = '#FCE1E1';
-const COLOUR_BRANDING_LIGHT = '#FCE1E1';
+const COLOUR_BRANDING_LIGHT = "#FCE1E1";
 // const COLOUR_BRANDING_SECONDARY = COLOUR_BRANDING_MAIN;
-const COLOUR_BRANDING_DARK = '#D13636';
+const COLOUR_BRANDING_DARK = "#D13636";
 // const COLOUR_DAY = '#89c4f4';
 // const COLOUR_NIGHT = '#003159';
-const COLOUR_TAN = '#fff3d1';
+const COLOUR_TAN = "#fff3d1";
 
 // const hexToRGB = hex => {
 //   // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
@@ -64,14 +64,16 @@ const COLOUR_TAN = '#fff3d1';
 // };
 
 const hexToRGBAstring = (hex, opacity) => {
-  // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
-  const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
-  hex = hex.replace(shorthandRegex, (m, r, g, b) => {
-    return r + r + g + g + b + b;
-  });
+	// Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
+	const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
+	hex = hex.replace(shorthandRegex, (m, r, g, b) => {
+		return r + r + g + g + b + b;
+	});
 
-  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
-  return result ? `rgba(${parseInt(result[1], 16)}, ${parseInt(result[2], 16)}, ${parseInt(result[3], 16)}, ${opacity})` : null;
+	const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+	return result
+		? `rgba(${parseInt(result[1], 16)}, ${parseInt(result[2], 16)}, ${parseInt(result[3], 16)}, ${opacity})`
+		: null;
 };
 
 // const pctBtwnColours = (c1, c2, percentage) => {
@@ -97,16 +99,34 @@ const hexToRGBAstring = (hex, opacity) => {
 //   return (state && state.user && state.user.siteBranding && state.user.siteBranding.HeaderBrandingColour) || null;
 // };
 
-const getMainBrandingColourFromState = state => {
-  return (state && state.user && state.user.siteBranding && state.user.siteBranding.MainBrandingColour) || COLOUR_BRANDING_MAIN;
+const getMainBrandingColourFromState = (state) => {
+	return (
+		(state &&
+			state.user &&
+			state.user.siteBranding &&
+			state.user.siteBranding.MainBrandingColour) ||
+		COLOUR_BRANDING_MAIN
+	);
 };
 
-const getDarkBrandingColourFromState = state => {
-  return (state && state.user && state.user.siteBranding && state.user.siteBranding.DarkBrandingColour) || COLOUR_BRANDING_DARK;
+const getDarkBrandingColourFromState = (state) => {
+	return (
+		(state &&
+			state.user &&
+			state.user.siteBranding &&
+			state.user.siteBranding.DarkBrandingColour) ||
+		COLOUR_BRANDING_DARK
+	);
 };
 
-const getLightBrandingColourFromState = state => {
-  return (state && state.user && state.user.siteBranding && state.user.siteBranding.LightBrandingColour) || COLOUR_BRANDING_LIGHT;
+const getLightBrandingColourFromState = (state) => {
+	return (
+		(state &&
+			state.user &&
+			state.user.siteBranding &&
+			state.user.siteBranding.LightBrandingColour) ||
+		COLOUR_BRANDING_LIGHT
+	);
 };
 
 // const getSecondaryBrandingColourFromState = state => {
@@ -126,62 +146,62 @@ const getLightBrandingColourFromState = state => {
 // };
 
 export {
-  // COLOUR_1,
-  // COLOUR_2,
-  // COLOUR_3,
-  TEXT_DARKEST,
-  TEXT_BLUEGREY,
-  TEXT_DARK,
-  // TEXT_DARK_ALPHA50,
-  // TEXT_DARK_ALPHA20,
-  // TEXT_DARK_ALPHA10,
-  TEXT_MID,
-  // TEXT_MID_ALPHA50,
-  TEXT_LIGHT,
-  TEXT_LIGHTER,
-  TEXT_SUPER_LIGHT,
-  BG_GREY,
-  LINEGREY,
-  PINKISH_GREY,
-  BOXGREY,
-  // PALE_GREY,
-  INACTIVE_BUTTON,
-  INACTIVE_TEXT,
-  COLOUR_TEAL,
-  // COLOUR_TEAL_ALPHA50,
-  // COLOUR_BLUE,
-  // COLOUR_BLUE_LIVE,
-  // COLOUR_BLUE_ALPHA10,
-  // COLOUR_DARKBLUE,
-  // COLOUR_PURPLE,
-  COLOUR_RED,
-  COLOUR_TANGERINE,
-  // COLOUR_CITRON,
-  // DARK_OVERLAY,
-  // hexToRGB,
-  hexToRGBAstring,
-  // pctBtwnColours,
-  // FACEBOOK_BLUE,
-  // COLOUR_NAV_GREY,
-  COLOUR_TRANSPARENT,
-  // COLOUR_SIDEBAR,
-  COLOUR_BRANDING_MAIN,
-  // COLOUR_BRANDING_OFF,
-  COLOUR_BRANDING_LIGHT,
-  COLOUR_BRANDING_DARK,
-  COLOUR_GREEN,
-  COLOUR_GREEN_LIGHT,
-  COLOUR_GRAPEFRUIT,
-  // COLOUR_DAY,
-  // COLOUR_NIGHT,
-  COLOUR_TAN,
-  // getHeaderBrandingColourFromState,
-  getMainBrandingColourFromState,
-  getDarkBrandingColourFromState,
-  getLightBrandingColourFromState,
-  // getSecondaryBrandingColourFromState,
-  // getMainBrandingColourFromSite,
-  // getDarkBrandingColourFromSite,
-  // getLightBrandingColourFromSite,
-  // getTabIconColour,
+	// COLOUR_1,
+	// COLOUR_2,
+	// COLOUR_3,
+	TEXT_DARKEST,
+	TEXT_BLUEGREY,
+	TEXT_DARK,
+	// TEXT_DARK_ALPHA50,
+	// TEXT_DARK_ALPHA20,
+	TEXT_DARK_ALPHA10,
+	TEXT_MID,
+	TEXT_MID_ALPHA50,
+	TEXT_LIGHT,
+	TEXT_LIGHTER,
+	TEXT_SUPER_LIGHT,
+	BG_GREY,
+	LINEGREY,
+	PINKISH_GREY,
+	BOXGREY,
+	// PALE_GREY,
+	INACTIVE_BUTTON,
+	INACTIVE_TEXT,
+	COLOUR_TEAL,
+	// COLOUR_TEAL_ALPHA50,
+	// COLOUR_BLUE,
+	// COLOUR_BLUE_LIVE,
+	// COLOUR_BLUE_ALPHA10,
+	// COLOUR_DARKBLUE,
+	// COLOUR_PURPLE,
+	COLOUR_RED,
+	COLOUR_TANGERINE,
+	// COLOUR_CITRON,
+	// DARK_OVERLAY,
+	// hexToRGB,
+	hexToRGBAstring,
+	// pctBtwnColours,
+	// FACEBOOK_BLUE,
+	// COLOUR_NAV_GREY,
+	COLOUR_TRANSPARENT,
+	// COLOUR_SIDEBAR,
+	COLOUR_BRANDING_MAIN,
+	// COLOUR_BRANDING_OFF,
+	COLOUR_BRANDING_LIGHT,
+	COLOUR_BRANDING_DARK,
+	COLOUR_GREEN,
+	COLOUR_GREEN_LIGHT,
+	COLOUR_GRAPEFRUIT,
+	// COLOUR_DAY,
+	// COLOUR_NIGHT,
+	COLOUR_TAN,
+	// getHeaderBrandingColourFromState,
+	getMainBrandingColourFromState,
+	getDarkBrandingColourFromState,
+	getLightBrandingColourFromState,
+	// getSecondaryBrandingColourFromState,
+	// getMainBrandingColourFromSite,
+	// getDarkBrandingColourFromSite,
+	// getLightBrandingColourFromSite,
+	// getTabIconColour,
 };

package/src/components/AddButton.js

@@ -1,9 +1,9 @@
-import React, { PureComponent } from 'react';
-import { TouchableOpacity } from 'react-native';
-import { connect } from 'react-redux';
-import Styles from '../styles';
-import { Pl60Icon } from '../fonts';
-import { getMainBrandingColourFromState } from '../colours';
+import React, { PureComponent } from "react";
+import { TouchableOpacity } from "react-native";
+import { connect } from "react-redux";
+import Styles from "../styles";
+import { FontAwesome } from "./Icon";
+import { getMainBrandingColourFromState } from "../colours";
 
 /* 
 Props- 
@@ -14,29 +14,34 @@ Props-
 */
 
 class AddButton extends PureComponent {
-  render() {
-    const size = this.props.diameter || 48;
-    const radius = size / 2;
-    return (
-      <TouchableOpacity
-        style={[
-          Styles.addButton,
-          { height: size, width: size, borderRadius: radius, backgroundColor: this.props.colourBrandingMain },
-          this.props.color && { backgroundColor: this.props.color },
-          this.props.style,
-        ]}
-        onPress={this.props.onPress}
-      >
-        <Pl60Icon name="pluss" style={Styles.addButtonIcon} />
-      </TouchableOpacity>
-    );
-  }
+	render() {
+		const size = this.props.diameter || 48;
+		const radius = size / 2;
+		return (
+			<TouchableOpacity
+				style={[
+					Styles.addButton,
+					{
+						height: size,
+						width: size,
+						borderRadius: radius,
+						backgroundColor: this.props.colourBrandingMain,
+					},
+					this.props.color && { backgroundColor: this.props.color },
+					this.props.style,
+				]}
+				onPress={this.props.onPress}
+			>
+				<FontAwesome name="plus" style={Styles.addButtonIcon} />
+			</TouchableOpacity>
+		);
+	}
 }
 
-const mapStateToProps = state => {
-  return {
-    colourBrandingMain: getMainBrandingColourFromState(state),
-  };
+const mapStateToProps = (state) => {
+	return {
+		colourBrandingMain: getMainBrandingColourFromState(state),
+	};
 };
 
 const addButton = connect(mapStateToProps, {})(AddButton);