be-components 3.5.3 → 3.5.5

package/lib/commonjs/Bracket/components/BracketCompetitionCard.js

@@ -7,12 +7,12 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _api = require("../api");
-var _colors = _interopRequireDefault(require("../../constants/colors"));
 var _Components = require("../../Components");
 var _momentMini = _interopRequireDefault(require("moment-mini"));
 var _CompetitionLeaderboard = _interopRequireDefault(require("./CompetitionLeaderboard"));
 var _JoinCompetitionCard = _interopRequireDefault(require("./JoinCompetitionCard"));
-var _styles = require("../../constants/styles");
+var _Themed = require("../../Components/Themed");
+var _useColors = require("../../constants/useColors");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -33,6 +33,7 @@ const BracketCompetitionCard = ({
   onShareCompetition,
   onEnterCompetition
 }) => {
+  const Colors = (0, _useColors.useColors)();
   const [action_loading, setActionLoading] = (0, _react.useState)(false);
   const [joining_bracket, setJoiningBracket] = (0, _react.useState)(undefined);
   const [show_rules, setShowRules] = (0, _react.useState)(false);
@@ -122,42 +123,41 @@ const BracketCompetitionCard = ({
   };
   const renderPlayerBrackets = data => {
     const cpb = my_comp_player_brackets.find(mcpb => mcpb.player_bracket_id == data.item.player_bracket_id);
-    return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    return /*#__PURE__*/_react.default.createElement(_Themed.View, {
       style: {
         flexDirection: 'row',
+        alignItems: 'center',
         padding: 5
       }
-    }, /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
+    }, /*#__PURE__*/_react.default.createElement(_Themed.Button, {
       style: {
         flex: 1
       },
       onPress: () => onViewBracket(data.item.bracket_id)
-    }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+    }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
       size: 14,
-      color: _colors.default.brand.midnight,
+      theme: "h1",
       weight: "bold"
-    }, data.item.bracket_name), /*#__PURE__*/_react.default.createElement(_Components.Text, {
+    }, data.item.bracket_name), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
       style: {
         marginTop: 3
       },
       size: 12,
-      color: _colors.default.brand.midnight,
+      theme: "description",
       weight: "regular"
-    }, (data.item.completion_pct * 100).toFixed(2), "% Complete")), !cpb ? /*#__PURE__*/_react.default.createElement(_Components.Button, {
+    }, (data.item.completion_pct * 100).toFixed(2), "% Complete")), !cpb ? /*#__PURE__*/_react.default.createElement(_Themed.Button, {
       title: "Join",
       loading: action_loading,
-      backgroundColor: _colors.default.utility.success,
-      title_color: _colors.default.shades.white,
+      type: "success",
       onPress: () => setJoiningBracket(data.item)
-    }) : cpb && can_leave ? /*#__PURE__*/_react.default.createElement(_Components.Button, {
+    }) : cpb && can_leave ? /*#__PURE__*/_react.default.createElement(_Themed.Button, {
       title: "Leave",
       disabled: action_loading,
       style: {
         opacity: action_loading ? 0.5 : 1
       },
       loading: action_loading,
-      backgroundColor: _colors.default.utility.error,
-      title_color: _colors.default.shades.white,
+      type: "error",
       onPress: () => handleLeave(cpb.competition_player_bracket_id)
     }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null));
   };
@@ -169,21 +169,22 @@ const BracketCompetitionCard = ({
     if (!bracket_round) {
       return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
     }
-    return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    return /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      transparent: true,
       style: {
         flexDirection: 'row',
         padding: 10
       }
-    }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+    }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
       style: {
         flex: 1
       },
       size: 14,
-      color: _colors.default.brand.midnight,
+      theme: "h1",
       weight: "bold"
-    }, bracket_round.round_name), /*#__PURE__*/_react.default.createElement(_Components.Text, {
+    }, bracket_round.round_name), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
       size: 14,
-      color: _colors.default.brand.midnight,
+      theme: "h1",
       weight: "bold"
     }, data.item.win_points, " Points"));
   };
@@ -191,49 +192,47 @@ const BracketCompetitionCard = ({
     return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
   }
   if (!loaded || !bracket_competition || !bracket || loading) {
-    return /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.ActivityIndicator, {
+    return /*#__PURE__*/_react.default.createElement(_Themed.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.ActivityIndicator, {
       style: {
         padding: 20,
         alignSelf: 'center'
       },
       size: "large",
-      color: _colors.default.brand.midnight
+      color: Colors.text.h1
     }));
   }
   let payout = _api.BracketCompetitionHelpers.getPayout(bracket_competition);
-  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  return /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
-      flex: 1,
-      backgroundColor: _colors.default.shades.shade100
+      flex: 1
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       borderBottomWidth: 1,
-      borderColor: _colors.default.shades.shade600,
-      backgroundColor: _colors.default.shades.white
+      borderColor: Colors.borders.light
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       padding: 20,
       flexDirection: 'row',
       alignItems: 'center'
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Button, {
     style: {
       flex: 1,
       flexDirection: 'row',
       alignItems: 'center'
     },
     onPress: () => onClose()
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       padding: 10
     }
   }, /*#__PURE__*/_react.default.createElement(_Components.Icons.ChevronIcon, {
     size: 12,
-    color: _colors.default.brand.midnight,
+    color: Colors.text.h1,
     direction: "left"
-  })), /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
+  })), /*#__PURE__*/_react.default.createElement(_Themed.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
     source: {
       uri: bracket_competition.image?.url
     },
@@ -243,39 +242,44 @@ const BracketCompetitionCard = ({
       borderRadius: 4
     },
     resizeMode: "cover"
-  })), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  })), /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       flex: 1,
       marginLeft: 10
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     weight: "bold",
     size: 14,
-    color: _colors.default.brand.midnight
-  }, bracket_competition.competition_name), /*#__PURE__*/_react.default.createElement(_Components.Text, {
+    theme: "h1"
+  }, bracket_competition.competition_name), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     style: {
       marginTop: 4
     },
     size: 12,
-    color: _colors.default.brand.slate
-  }, bracket_competition.competition_description))), /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
+    theme: "light"
+  }, bracket_competition.competition_description))), /*#__PURE__*/_react.default.createElement(_Themed.Button, {
     style: {
       padding: 10
     },
     onPress: () => onShareCompetition(bracket_competition.bracket_competition_id)
   }, /*#__PURE__*/_react.default.createElement(_Components.Icons.ShareIcon, {
-    color: _colors.default.brand.electric,
+    color: Colors.text.action,
     size: 12
   })))), /*#__PURE__*/_react.default.createElement(_reactNative.ScrollView, {
     style: {
       flex: 1
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: local_styles.header
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
-    style: local_styles.section_header,
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, null, /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+    float: true,
+    style: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      borderRadius: 0
+    },
     onPress: () => setShowBracket(!show_bracket)
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
     source: {
       uri: 'https://res.cloudinary.com/hoabts6mc/image/upload/v1677259366/Bracket_image_h0fkku.webp'
     },
@@ -285,47 +289,52 @@ const BracketCompetitionCard = ({
       borderRadius: 4
     },
     resizeMode: "cover"
-  })), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  })), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       flex: 1,
       marginLeft: 10
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     size: 16,
-    color: _colors.default.brand.midnight,
+    theme: "h1",
     weight: "bold"
-  }, bracket.bracket_name), /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, bracket.bracket_name), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     style: {
       marginTop: 3
     },
     size: 14,
-    color: _colors.default.brand.slate,
+    theme: "light",
     weight: "regular"
   }, "Bracket starts ", (0, _momentMini.default)(bracket.scheduled_datetime).format('MMM DD YYYY hh:mm a'))), /*#__PURE__*/_react.default.createElement(_Components.Icons.ChevronIcon, {
     size: 10,
     direction: show_bracket ? 'up' : 'down',
-    color: _colors.default.brand.midnight
-  })), show_bracket ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    color: Colors.text.h1
+  })), show_bracket ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    float: true,
     style: {
-      padding: 20
+      padding: 20,
+      borderRadius: 0
     }
-  }, my_player_brackets.length > 0 ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, my_player_brackets.length > 0 ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       borderWidth: 1,
-      borderColor: _colors.default.shades.shade600,
+      borderColor: Colors.borders.light,
       borderRadius: 8
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       borderBottomWidth: 1,
-      borderBottomColor: _colors.default.shades.shade600,
+      borderBottomColor: Colors.borders.light,
       padding: 10
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     size: 16,
-    color: _colors.default.brand.slate,
+    theme: "light",
     weight: "regular"
-  }, "MY ELIGIBLE BRACKETS")), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, "MY ELIGIBLE BRACKETS")), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       padding: 10
     }
@@ -333,133 +342,138 @@ const BracketCompetitionCard = ({
     data: my_player_brackets,
     renderItem: renderPlayerBrackets,
     keyExtractor: item => item.player_bracket_id.toString()
-  }))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       margin: 10,
       marginBottom: 0
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Button, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Button, {
     title: "Fill Out Bracket",
-    padding: 15,
-    title_color: _colors.default.shades.white,
-    backgroundColor: _colors.default.brand.electric,
+    type: "success",
     onPress: () => onViewBracket(bracket.bracket_id)
-  }))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: local_styles.header
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
-    style: local_styles.section_header,
+  }))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)), /*#__PURE__*/_react.default.createElement(_Themed.View, null, /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+    float: true,
+    style: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      borderRadius: 0
+    },
     onPress: () => setShowInfo(!show_info)
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       flex: 1
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     size: 16,
-    color: _colors.default.brand.midnight,
+    theme: "h1",
     weight: "bold"
-  }, "COMPETITION DETAILS"), /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, "COMPETITION DETAILS"), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     style: {
       marginTop: 3
     },
     size: 14,
-    color: _colors.default.brand.slate,
+    theme: "light",
     weight: "regular"
   }, "Detailed Information on this competition")), /*#__PURE__*/_react.default.createElement(_Components.Icons.ChevronIcon, {
     size: 10,
     direction: show_info ? 'up' : 'down',
-    color: _colors.default.brand.midnight
-  })), show_info ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    color: Colors.text.h1
+  })), show_info ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
+    float: true,
     style: {
       padding: 10,
-      margin: 10,
+      borderRadius: 0,
       borderWidth: 1,
-      borderRadius: 8,
-      borderColor: _colors.default.shades.shade600
+      borderColor: Colors.borders.light
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       flexDirection: 'row',
       alignItems: 'center',
       padding: 5
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     style: {
       flex: 1
     },
     size: 14,
     weight: "bold",
-    color: _colors.default.brand.midnight
-  }, "Entries"), /*#__PURE__*/_react.default.createElement(_Components.Text, {
+    theme: "h1"
+  }, "Entries"), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     size: 14,
-    color: _colors.default.brand.midnight,
+    theme: "h1",
     weight: "bold"
-  }, bracket_competition.tickets_sold, " / ", bracket_competition.max_brackets)), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, bracket_competition.tickets_sold, " / ", bracket_competition.max_brackets)), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       flexDirection: 'row',
       alignItems: 'center',
       padding: 5
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     style: {
       flex: 1
     },
     size: 14,
-    weight: "bold",
-    color: _colors.default.brand.midnight
-  }, "Ticket Price"), /*#__PURE__*/_react.default.createElement(_Components.Text, {
+    theme: "h1"
+  }, "Ticket Price"), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     size: 14,
-    color: _colors.default.brand.midnight,
-    weight: "bold"
-  }, "$", bracket_competition.buy_in.toFixed(2))), result_type ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    theme: "h1"
+  }, "$", bracket_competition.buy_in.toFixed(2))), result_type ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       flexDirection: 'row',
       alignItems: 'center',
       padding: 5
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     style: {
       flex: 1
     },
     size: 14,
-    weight: "bold",
-    color: _colors.default.brand.midnight
-  }, "Payout Type"), /*#__PURE__*/_react.default.createElement(_Components.Text, {
+    theme: "h1"
+  }, "Payout Type"), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     size: 14,
-    color: _colors.default.brand.midnight,
+    theme: "h1",
     weight: "bold"
-  }, result_type.label)) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, result_type.label)) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       flexDirection: 'row',
       alignItems: 'center',
       padding: 5
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     style: {
       flex: 1
     },
     size: 14,
-    weight: "bold",
-    color: _colors.default.brand.midnight
-  }, "Current Payout"), /*#__PURE__*/_react.default.createElement(_Components.Text, {
+    theme: "h1"
+  }, "Current Payout"), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     size: 14,
-    color: _colors.default.brand.midnight,
-    weight: "bold"
-  }, "$", payout.toFixed(2))), bracket_competition.prize_override ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    theme: "h1"
+  }, "$", payout.toFixed(2))), bracket_competition.prize_override ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       marginTop: 5,
-      backgroundColor: _colors.default.incentive.gold_faded,
+      backgroundColor: Colors.absolutes.incentive.gold_faded,
       padding: 10,
       borderRadius: 8
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       padding: 5
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     size: 14,
-    color: _colors.default.incentive.gold,
+    color: Colors.text.gold,
     weight: "bold"
-  }, "Additional Prize")), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, "Additional Prize")), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       padding: 5,
       flexDirection: 'row',
@@ -475,79 +489,82 @@ const BracketCompetitionCard = ({
       borderRadius: 4
     },
     resizeMode: "cover"
-  }), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }), /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       flex: 1,
       marginLeft: 5
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     size: 14,
-    color: _colors.default.brand.midnight,
-    weight: "bold"
-  }, bracket_competition.prize_override)))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: local_styles.header
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
-    style: local_styles.section_header,
+    theme: "h1"
+  }, bracket_competition.prize_override)))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)), /*#__PURE__*/_react.default.createElement(_Themed.View, null, /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+    float: true,
+    style: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      borderRadius: 0
+    },
     onPress: () => setShowRules(!show_rules)
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       flex: 1
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     size: 16,
-    color: _colors.default.brand.midnight,
-    weight: "bold"
-  }, "SCORING RULES"), /*#__PURE__*/_react.default.createElement(_Components.Text, {
+    theme: "h1"
+  }, "SCORING RULES"), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     style: {
       marginTop: 3
     },
     size: 14,
-    color: _colors.default.brand.slate,
-    weight: "regular"
+    theme: "light"
   }, "Rules on how picks are scored within each bracket round")), /*#__PURE__*/_react.default.createElement(_Components.Icons.ChevronIcon, {
     size: 10,
     direction: show_rules ? 'up' : 'down',
-    color: _colors.default.brand.midnight
-  })), show_rules ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    color: Colors.text.h1
+  })), show_rules ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    float: true,
     style: {
       padding: 10,
       marginBottom: 15,
-      backgroundColor: _colors.default.shades.shade600,
-      borderRadius: 8,
-      marginLeft: 10,
-      marginRight: 10
+      borderRadius: 0
     }
   }, /*#__PURE__*/_react.default.createElement(_reactNative.FlatList, {
     data: bracket_competition_scoring_rules.sort((a, b) => a.round_number - b.round_number),
     renderItem: renderRules,
     keyExtractor: item => item.bracket_competition_scoring_rule_id.toString()
-  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: local_styles.header
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
-    style: local_styles.section_header,
+  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)), /*#__PURE__*/_react.default.createElement(_Themed.View, null, /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+    float: true,
+    style: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      borderRadius: 0
+    },
     onPress: () => setShowLeaders(!show_leaders)
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    transparent: true,
     style: {
       flex: 1
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     size: 16,
-    color: _colors.default.brand.midnight,
-    weight: "bold"
-  }, "LEADERBOARD"), /*#__PURE__*/_react.default.createElement(_Components.Text, {
+    theme: "h1"
+  }, "LEADERBOARD"), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     style: {
       marginTop: 3
     },
     size: 14,
-    color: _colors.default.brand.slate,
-    weight: "regular"
+    theme: "light"
   }, "Leaderboard showing points and the current payouts.")), /*#__PURE__*/_react.default.createElement(_Components.Icons.ChevronIcon, {
     size: 10,
     direction: show_leaders ? 'up' : 'down',
-    color: _colors.default.brand.midnight
-  })), show_leaders ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    color: Colors.text.h1
+  })), show_leaders ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    float: true,
     style: {
-      padding: 10
+      padding: 10,
+      borderRadius: 0
     }
   }, /*#__PURE__*/_react.default.createElement(_CompetitionLeaderboard.default, {
     my_competition_player_brackets: my_comp_player_brackets,
@@ -556,21 +573,17 @@ const BracketCompetitionCard = ({
     view_mode: "short",
     show_champions: _api.BracketCompetitionHelpers.showChampions(bracket_competition),
     onViewFull: () => setShowLeaderboard(true)
-  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null))), show_leaderboard ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null))), show_leaderboard ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    type: "blur",
     style: {
       position: 'absolute',
       left: 0,
       right: 0,
       bottom: 0
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Spring, {
-    to: 0,
-    from: 500,
-    slide: "vertical"
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
-      height,
-      backgroundColor: _colors.default.shades.white
+      height
     }
   }, /*#__PURE__*/_react.default.createElement(_CompetitionLeaderboard.default, {
     bracket_competition_id: bracket_competition.bracket_competition_id,
@@ -579,14 +592,14 @@ const BracketCompetitionCard = ({
     onClose: () => setShowLeaderboard(false),
     my_competition_player_brackets: my_comp_player_brackets,
     my_player_brackets: my_player_brackets
-  })))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), joining_bracket ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), joining_bracket ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    type: "blur",
     style: {
       position: 'absolute',
       top: 0,
       bottom: 0,
       left: 0,
       right: 0,
-      backgroundColor: _colors.default.shades.black_faded_heavy,
       justifyContent: 'center',
       alignItems: 'center'
     }
@@ -601,20 +614,5 @@ const BracketCompetitionCard = ({
     onEnterCompetition: cpb => handleEnter(cpb)
   })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null));
 };
-const local_styles = _reactNative.StyleSheet.create({
-  header: {
-    margin: 10,
-    backgroundColor: _colors.default.shades.white,
-    borderRadius: 8,
-    ..._styles.view_styles.float
-  },
-  section_header: {
-    padding: 10,
-    paddingLeft: 20,
-    paddingRight: 20,
-    flexDirection: 'row',
-    alignItems: 'center'
-  }
-});
 var _default = exports.default = BracketCompetitionCard;
 //# sourceMappingURL=BracketCompetitionCard.js.map